Hyperscript.jl icon indicating copy to clipboard operation
Hyperscript.jl copied to clipboard

CSS attributes starting with Hyphens

Open david-gottschalk opened this issue 3 years ago • 1 comments

Heyo, today I wanted to add some Custom CSS properties to my code and noticed that I wasn't able to produce the leading double hyphen, e.g., --outline-color with a camelCased attribute name. Any Ideas how to get this to work? I saw mention of auto prefixing certain CSS attributes in the future-enhancements section at the bottom of Hyperscript.jl. Would this fall into this category?

Cheers

david-gottschalk avatar May 17 '22 08:05 david-gottschalk

Right now you are forced to write m("div","test"; Symbol("-OutlineColor") => "blue") in order to get <div --outline-color="blue">test</div>. However, m("div","test"; Symbol("--outline-color") => "blue") will produce the same thing.

This behavior is explained by the kebab function: kebab(camel::String) = join(islowercase(c) || isnumeric(c) || c == '-' ? c : '-' * lowercase(c) for c in camel) which runs on the attribute names. You can easily fork the package and reimplement the kebab function to meet your needs and run add yourforkedrepo to install the new package version.

algunion avatar Jun 22 '22 15:06 algunion