Use syntax variables in language styles

[adamhollett]

Description of the change

syntax-variables.less defines a bunch of helpful colour variables for different syntax types (keyword, constant, tag, etc.), but in the styles for each language these variables are never used — the class for .syntax--keyword, for example, points back to the variable @hue-3 instead of the logical choice @syntax-color-keyword.

I changed references throughout the lang files for syntax colours that could point to the syntax variable instead of a hardcoded colour.

Future

We could go further to define even more syntax variables in syntax-variables.less and replace more of the hardcoded colour values. For example, there's no syntax variable colour set for comment, operator, or regexp.

Benefits

It should be easier to change colours for particular syntax types without having to replace values in multiple places.

Possible drawbacks

Maybe I misunderstand how syntax themes work, but this seems to be pretty clear-cut to me. I can't imagine how it could make things more complicated, but I'm happy to be corrected if I'm wrong.

[rsese]

/cc @simurai for when you get back :v: And thanks for the PR @admhlt :bow:

[simurai]

@adamhollett thanks for the PR. I'm kinda on the fence. It would make sense, but a reason to use the hard coded variables everywhere is so that you can see the relation between other selectors. Like in the example below:

.syntax--keyword and .syntax--storage share the same color. When using the named variables like @syntax-color-keyword, you couldn't tell and would have to reference syntax-variables.less first. The reason why @syntax-color-keyword and buddies even exist is so that other packages like auto-complete can use them.

We could go further to define even more syntax variables in syntax-variables.less and replace more of the hardcoded colour values. For example, there's no syntax variable colour set for comment, operator, or regexp.

Yeah, that would be an option. Then syntax-variables.less could be used to see the relationship. Then it might be neat to only have to define the variables and Atom would automatically generate the selectors or inline the colors?

Anyways, that's something to consider in the future. For now I'll close this as wontfix, but thanks again for looking into it. ❤️ ❤️ ❤️