catppuccin / vscode

🦌 Soothing pastel theme for VSCode & Azure Data Studio
https://marketplace.visualstudio.com/items?itemName=Catppuccin.catppuccin-vsc-pack
MIT License
1.44k stars 52 forks source link

Add color differentiation to types in object paths #214

Closed brady-sewall closed 2 weeks ago

brady-sewall commented 1 year ago

(Sorry for the poor title - I'm not sure what to call this)

Syntax: Liquid

When objects are called in Shopify it starts with the type of object - product, variant, etc. In the screenshots below, variant in variant.metafields.acf_variant.disclaimer_message, specifically.

Other themes I've used (including the stock VS Code themes) highlight that object, which makes it much easier to see what type of object is being referenced.

Other themes: image

Catppuccin: image

sgoudham commented 2 weeks ago

Hey 👋, Apologies for the wait!

There seems to be some cross cutting concerns here where the textmate grammar highlights user defined variables and shopify builtin objects the same colour. As a result, I wasn't comfortable using red which is our builtin colour.

While it might not make the most sense, I've went with pink to follow the idea of Custom Components in React. See the screenshot shown below:

image