Last active
August 24, 2020 12:29
-
-
Save vchirikov/d68e0f00ae9c6542b10c2b136c5b59c9 to your computer and use it in GitHub Desktop.
vs code useful fixes
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
https://marketplace.visualstudio.com/items?itemName=be5invis.vscode-custom-css | |
https://marketplace.visualstudio.com/items?itemName=lehni.vscode-fix-checksums | |
*/ | |
.loopText tspan { | |
fill: white; | |
background: white; | |
} | |
/* removes underscore style on links */ | |
.mtku, .detected-link { | |
text-decoration: none !important; | |
} | |
/* sets better width of debugger hover widget */ | |
.monaco-editor .debug-hover-widget .complex-value { | |
width:100% !important; | |
min-width:648px !important; | |
resize: both !important; | |
} | |
/* | |
intellisense width fix | |
https://stackoverflow.com/posts/62963539/edit | |
https://github.com/microsoft/vscode/issues/29126 | |
*/ | |
/* Use these custom properties to define the widths of the boxes as you need them. */ | |
:root { | |
/* Width of the container - both Tree and Details will have max-width: 50% of this value */ | |
--container-width: 90%; | |
/* Width of suggestion list on it's own, to make it wider, match this to your longest class names etc. */ | |
--tree-only-width: 35rem; | |
/* Width of suggestion list when it's next to tree, if you want it less than the max-width of 50%, helps with smaller windows */ | |
--tree-with-details-width: 30rem; | |
/* max-height of details box (max-width always 50%), it should take up only the height each item needs, the taller, the more disruptive */ | |
--details-max-height: 60vh; | |
/* Font size in details box. Uncomment to activate. Default is to match editor font size `editor.fontSize`*/ | |
/* --details-font-size: 90%; */ | |
/* --details-line-height: 1; */ | |
} | |
/* CONTAINER WITH ONLY SUGGESTIONS LIST | |
- .suggest-widget is the parent container that has either just .tree, or .tree+.details inside. | |
- This default selector affects the container when it has ONLY .tree inside */ | |
.monaco-editor .suggest-widget { | |
/* Just here for reference */ | |
} | |
/* CONTAINER WITH BOTH LIST AND DETAILS | |
- .suggest-widget.docs-side means .details is showing */ | |
.monaco-editor .suggest-widget.docs-side { | |
/* By default this is trapped at 660px, making tree and details trapped at 330px */ | |
/* width: 660px; */ | |
/* Set a very large width so there's room for tree and details */ | |
width: var(--container-width) !important; | |
} | |
/* SUGGESTIONS LIST ON ITS OWN | |
- .tree is the list of options to pick from, this is when details aren't showing*/ | |
.monaco-editor .suggest-widget>.tree { | |
width: var(--tree-only-width); | |
float: left !important; | |
} | |
/* SUGGESTIONS LIST NEXT TO DETAILS | |
- .docs-side>.tree means .detail box is also showing | |
- Note: at small window sizes this changes and annoying stuff happens */ | |
.monaco-editor .suggest-widget.docs-side>.tree { | |
/* By default they show 50% width and floated! */ | |
/* width: 50%; */ | |
/* float: left; */ | |
width: var(--tree-with-details-width) !important; | |
max-width: 50%; | |
float: left !important; | |
} | |
/* DETAILS BOX | |
- .details is the "read more" box, always inside .docs-side and next to .tree | |
- Note: at small window sizes this changes and annoying stuff happens */ | |
.monaco-editor .suggest-widget.docs-side>.details { | |
/* By default they show 50% width and floated! */ | |
/* width: 50%; */ | |
/* float: left; */ | |
max-width: 50%; | |
max-height: var(--details-max-height) !important; | |
float: left !important; | |
} | |
/* DETAILS BOX CONTENTS | |
- Where the actual "markdown" lives, in case you want to style it */ | |
.monaco-editor .suggest-widget.docs-side>.details .body { | |
/* padding: .5rem; */ | |
/* margin: 1rem; */ | |
font-size: var(--details-font-size); | |
line-height: var(--details-line-height); | |
} | |
/* parameter-hints-widget */ | |
.editor-widget.parameter-hints-widget.visible { | |
max-height: 800px !important; | |
} | |
.monaco-editor .parameter-hints-widget > .wrapper { | |
max-width: 1600px; | |
} | |
/* editor-hover */ | |
.monaco-editor-hover .monaco-editor-hover-content { | |
max-width: 1600px; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment