Color Picker does not recognized var definitions

openstyles / stylus

Stylus - Userstyles Manager

https://add0n.com/stylus.html

GNU General Public License v3.0

5.51k stars 306 forks source link

Color Picker does not recognized var definitions #921

Open Kreyren opened 4 years ago

Kreyren commented 4 years ago

Browser: Custom based on Firefox 62~71 + Torbrowser components
Operating System: Custom with Linux, FreeBSD, Redox, ReactOS, WineHQ kernel components on UUTILS/GNU userland with Linux/FreeBSD/Redox distros on demand in sandbox. (Debian GNU/Linux Stable provides the browser)
Stylus Version: 1.5.11, last updated May 2, 2020

These values are not recognized by Styluse's color picker:

Description

assuming code

/* CSS */
background: rgba(var(--color-overlay),.7);

/* :root */
--color-overlay: 177, 173, 236;

where i don't have an efficient way of chaning the CSS

Expected behavior

Allow color-picker for var definitions in :root

tophf commented 4 years ago

Might be nice but since it's not autodetected as a color by CodeMirror the implementation won't be trivial while keeping performance and [relative] simplicity of code even if we only add exactly one syntax for R,G,B without bothering about the other 10-20 possible flavors (space delimited, presence of alpha, presence of comments between/before numbers etc.)

Kreyren commented 4 years ago

@tophf just do sanity-check:

Is there a better solution?
- If not -> I assume that making sanitized regex for proposed variants would be sane?

tophf commented 4 years ago

We already use regexps but they are guarded behind simpler checks for various telltale signals provided by CodeMirror and this is how I want it to stay, ideally. OTOH current implementation is overly complex which isn't necessary in 99.99% of cases so I'm contemplating a rewrite that should increase speed on styles like GitHub Dark at least 10 times...