VS Code - size of description popup

2019-02-17 08:38发布

问题:

I am creating a snippet for VS Code with long descriptions. I have noticed that the description popup window in VS Code has a scrollbar, but it would be greater if I can enlarge the window? Is it possible?

回答1:

No, that's not possible currently. Sometimes text even wraps in such a popup window, which makes it difficult to read. Certainly something that needs improvement.

Here's an example:



回答2:

This is possible now with the Custom CSS and JS Loader extension.


1. Install extension

Custom CSS and JS Loader extension

2. Set permissions

  • macOS
    • VS Code: sudo chown -R $(whoami) /Applications/Visual Studio Code.app/Contents/MacOS/Electron
    • VS Code Insiders: sudo chown -R $(whoami) /Applications/Visual Studio Code - Insiders.app/Contents/MacOS/Electron
  • Linux: sudo chown -R $(whoami) /usr/share/code

3. Create CSS override file

touch ~/.vscode-custom.css:

/* suggest-widget size */

.monaco-editor .suggest-widget.docs-side {
  width: 1000px;
}

.monaco-editor .suggest-widget.docs-side > .details {
  width: 60%;
  max-height: 800px !important;
}

.monaco-editor .suggest-widget.docs-side > .tree {
  width: 30%;
  float: left;
}

/* parameter-hints-widget */

.editor-widget.parameter-hints-widget.visible {
  max-height: 800px !important;
}

.monaco-editor .parameter-hints-widget > .wrapper {
  max-width: 1000px;
}

/* editor-hover */

.monaco-editor-hover .monaco-editor-hover-content {
  max-width: 1000px;
}

Apply CSS file path to settings.json

{
  "vscode_custom_css.imports": ["file:///Users/yourusername/.vscode-custom.css"],
  "vscode_custom_css.policy": true
}

4. Restart VSCode

  • Restart VSCode
  • Ignore "VSCode is corrupt errors_
    • You can choose to suppress these forever
  • Run command "Reload Custom CSS and JS"