Thank you Eric.
I tried your example it works fine except that the chosen option does not
remain colored.
Is this behavior on purpose ?
On Tuesday, 27 September 2022 at 16:54:30 UTC+2 Eric Shulman wrote:
> You can you CSS `class` or `style` attributes to specify the `background`
> color attribute, like this:
>
> Using classnames:
> ```
> <style>
> .red { background:red; }
> .green { background:green; }
> .blue { background:blue; }
> </style>
>
> <$select field="color">
> <option class="red">item 1</option>
> <option class="green">item 2</option>
> <option class="blue">item 3</option>
> </$select>
> ```
>
> Using direct styles and a $list of colors:
> ```
> <$select field="color">
> <$list filter="red green blue" variable=thisColor>
> <option style={{{ [[background:]] [<thisColor>] [[;]] +[join[]] }}}>
> <<thisColor>>
> </option>
> </$list>
> </$select>
> ```
>
> In fact, I have used this technique myself to create a "select a color"
> drop list that shows a list of "X11 Color Names"
> ```
> \define X11Colors()
> AliceBlue AntiqueWhite Aqua Aquamarine Azure Beige Bisque Black
> BlanchedAlmond Blue BlueViolet Brown Burlywood CadetBlue Chartreuse
> Chocolate Coral CornflowerBlue Cornsilk Crimson Cyan DarkBlue DarkCyan
> DarkGoldenrod DarkGray DarkGreen DarkKhaki DarkMagenta DarkOliveGreen
> DarkOrange DarkOrchid DarkRed DarkSalmon DarkSeaGreen DarkSlateBlue
> DarkSlateGray DarkTurquoise DarkViolet DeepPink DeepSkyBlue DimGray
> DodgerBlue Firebrick FloralWhite ForestGreen Fuchsia Gainsboro GhostWhite
> Gold Goldenrod Gray Green GreenYellow Honeydew HotPink IndianRed Indigo
> Ivory Khaki Lavender LavenderBlush LawnGreen LemonChiffon LightBlue
> LightCoral LightCyan LightGoldenrodYellow LightGray LightGreen LightPink
> LightSalmon LightSeaGreen LightSkyBlue LightSlateGray LightSteelBlue
> LightYellow Lime LimeGreen Linen Magenta Maroon MediumAquamarine MediumBlue
> MediumOrchid MediumPurple MediumSeaGreen MediumSlateBlue MediumSpringGreen
> MediumTurquoise MediumVioletRed MidnightBlue MintCream MistyRose Moccasin
> NavajoWhite Navy OldLace Olive OliveDrab Orange OrangeRed Orchid
> PaleGoldenrod PaleGreen PaleTurquoise PaleVioletRed PapayaWhip PeachPuff
> Peru Pink Plum PowderBlue Purple RebeccaPurple Red RosyBrown RoyalBlue
> SaddleBrown Salmon SandyBrown SeaGreen Seashell Sienna Silver SkyBlue
> SlateBlue SlateGray Snow SpringGreen SteelBlue Tan Teal Thistle Tomato
> Turquoise Violet Wheat White WhiteSmoke Yellow YellowGreen
> \end
>
> <$select field="color">
> <$list filter="[enlist<X11Colors>]" variable=thisColor>
> <option style={{{ [[background:]] [<thisColor>] [[;]] +[join[]] }}}>
> <<thisColor>>
> </option>
> </$list>
> </$select>
> ```
> enjoy,
> -e
> On Tuesday, September 27, 2022 at 5:08:23 AM UTC-7 Samir S. wrote:
>
>> Greetings,
>>
>> Is there a way to change the color of each option values inside the
>> $select widget.
>>
>> I've tried adding a class attribute but it does not work.
>>
>> Thank you in advance for your help.
>>
>> Sincerely.
>>
>>
>>
--
You received this message because you are subscribed to the Google Groups
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/d24bccc6-eafb-444d-a964-6cd7fe24e194n%40googlegroups.com.
