ankit / stylebot

Change the appearance of the web instantly
https://stylebot.dev/
MIT License
1.4k stars 208 forks source link

css variables #540

Closed bestia-dev closed 4 years ago

bestia-dev commented 4 years ago

The website https://web.crev.dev/rust-reviews/crate/num-traits/ has css variables for the color palette:

         :root {
            /* color palette */
            /* use of variables: var(--b_color_05); */
            /* background color */
            --b_color_01: #24292E;
            --b_color_02: #1B1D23;
            --b_color_03: #181A1F;
            --b_color_04: #333842;
            /* front color */
            --f_color_01: #FBF462;
            --f_color_02: #9DA5B4;
            --f_color_03: #78C379;
            /* border color*/
            --brd_color_01: #000;
            --brd_color_02: #eaecef;
        }

I tried to copy this to Stylebot css, but it didn't work. When I change it and save it strips away the lines with the variables. Is it possible to overwrite "css variables" with Stylebot? is there a special procedure?

quantumleap- commented 4 years ago

The only way to do this is to rewrite the code as follows. (First, you need to copy the entire folder of this extension somewhere.)

/libs/parser.js

before:

// SPC ! " # $ % & ' ( ) * + , - . / W, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, I, 0, 0,

after:

// SPC ! " # $ % & ' ( ) * + , - . / W, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, SI, 0, 0,

bestia-dev commented 4 years ago

Thanks. I found the extension "user css" that can just do this. No problem.

ankit commented 4 years ago

@LucianoBestia variables will be supported in the upcoming v3 release, which will also include lots of other cool features. Hope you try stylebot again once v3 is released! the latest version will use https://postcss.org/

ankit commented 4 years ago

just released v3, so this should now work