Kronuz / ColorHighlight

🎨 Lightweight Color Highlight colorizer for Sublime Text
MIT License
118 stars 12 forks source link

Underline highlight for variables #2

Open philiprenich opened 6 years ago

philiprenich commented 6 years ago

Thanks for forking and fixing the old Color Highlighter package! It's good to have it in the new ST3 style - easy configuration etc and works out of the box.

Would it be difficult to add a highlighting option that is a color underline instead of the value area? Some might find this subtly nice.

Also, is it possible to allow highlighting of variables (like in Scss files) that have a color value? That would be really cool, especially when paired with the above. Use case:

$warning-red: #f00;
...
$text-warning: $warning-red;

In this example, personally, I would color the area of #f00 and underline $warning-red (potentially only on subsequent usages, not assignment). That way when I use the variable down further in the file or in another file, I can tell what shade of red I'm using.

Cheers

(ps - unsure how to tag this as suggestion, not an issue)

Kronuz commented 6 years ago

Underline can be done. Hopefully that’ll be added to next version. About variables, that’s not so easy. Specially to make it work through files. That’d need a parser and it’d be error prone.

philiprenich commented 6 years ago

I've seen other plugins that will do light-weight autocomplete for all open files. That sort of idea or a config setting where you give a path where the sass files live could maybe help with the parser. However, I'm not versed in it. Thanks for checking into it!

chris5marsh commented 5 years ago

I have a related issue - if there is a CSS color value in a Sass variable name, it highlights it. For example, we're using variable called $blue, $pink, $teal and $gold, and our variable declarations look like this.

screenshot 2018-11-15 at 12 34 33

I know that an easy fix would be for us to change the names of the variables, but they match what we call them in our brand guidelines, so it helps us stay consistent.

Is it easy enough to update the regex that the plugin uses to skip CSS color names preceded by $? I've had a look through the code but I'm afraid my Python skills are severely lacking.