From c1ac0faf7878155f8ff720a9b9535109e03e286b Mon Sep 17 00:00:00 2001 From: Bradley Date: Tue, 27 Jun 2023 11:41:57 +0100 Subject: [PATCH] Update readme --- README.md | 22 +++++++--------------- 1 file changed, 7 insertions(+), 15 deletions(-) diff --git a/README.md b/README.md index 05d832e..601d387 100644 --- a/README.md +++ b/README.md @@ -33,11 +33,12 @@ pcm_icon: fill-group-hover: 'group-hover:fill-red-800' stroke-group-hover: 'group-hover:stroke-red-800' ``` -# @TODO default options + +`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 specify all the classes. This is a bit awkward, but you can just copy this template replacing COLOUR as appropriate: +`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: @@ -51,22 +52,13 @@ COLOUR: ## Options -`icon (string)` **(REQUIRED)** Icon to use, without the `.svg` extension +`icon (string)` **(REQUIRED)** Icon to use, without the `.svg` extension. -`title (string)` Optional text to show on hover +`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 +`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 however you are not using `primary` to set a Tailwind primary colour in your project, you can instead set the default colour of the icon by changing what colour classes the primary colour uses. EG: -```yaml -primary: - fill: 'fill-purple-700' - stroke: 'stroke-purple-700' - fill-hover: 'hover:fill-purple-700' - stroke-hover: 'hover:stroke-purple-700' - fill-group-hover: 'group-hover:fill-purple-700' - stroke-group-hover: 'group-hover:stroke-purple-700' -``` +`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