From f95d2599fd6828abd77d840927ab296d42febf5f Mon Sep 17 00:00:00 2001 From: Benji Grant Date: Fri, 24 Oct 2025 21:09:10 +1100 Subject: [PATCH] Add an example of a palette snippet to the readme --- README.md | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/README.md b/README.md index 1754b7b..b0b199b 100644 --- a/README.md +++ b/README.md @@ -32,6 +32,17 @@ This plugin supports custom color palettes which you can use by enabling the set Enabling the setting exposes classes for every inline code block surrounded by parentheses, replacing all spaces with hyphens, and converting to lowercase. For example, \`(RAL 170 50 10)\` exposes the class `.ral-170-50-10`. If that class gets a `color` set, it will show a color inlay. +Note, the plugin detects classes that target `.css-color-inlay` only, see the example below. + +```css +.css-color-inlay.my-cool-color { color: #663399; } +/* Or, use CSS nesting */ +.css-color-inlay { + &.my-hot-color { color: orangered; } +} +/* Now `(my cool color)` and `(my hot color)` will have inlays */ +``` + #### Predefined Palettes There are 6 [predefined color palettes](./palettes.css) you can download using the button in the settings, and it includes the following: