Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Inconsistent Styling on Typescript Keyword in Dark Theme #142

Open
diegodario88 opened this issue Jun 3, 2023 · 6 comments
Open

Inconsistent Styling on Typescript Keyword in Dark Theme #142

diegodario88 opened this issue Jun 3, 2023 · 6 comments

Comments

@diegodario88
Copy link

diegodario88 commented Jun 3, 2023

Hello! First of all, I want to express my appreciation for the excellent work done on this theme. It provides a great visual experience. However, I have noticed a minor issue related to the styling of the "this", "get", "set", "class" and some others keyword, which doesn't match official theme.

I would like to request some guidance or assistance in addressing this inconsistency. My goal is to have those keyword in line with the rest of the vscode theme's styling.

image

image

@Mofiqul
Copy link
Owner

Mofiqul commented Jun 3, 2023

@diegodario88 - Hi, This can be done by adding language specific treesitter highlight group. Adding these highlights for all the language is tedious for me. If you add, I will be happy to merge.
Please see https://neovim.io/doc/user/treesitter.html#treesitter-highlight

@diegodario88
Copy link
Author

diegodario88 commented Jun 3, 2023

When examining the theme.lua file, I can see that the color for typescriptClassKeyword appears to be correct:

hl(0, 'typescriptClassKeyword', { fg = c.vscBlue, bg = 'NONE' }).

However, in my buffer, the classKeyword is displayed as pink. What steps should I take to resolve this color discrepancy?

Edit: So I found a way to trigger the change by doing for example

:hi @variable.builtin.typescript guifg=#569CD6

that does correct the color for the this keyword in typescript. But I need guidance on where should I put this code

@Mofiqul
Copy link
Owner

Mofiqul commented Jun 5, 2023

@diegodario88 - hl(0, 'typescriptClassKeyword', { fg = c.vscBlue, bg = 'NONE' }) this is non treestiite group, if you are using treestiiter that won't work. The correct solution is hi @variable.builtin.typescript guifg=#569CD6 Put it here under LSP semantic highlight.

@diegodario88
Copy link
Author

@Mofiqul - Wouldn't it be better under the -- Treesitter or even the -- Typescript section?
I ask because there's already a entry for this specific group that I want to change see

In my setup configuration I did like this

group_overrides = {
		["@variable.builtin.typescript"] = { fg = vscodeColor.vscBlue, bg = "NONE" },
		["@property.method.typescript"] = { fg = vscodeColor.vscYellow, bg = "NONE" },
		["@constructor.typescript"] = { fg = vscodeColor.vscBlue, bg = "NONE" },
		["@keyword.typescript"] = { fg = vscodeColor.vscBlue, bg = "NONE" },
		["@keyword.return.typescript"] = { fg = vscodeColor.vscPink, bg = "NONE" },
	}

I did that hoping to override only for the typescript group, maybe we should do the same, and if so I think the better place would be under typescript section, right?

@diegodario88 diegodario88 changed the title Issue: Inconsistent Styling on Typescript Keyword in Dark Theme Inconsistent Styling on Typescript Keyword in Dark Theme Jun 15, 2023
@me-nkr
Copy link

me-nkr commented Oct 7, 2023

hi, just wondering if this problem will be fixed with any PR?

@johannesrld
Copy link
Contributor

johannesrld commented May 5, 2024

hi, just wondering if this problem will be fixed with any PR?

@me-nkr try it now :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants