# DEPRECATED in favour of Symfony UX Icon

# PCM Icon Bundle

Use icons inside of Twig templates with ease! Project must be using Tailwind for the colours to work properly.


```php
{{ pcm_icon({ icon: 'person' }) }}
```

## Config
Example config:
```yaml
# config/packages/pcm_icon.yaml
pcm_icon:
    default:
        size: 32
        colour: primary
    directories:
        - '%kernel.project_dir%/public/icons'
    colours:
        primary:
            fill:                             'fill-primary'
            stroke:                         'stroke-primary'
            fill-hover:                 'hover:fill-primary'
            stroke-hover:             'hover:stroke-primary'
            fill-group-hover:     'group-hover:fill-primary'
            stroke-group-hover: 'group-hover:stroke-primary'
        red:
            fill:                             'fill-red-800'
            stroke:                         'stroke-red-800'
            fill-hover:                 'hover:fill-red-800'
            stroke-hover:             'hover:stroke-red-800'
            fill-group-hover:     'group-hover:fill-red-800'
            stroke-group-hover: 'group-hover:stroke-red-800'
```

`default` - Override the default options provided to the bundle.

`directories` - Which directories to look in for icons.

`colours` - Custom colours to use when colouring icons. Because this extension relies on Tailwind classes for colouring we **must** explicitly list all the classes required for Tailwind to render them properly. You can just copy this template replacing COLOUR as appropriate:

```yaml
COLOUR:
    fill:                             'fill-COLOUR'
    stroke:                         'stroke-COLOUR'
    fill-hover:                 'hover:fill-COLOUR'
    stroke-hover:             'hover:stroke-COLOUR'
    fill-group-hover:     'group-hover:fill-COLOUR'
    stroke-group-hover: 'group-hover:stroke-COLOUR'
```

## Options

`icon (string)` **(REQUIRED)** Icon to use, without the `.svg` extension.

`title (string)` Optional text to show on hover. This can be null, but not an empty string.

`size (int)` Size of the icon in pixels.

`colour (string)` Name of the colour to use. Defaults to `primary` as it assumes you have a Tailwind colour set up called `primary`. If you are not using `primary` to set a Tailwind primary colour in your project you can change the default colour in the `pcm_icon.yaml` file.

`hover (string)` Name of the colour to use when the icon is hovered over

`classes (string[])` Additional classes to add to the icon. This can cause Tailwind class collisions, so only use it as a last resort.

## Reminders
Remember to add `./config/packages/*.yaml` as a value in your Tailwind config content array if it does not already exist. This will ensure Tailwind classes inside of the config file get compiled.