Rename .monaco-editor-hover to .monaco-hover

This commit is contained in:
Alex Dima
2020-05-14 21:37:23 +02:00
parent 12628f1e2b
commit 88bcf236cf
7 changed files with 51 additions and 51 deletions
+28 -28
View File
@@ -3,7 +3,7 @@
* Licensed under the MIT License. See License.txt in the project root for license information. * Licensed under the MIT License. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/ *--------------------------------------------------------------------------------------------*/
.monaco-editor-hover { .monaco-hover {
cursor: default; cursor: default;
position: absolute; position: absolute;
overflow: hidden; overflow: hidden;
@@ -16,34 +16,34 @@
line-height: 1.5em; line-height: 1.5em;
} }
.monaco-editor-hover.hidden { .monaco-hover.hidden {
display: none; display: none;
} }
.monaco-editor-hover .hover-contents { .monaco-hover .hover-contents {
padding: 4px 8px; padding: 4px 8px;
} }
.monaco-editor-hover .markdown-hover > .hover-contents:not(.code-hover-contents) { .monaco-hover .markdown-hover > .hover-contents:not(.code-hover-contents) {
max-width: 500px; max-width: 500px;
word-wrap: break-word; word-wrap: break-word;
} }
.monaco-editor-hover .markdown-hover > .hover-contents:not(.code-hover-contents) hr { .monaco-hover .markdown-hover > .hover-contents:not(.code-hover-contents) hr {
/* This is a strange rule but it avoids https://github.com/microsoft/vscode/issues/96795, just 100vw on its own caused the actual hover width to increase */ /* This is a strange rule but it avoids https://github.com/microsoft/vscode/issues/96795, just 100vw on its own caused the actual hover width to increase */
min-width: calc(100% + 100vw); min-width: calc(100% + 100vw);
} }
.monaco-editor-hover p, .monaco-hover p,
.monaco-editor-hover ul { .monaco-hover ul {
margin: 8px 0; margin: 8px 0;
} }
.monaco-editor-hover code { .monaco-hover code {
font-family: var(--monaco-monospace-font); font-family: var(--monaco-monospace-font);
} }
.monaco-editor-hover hr { .monaco-hover hr {
margin-top: 4px; margin-top: 4px;
margin-bottom: -6px; margin-bottom: -6px;
margin-left: -10px; margin-left: -10px;
@@ -51,78 +51,78 @@
height: 1px; height: 1px;
} }
.monaco-editor-hover p:first-child, .monaco-hover p:first-child,
.monaco-editor-hover ul:first-child { .monaco-hover ul:first-child {
margin-top: 0; margin-top: 0;
} }
.monaco-editor-hover p:last-child, .monaco-hover p:last-child,
.monaco-editor-hover ul:last-child { .monaco-hover ul:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
/* MarkupContent Layout */ /* MarkupContent Layout */
.monaco-editor-hover ul { .monaco-hover ul {
padding-left: 20px; padding-left: 20px;
} }
.monaco-editor-hover ol { .monaco-hover ol {
padding-left: 20px; padding-left: 20px;
} }
.monaco-editor-hover li > p { .monaco-hover li > p {
margin-bottom: 0; margin-bottom: 0;
} }
.monaco-editor-hover li > ul { .monaco-hover li > ul {
margin-top: 0; margin-top: 0;
} }
.monaco-editor-hover code { .monaco-hover code {
border-radius: 3px; border-radius: 3px;
padding: 0 0.4em; padding: 0 0.4em;
} }
.monaco-editor-hover .monaco-tokenized-source { .monaco-hover .monaco-tokenized-source {
white-space: pre-wrap; white-space: pre-wrap;
word-break: break-all; word-break: break-all;
} }
.monaco-editor-hover .hover-row.status-bar { .monaco-hover .hover-row.status-bar {
font-size: 12px; font-size: 12px;
line-height: 22px; line-height: 22px;
} }
.monaco-editor-hover .hover-row.status-bar .actions { .monaco-hover .hover-row.status-bar .actions {
display: flex; display: flex;
padding: 0px 8px; padding: 0px 8px;
} }
.monaco-editor-hover .hover-row.status-bar .actions .action-container { .monaco-hover .hover-row.status-bar .actions .action-container {
margin-right: 16px; margin-right: 16px;
cursor: pointer; cursor: pointer;
} }
.monaco-editor-hover .hover-row.status-bar .actions .action-container .action .icon { .monaco-hover .hover-row.status-bar .actions .action-container .action .icon {
padding-right: 4px; padding-right: 4px;
} }
.monaco-editor-hover .markdown-hover .hover-contents .codicon { .monaco-hover .markdown-hover .hover-contents .codicon {
color: inherit; color: inherit;
font-size: inherit; font-size: inherit;
vertical-align: middle; vertical-align: middle;
} }
.monaco-editor-hover .hover-contents a.code-link:before { .monaco-hover .hover-contents a.code-link:before {
content: '('; content: '(';
} }
.monaco-editor-hover .hover-contents a.code-link:after { .monaco-hover .hover-contents a.code-link:after {
content: ')'; content: ')';
} }
.monaco-editor-hover .hover-contents a.code-link { .monaco-hover .hover-contents a.code-link {
color: inherit; color: inherit;
} }
.monaco-editor-hover .hover-contents a.code-link > span { .monaco-hover .hover-contents a.code-link > span {
text-decoration: underline; text-decoration: underline;
/** Hack to force underline to show **/ /** Hack to force underline to show **/
border-bottom: 1px solid transparent; border-bottom: 1px solid transparent;
+2 -2
View File
@@ -20,12 +20,12 @@ export class HoverWidget extends Disposable {
super(); super();
this.containerDomNode = document.createElement('div'); this.containerDomNode = document.createElement('div');
this.containerDomNode.classList.add('terminal-hover-widget', 'fadeIn', 'monaco-editor-hover', 'xterm-hover'); this.containerDomNode.classList.add('terminal-hover-widget', 'fadeIn', 'monaco-hover', 'xterm-hover');
this.containerDomNode.tabIndex = 0; this.containerDomNode.tabIndex = 0;
this.containerDomNode.setAttribute('role', 'tooltip'); this.containerDomNode.setAttribute('role', 'tooltip');
this.contentsDomNode = document.createElement('div'); this.contentsDomNode = document.createElement('div');
this.contentsDomNode.className = 'monaco-editor-hover-content'; this.contentsDomNode.className = 'monaco-hover-content';
this._scrollbar = this._register(new DomScrollableElement(this.contentsDomNode, {})); this._scrollbar = this._register(new DomScrollableElement(this.contentsDomNode, {}));
this.containerDomNode.appendChild(this._scrollbar.getDomNode()); this.containerDomNode.appendChild(this._scrollbar.getDomNode());
+9 -9
View File
@@ -311,29 +311,29 @@ registerThemingParticipant((theme, collector) => {
} }
const hoverBackground = theme.getColor(editorHoverBackground); const hoverBackground = theme.getColor(editorHoverBackground);
if (hoverBackground) { if (hoverBackground) {
collector.addRule(`.monaco-editor .monaco-editor-hover { background-color: ${hoverBackground}; }`); collector.addRule(`.monaco-editor .monaco-hover { background-color: ${hoverBackground}; }`);
} }
const hoverBorder = theme.getColor(editorHoverBorder); const hoverBorder = theme.getColor(editorHoverBorder);
if (hoverBorder) { if (hoverBorder) {
collector.addRule(`.monaco-editor .monaco-editor-hover { border: 1px solid ${hoverBorder}; }`); collector.addRule(`.monaco-editor .monaco-hover { border: 1px solid ${hoverBorder}; }`);
collector.addRule(`.monaco-editor .monaco-editor-hover .hover-row:not(:first-child):not(:empty) { border-top: 1px solid ${hoverBorder.transparent(0.5)}; }`); collector.addRule(`.monaco-editor .monaco-hover .hover-row:not(:first-child):not(:empty) { border-top: 1px solid ${hoverBorder.transparent(0.5)}; }`);
collector.addRule(`.monaco-editor .monaco-editor-hover hr { border-top: 1px solid ${hoverBorder.transparent(0.5)}; }`); collector.addRule(`.monaco-editor .monaco-hover hr { border-top: 1px solid ${hoverBorder.transparent(0.5)}; }`);
collector.addRule(`.monaco-editor .monaco-editor-hover hr { border-bottom: 0px solid ${hoverBorder.transparent(0.5)}; }`); collector.addRule(`.monaco-editor .monaco-hover hr { border-bottom: 0px solid ${hoverBorder.transparent(0.5)}; }`);
} }
const link = theme.getColor(textLinkForeground); const link = theme.getColor(textLinkForeground);
if (link) { if (link) {
collector.addRule(`.monaco-editor .monaco-editor-hover a { color: ${link}; }`); collector.addRule(`.monaco-editor .monaco-hover a { color: ${link}; }`);
} }
const hoverForeground = theme.getColor(editorHoverForeground); const hoverForeground = theme.getColor(editorHoverForeground);
if (hoverForeground) { if (hoverForeground) {
collector.addRule(`.monaco-editor .monaco-editor-hover { color: ${hoverForeground}; }`); collector.addRule(`.monaco-editor .monaco-hover { color: ${hoverForeground}; }`);
} }
const actionsBackground = theme.getColor(editorHoverStatusBarBackground); const actionsBackground = theme.getColor(editorHoverStatusBarBackground);
if (actionsBackground) { if (actionsBackground) {
collector.addRule(`.monaco-editor .monaco-editor-hover .hover-row .actions { background-color: ${actionsBackground}; }`); collector.addRule(`.monaco-editor .monaco-hover .hover-row .actions { background-color: ${actionsBackground}; }`);
} }
const codeBackground = theme.getColor(textCodeBlockBackground); const codeBackground = theme.getColor(textCodeBlockBackground);
if (codeBackground) { if (codeBackground) {
collector.addRule(`.monaco-editor .monaco-editor-hover code { background-color: ${codeBackground}; }`); collector.addRule(`.monaco-editor .monaco-hover code { background-color: ${codeBackground}; }`);
} }
}); });
+1 -1
View File
@@ -173,7 +173,7 @@ export class GlyphHoverWidget extends Widget implements IOverlayWidget {
this._isVisible = false; this._isVisible = false;
this._domNode = document.createElement('div'); this._domNode = document.createElement('div');
this._domNode.className = 'monaco-editor-hover hidden'; this._domNode.className = 'monaco-hover hidden';
this._domNode.setAttribute('aria-hidden', 'true'); this._domNode.setAttribute('aria-hidden', 'true');
this._domNode.setAttribute('role', 'tooltip'); this._domNode.setAttribute('role', 'tooltip');
@@ -664,6 +664,6 @@ function hoverContentsEquals(first: HoverPart[], second: HoverPart[]): boolean {
registerThemingParticipant((theme, collector) => { registerThemingParticipant((theme, collector) => {
const linkFg = theme.getColor(textLinkForeground); const linkFg = theme.getColor(textLinkForeground);
if (linkFg) { if (linkFg) {
collector.addRule(`.monaco-editor-hover .hover-contents a.code-link span:hover { color: ${linkFg}; }`); collector.addRule(`.monaco-hover .hover-contents a.code-link span:hover { color: ${linkFg}; }`);
} }
}); });
@@ -18,7 +18,7 @@
stroke-width: 1.2px; stroke-width: 1.2px;
} }
.monaco-editor-hover p { .monaco-hover p {
margin: 0; margin: 0;
} }
@@ -217,29 +217,29 @@ registerThemingParticipant((theme, collector) => {
} }
const hoverBackground = theme.getColor(editorHoverBackground); const hoverBackground = theme.getColor(editorHoverBackground);
if (hoverBackground) { if (hoverBackground) {
collector.addRule(`.integrated-terminal .monaco-editor-hover { background-color: ${hoverBackground}; }`); collector.addRule(`.integrated-terminal .monaco-hover { background-color: ${hoverBackground}; }`);
} }
const hoverBorder = theme.getColor(editorHoverBorder); const hoverBorder = theme.getColor(editorHoverBorder);
if (hoverBorder) { if (hoverBorder) {
collector.addRule(`.integrated-terminal .monaco-editor-hover { border: 1px solid ${hoverBorder}; }`); collector.addRule(`.integrated-terminal .monaco-hover { border: 1px solid ${hoverBorder}; }`);
collector.addRule(`.integrated-terminal .monaco-editor-hover .hover-row:not(:first-child):not(:empty) { border-top: 1px solid ${hoverBorder.transparent(0.5)}; }`); collector.addRule(`.integrated-terminal .monaco-hover .hover-row:not(:first-child):not(:empty) { border-top: 1px solid ${hoverBorder.transparent(0.5)}; }`);
collector.addRule(`.integrated-terminal .monaco-editor-hover hr { border-top: 1px solid ${hoverBorder.transparent(0.5)}; }`); collector.addRule(`.integrated-terminal .monaco-hover hr { border-top: 1px solid ${hoverBorder.transparent(0.5)}; }`);
collector.addRule(`.integrated-terminal .monaco-editor-hover hr { border-bottom: 0px solid ${hoverBorder.transparent(0.5)}; }`); collector.addRule(`.integrated-terminal .monaco-hover hr { border-bottom: 0px solid ${hoverBorder.transparent(0.5)}; }`);
} }
const link = theme.getColor(textLinkForeground); const link = theme.getColor(textLinkForeground);
if (link) { if (link) {
collector.addRule(`.integrated-terminal .monaco-editor-hover a { color: ${link}; }`); collector.addRule(`.integrated-terminal .monaco-hover a { color: ${link}; }`);
} }
const hoverForeground = theme.getColor(editorHoverForeground); const hoverForeground = theme.getColor(editorHoverForeground);
if (hoverForeground) { if (hoverForeground) {
collector.addRule(`.integrated-terminal .monaco-editor-hover { color: ${hoverForeground}; }`); collector.addRule(`.integrated-terminal .monaco-hover { color: ${hoverForeground}; }`);
} }
const actionsBackground = theme.getColor(editorHoverStatusBarBackground); const actionsBackground = theme.getColor(editorHoverStatusBarBackground);
if (actionsBackground) { if (actionsBackground) {
collector.addRule(`.integrated-terminal .monaco-editor-hover .hover-row .actions { background-color: ${actionsBackground}; }`); collector.addRule(`.integrated-terminal .monaco-hover .hover-row .actions { background-color: ${actionsBackground}; }`);
} }
const codeBackground = theme.getColor(textCodeBlockBackground); const codeBackground = theme.getColor(textCodeBlockBackground);
if (codeBackground) { if (codeBackground) {
collector.addRule(`.integrated-terminal .monaco-editor-hover code { background-color: ${codeBackground}; }`); collector.addRule(`.integrated-terminal .monaco-hover code { background-color: ${codeBackground}; }`);
} }
}); });