vscode-customize-css

vscode-customize-css.css

/*
 * A simple vscode style customization for https://github.com/be5invis/vscode-custom-css
 * Just put this file into anywhere and refer it from your vscode `settings.json` under `vscode_custom_css.imports` as following:
 * "vscode_custom_css.imports": [
 *   "file:///c:/Users/anyone/vscode.css"
 * ]
 **/
a.label-name,
p.subtitle.description,
h1.product-name.caption,
h2,
h3.category-title.max-lines-3,
span,
span.action-label,
.windows,
div.menubar-menu-button,
div.p-Menu-itemLabel {
  font-family: "Source Code Pro";
}

I tried but couldn't do what you wanted @svk-works

Oh, I managed to do that on my own. It looks so much better now!

Code_KovWYk6L5Y.mp4

I have to say, this is awesome! Could you please share your whole css definition? It's difficult for me to figure out all details 🥇

is there a way to hide unused Right click context menu options, its just too bloated to use

is there a way to hide unused Right click context menu options, its just too bloated to use

Sorry, I've no idea how to do this~

Hi, @cloorc , you mentioned above how to inspect right click context menu in this comment https://gist.github.com/cloorc/d2882523def38ce1ca3752b09e4e8fb2?permalink_comment_id=4404443#gistcomment-4404443 .

I have tried and found that inside 'editor-container' class which is the class of the current file opened in editor.
'editor-container' contains 'shadow-root-host' class representing the right click context menu which holds shadow root that contains li element, where each li element represents a right click context menu option, I want to apply 'display:none' to li elements which I dont want to appear by checking whether its child contains span.action-label with aria-label name that I want to hide , for example,
if I want to hide option 'Go to References' then I have to check wheather the child span.action-label has aria-label as 'Go to References' and if it does then I want to apply 'display: none' to li element,
I dont know how to apply css to elements inside shadow dom, can you guide me if you know. or if there is anyother way please guide me.

Thank you.

Hi, @cloorc , you mentioned above how to inspect right click context menu in this comment https://gist.github.com/cloorc/d2882523def38ce1ca3752b09e4e8fb2?permalink_comment_id=4404443#gistcomment-4404443 .

I have tried and found that inside 'editor-container' class which is the class of the current file opened in editor. 'editor-container' contains 'shadow-root-host' class representing the right click context menu which holds shadow root that contains li element, where each li element represents a right click context menu option, I want to apply 'display:none' to li elements which I dont want to appear by checking whether its child contains span.action-label with aria-label name that I want to hide , for example, if I want to hide option 'Go to References' then I have to check wheather the child span.action-label has aria-label as 'Go to References' and if it does then I want to apply 'display: none' to li element, I dont know how to apply css to elements inside shadow dom, can you guide me if you know. or if there is anyother way please guide me.

Thank you.

Sorry, buddy. I'm not professional on CSS yet. 😭

ok @cloorc , thanks for your response, can someone guide me how to access the elements inside shadow root using css and apply styles

Hmm, released a simple tool to start Visual Studio Code that will replace the editors font to JetBrains Mono by default.

https://github.com/horsing/coder.git