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.

Sign up for GitHub

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

Jump to bottom

Color tokens for TS & JS inlay hints #224

Closed
wenmin92 opened this issue Sep 4, 2021 · 1 comment · Fixed by #232
Closed

Color tokens for TS & JS inlay hints #224

wenmin92 opened this issue Sep 4, 2021 · 1 comment · Fixed by #232
Labels
context-syntax scope-compatibility scope-dx scope-quality type-feature
Milestone
version-0.19.0

Comments

@wenmin92
Copy link

wenmin92 commented Sep 4, 2021

Description

Visual Studio Code August 2021 (version 1.60) has add a new feature called Inlay hints, which add additional inline information to source code, like below (Parameter name inlay hints):

What it looks in the Nord theme:
image

A little annoying, isn't it?
I think this hint should not be so conspicuous and should not affect the continuity and readability of the source code.
@arcticicestudio arcticicestudio added this to the 0.19.0 milestone Sep 21, 2021
@arcticicestudio
Copy link
Contributor

Hi @wenmin92 👋, thanks for your contribution 👍

You are faster filing the reports than reading the changes 😉
Looks like they forgot to mention that there are also new keys that allow to customize the background and foreground color of these boxes, but I quickly checked the theme API scheme and found them. I'll create a PR to get this into the next release version that is scoped to support feaatures from the latest VS code versions 1.59 and 1.60.

arcticicestudio added a commit that referenced this issue Sep 21, 2021
@arcticicestudio
Color tokens for TypeScript and JavaScript inlay hints
0147743 
VS Code 1.60 [1] (August 2021) introduced inlay hints for JavaScript and
TypeScript [2] (opt-in via `editor.inlayHints.enabled`), including new
color tokens to customize their appereance.
They have been added and adjusted to match Nord's theme style:

- `editorInlayHint.background` - the background color used for inline
  hint boxes.
- `editorInlayHint.foreground` - the foreground color used for inline
  hint boxes.

[1]: https://code.visualstudio.com/updates/v1_60
[2]: https://code.visualstudio.com/updates/v1_60#_inlay-hints-for-javascript-and-typescript

GH-224
@arcticicestudio arcticicestudio changed the title The color of the new feature **Inlay hints** is too conspicuous, the original intention of this feature should be low-key Color tokens for TS & JS inlay hints Sep 21, 2021
@arcticicestudio arcticicestudio mentioned this issue Sep 21, 2021
Merged
arcticicestudio added a commit that referenced this issue Sep 21, 2021
@arcticicestudio
Color tokens for TypeScript and JavaScript inlay hints (#232)
2ea762e 
VS Code 1.60 [1] (August 2021) introduced inlay hints for JavaScript and
TypeScript [2] (opt-in via `editor.inlayHints.enabled`), including new
color tokens to customize their appereance.
They have been added and adjusted to match Nord's theme style:

- `editorInlayHint.background` - the background color used for inline
  hint boxes.
- `editorInlayHint.foreground` - the foreground color used for inline
  hint boxes.

[1]: https://code.visualstudio.com/updates/v1_60
[2]: https://code.visualstudio.com/updates/v1_60#_inlay-hints-for-javascript-and-typescript

Closes GH-224
arcticicestudio added a commit that referenced this issue Sep 25, 2021
@arcticicestudio
Color tokens for TypeScript and JavaScript inlay hints (#232)
98842da 
VS Code 1.60 [1] (August 2021) introduced inlay hints for JavaScript and
TypeScript [2] (opt-in via `editor.inlayHints.enabled`), including new
color tokens to customize their appereance.
They have been added and adjusted to match Nord's theme style:

- `editorInlayHint.background` - the background color used for inline
  hint boxes.
- `editorInlayHint.foreground` - the foreground color used for inline
  hint boxes.

[1]: https://code.visualstudio.com/updates/v1_60
[2]: https://code.visualstudio.com/updates/v1_60#_inlay-hints-for-javascript-and-typescript

Closes GH-224
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
context-syntax scope-compatibility scope-dx scope-quality type-feature
Projects
None yet
Milestone
version-0.19.0
Development

Successfully merging a pull request may close this issue.

Color tokens for TypeScript and JavaScript inlay hints nordtheme/visual-studio-code
3 participants
@wenmin92 @arcticicestudio @svengreb