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

Add color for tree.indentGuidesStroke #145

Closed
octref opened this issue Jun 27, 2019 · 4 comments · Fixed by #147
Closed

Add color for tree.indentGuidesStroke #145

octref opened this issue Jun 27, 2019 · 4 comments · Fixed by #147

Comments

@octref
Copy link
Contributor

octref commented Jun 27, 2019

In the upcoming release, VS Code will add indentation guides in File Explorer. See microsoft/vscode#17777 for details.

A new key tree.indentGuidesStroke will be added. It doesn't look nice in Nord yet:

image

So I tried

{
  "workbench.colorCustomizations": {
    "[Nord]": {
      "tree.indentGuidesStroke": "#EBCB8B"
    }
  }
}

image

Please consider adding a color for tree.indentGuidesStroke. Thanks!

@arcticicestudio
Copy link
Contributor

Hi @octref 👋, thanks for your contribution 👍
Of course the new key will be added, but I guess it makes sense to use the same colors like for the editorIndentGuide.background (nord2 with 70% opacity) and editorIndentGuide.activeBackground (nord3) keys.

Also the idea of having a tool to check for missing rules is awesome 💯
I've commented in the issue you've opened to add some positive arguments for such a nice idea 😄

@octref
Copy link
Contributor Author

octref commented Jun 28, 2019

The issue I see with nord3 is that on hover, VS Code will take a dimmed color of the key, and nord3 is a bit too low contrast...

image

I hope a sensible default can be chosen for Nord, but I'll still likely use the color for open folder https://raw.githubusercontent.com/ayu-theme/vscode-ayu/master/icons/folder_opened_dark%402x.png so it's consistent with the icon colors.

image

Also the idea of having a tool to check for missing rules is awesome 💯
I've commented in the issue you've opened to add some positive arguments for such a nice idea 😄

I didn't see the comment 😅Maybe you forgot to post?

@arcticicestudio
Copy link
Contributor

arcticicestudio commented Jun 28, 2019

Oh the nord3 contrast for small areas might be a problem (again 😄), but I guess the new comment color from #117 / #118 could fit. Using the same color like icons might be a problem since almost every (icon) theme comes with different styles and often allows the user to define custom colors, e.g. I use the Material Icon Theme with custom Nord colors through the material-icon-theme.folders.color setting key.

The comment should be visible now, haven't got time to finish it before leaving for work.

arcticicestudio added a commit that referenced this issue Jul 20, 2019
VS Code 1.36.0 (1) June 2019 introduced support for indent guide lines
in the tree view (2). To adapt to Nord's style and ensure it is still
distinguishable from the background when hovering with the mouse, the
new brightened comment color based on ` nord3` (GH-118) is used.

References:
  (1) https://code.visualstudio.com/updates/v1_36
  (2) https://code.visualstudio.com/updates/v1_36#_tree-indent-guides

GH-145
arcticicestudio added a commit that referenced this issue Jul 20, 2019
VS Code 1.36.0 (1) June 2019 introduced support for indent guide lines
in the tree view (2). To adapt to Nord's style and ensure it is still
distinguishable from the background when hovering with the mouse, the
new brightened comment color based on ` nord3` (GH-118) is used.

References:
  (1) https://code.visualstudio.com/updates/v1_36
  (2) https://code.visualstudio.com/updates/v1_36#_tree-indent-guides

Resolves GH-145
@arcticicestudio
Copy link
Contributor

🚢 Shipped with extension release version 🏷 0.11.0.

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

Successfully merging a pull request may close this issue.

3 participants