Support for Catppuccin theme

[LatenPath]

Is your request a change or a new theme?

• [ ] Change
• [x] Request

What is the theme name and link? VSCode: Catppuccin

Describe the suggested improvement/change Currently, I'm using Catppuccin (Mocha color-set):

I tried "addLegacyColorCustomizations" command but the result is... not good.

I hope that Catppuccin themes would be supported by this awesome extension.

Thank you so much.

[ghaschel]

On it! I'm gonna implement this and all the variations during the weekend. Don't know how I missed that one.

What do you think of this?

[LatenPath]

Thanks for your help. I'm new so there are a lot of things I'm not sure about. Hmm... but, I think having some more similarities between the original theme colors and your new ones would be quite helpful. I'm still bad at this but I hope you can take a look and give me advice.

Prefix

Scope	Typescript	Angular HTML

Settings

```json { "scope": [ "html-template.ng.attributes.animationtrigger.prefix", "html-template.ng.attributes.input-binding.animationTrigger.prefix" ], "settings": { "foreground": "#89B4FA" } }, ```

About html-template.ng.expression.operator.logical, I think the default color is more familiar to me, but maybe we chose a different color for some reason.

And also Control flow: html-template.ng.control-flow.keyword to me is like keyword.control.conditional.ts, haha.

By the way, pardon me, I have a newbie question here: My VSCode doesn't apply colors to bracket pair in Control flow, what should I do to fix it?

As for the rest, they are awesome, you did a beautiful theme, and I appreciate it. Thank you so much.

[LatenPath]

Note: fixed bracket-pair color issue.

settings.json:

  "[html]": {
    "editor.language.colorizedBracketPairs": [
      ["(", ")"],
      ["{", "}"]
    ]
  }

[ghaschel]

Hi, I'm sorry for the delay on this. It has been some really crazy busy weeks over here. I'll look into it right now

[ghaschel]

The issue is: The themes don't follow a specific pattern for coloring the tokenized text. So what I did for all the themes is manually creating a "link" between the theme colors and the extension grammar. By manually defining a set of colors for specific scopes that are assigned to a set of scopes within the extension. It's like, 7 scope colors that are assigned programmatically to a bunch of different scopes. So as for now, there's no easy way to make really granular changes to a specific theme and still supporting a lot of themes.

There is though, a big refactor that I'll eventually release that will implement semantic tokenization and will allow me to address this better and maybe even fix this issue altogether.

[ghaschel]

That said, this is how it looks when I change the logic operators to the color you mentioned. Let me know what you think.

In regards to the control flow brackets, if you could open another issue, I'd really appreciate it. I'll look into it. Apparently the brackets are not being tokenized for some reason. I'll look into that and create a config entry just for the control flow

[LatenPath]

I think the colors are very awesome now.

Thank you so much for your support, I really appreciate it.

By the way, about control flow bracket color. My config is simply a setting in settings.json:

  "[html]": {
    "editor.language.colorizedBracketPairs": [
      ["(", ")"],
      ["{", "}"]
    ]
  }

It's not a good idea because editor.language.colorizedBracketPairs will override all editor.semanticTokenColorCustomizations color setting.

I think that it's very hard to work around it. So, this is just an interesting discovery of mine while learning, please forget it if it's not necessary.

Anyway, thank you so much again. Can't wait to see these beautiful colors.

[ghaschel]

Just published version 2.13.0, it should be live soon and it adds support for Mocha, Macchiato, Latte and Frappé.

About the bracket color, I'd say it'd be better to stick with the native vscode setting to address that. But I'll make a note and look further into it in the next major version

Closing this, but feel free to open another one if you see something off. Have a great weekend!