Can't find a way to highlight variables in another Stylus file

[thiagobraga]

Hi, @tjx666. Thanks for your fork for this nice extension.

I'm not able to get the extension to work as I expect. I have the following structure in my project:

├── src
│   └── styles
│       ├── components
│       │   ├── sidebar.styl
│       │   └── top-bar.styl
│       ├── config
│       │   ├── shades.styl
│       │   └── variables.styl
│       └── theme.styl

I have the Nord theme defined in variables.styl file, the colors defined in that file works correctly. I also have the shades.styl file which are the colors defined in variables.styl but using the darken() and lighten() functions. The colors were not being highlighted using the methods, so I asked friend ChatGPT for help generating the list of colors already processed for me. Okay, the colors in this file now work too.

However, in the sidebar.styl file of the structure above, the color defined in variables.styl is not being highlighted. And also, it doesn't highlight CSS variables var(--nord-15-darken-10) or var(--nord-10) for example.

How do I make all project variables have their colors highlighted? Thanks.

EDIT: I also tried to move base color variables to theme.styl, but it doesn't work too.

My settings:

"colorize.hide_current_line_decorations": false,
"colorize.enable_search_variables": true,
"colorize.decoration_type": "underline",
"colorize.languages": ["css", "sass", "scss", "less", "postcss", "sss", "stylus", "xml", "svg"]