Where can I find a list of all the global CSS properties?

#1

Hello,

I can’t remember where, but at some point I found a list of all the global CSS color properties shared by widgets. Can someone remind me of the place to look for this list? I am looking for the names of the properties (such as –custom-color or –color-accent), not their current values.

#2

The shared css variables are defined here, widget specific css variables are defined here.

1 Like
#3

Hahaa, voilà! Thanks a lot.

#4

Actually I was trying to change the color used as background for the modal object (not the popup). None of the color properties listed seem to function with this CSS code:

:host {
--color-xxx:orange;
}

What’s wrong?

#5
:host {
--color-raised:orange;
}

This affects the modal’s toggle, and all the modal’s children (that’s what css variables are for). As usual the inspector is your friend here to find out which css variables are used and where.

#6

I just found a bug in the modal widget that prevents the css to be properly updated if the property was previously empty and the modal had been opened at least once. It’s fixed in git.

1 Like