Skip to content

Commit 8755ad6

Browse files
committed
removing the css changes that have been previously done and setting the z-index to 50 on the hover widget
1 parent 0bdacdb commit 8755ad6

File tree

6 files changed

+59
-62
lines changed

6 files changed

+59
-62
lines changed

src/vs/base/browser/ui/hover/hover.css

Lines changed: 48 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,6 @@
44
*--------------------------------------------------------------------------------------------*/
55

66
.monaco-hover {
7-
z-index: 50;
8-
}
9-
10-
.monaco-hover-container {
117
cursor: default;
128
position: absolute;
139
overflow: hidden;
@@ -18,52 +14,53 @@
1814
line-height: 1.5em;
1915
}
2016

21-
.monaco-hover-container.hidden {
17+
.monaco-hover.hidden {
2218
display: none;
2319
}
2420

25-
.monaco-hover-container a:hover:not(.disabled) {
21+
.monaco-hover a:hover:not(.disabled) {
2622
cursor: pointer;
2723
}
2824

29-
.monaco-hover-container .hover-contents:not(.html-hover-contents) {
25+
.monaco-hover .hover-contents:not(.html-hover-contents) {
3026
padding: 4px 8px;
3127
}
3228

33-
.monaco-hover-container .markdown-hover > .hover-contents:not(.code-hover-contents) {
29+
.monaco-hover .markdown-hover > .hover-contents:not(.code-hover-contents) {
30+
max-width: 500px;
3431
word-wrap: break-word;
3532
}
3633

37-
.monaco-hover-container .markdown-hover > .hover-contents:not(.code-hover-contents) hr {
34+
.monaco-hover .markdown-hover > .hover-contents:not(.code-hover-contents) hr {
3835
min-width: 100%;
3936
}
4037

41-
.monaco-hover-container p,
42-
.monaco-hover-container .code,
43-
.monaco-hover-container ul,
44-
.monaco-hover-container h1,
45-
.monaco-hover-container h2,
46-
.monaco-hover-container h3,
47-
.monaco-hover-container h4,
48-
.monaco-hover-container h5,
49-
.monaco-hover-container h6 {
38+
.monaco-hover p,
39+
.monaco-hover .code,
40+
.monaco-hover ul,
41+
.monaco-hover h1,
42+
.monaco-hover h2,
43+
.monaco-hover h3,
44+
.monaco-hover h4,
45+
.monaco-hover h5,
46+
.monaco-hover h6 {
5047
margin: 8px 0;
5148
}
5249

53-
.monaco-hover-container h1,
54-
.monaco-hover-container h2,
55-
.monaco-hover-container h3,
56-
.monaco-hover-container h4,
57-
.monaco-hover-container h5,
58-
.monaco-hover-container h6 {
50+
.monaco-hover h1,
51+
.monaco-hover h2,
52+
.monaco-hover h3,
53+
.monaco-hover h4,
54+
.monaco-hover h5,
55+
.monaco-hover h6 {
5956
line-height: 1.1;
6057
}
6158

62-
.monaco-hover-container code {
59+
.monaco-hover code {
6360
font-family: var(--monaco-monospace-font);
6461
}
6562

66-
.monaco-hover-container hr {
63+
.monaco-hover hr {
6764
box-sizing: border-box;
6865
border-left: 0px;
6966
border-right: 0px;
@@ -74,100 +71,100 @@
7471
height: 1px;
7572
}
7673

77-
.monaco-hover-container p:first-child,
78-
.monaco-hover-container .code:first-child,
79-
.monaco-hover-container ul:first-child {
74+
.monaco-hover p:first-child,
75+
.monaco-hover .code:first-child,
76+
.monaco-hover ul:first-child {
8077
margin-top: 0;
8178
}
8279

83-
.monaco-hover-container p:last-child,
84-
.monaco-hover-container .code:last-child,
85-
.monaco-hover-container ul:last-child {
80+
.monaco-hover p:last-child,
81+
.monaco-hover .code:last-child,
82+
.monaco-hover ul:last-child {
8683
margin-bottom: 0;
8784
}
8885

8986
/* MarkupContent Layout */
90-
.monaco-hover-container ul {
87+
.monaco-hover ul {
9188
padding-left: 20px;
9289
}
93-
.monaco-hover-container ol {
90+
.monaco-hover ol {
9491
padding-left: 20px;
9592
}
9693

97-
.monaco-hover-container li > p {
94+
.monaco-hover li > p {
9895
margin-bottom: 0;
9996
}
10097

101-
.monaco-hover-container li > ul {
98+
.monaco-hover li > ul {
10299
margin-top: 0;
103100
}
104101

105-
.monaco-hover-container code {
102+
.monaco-hover code {
106103
border-radius: 3px;
107104
padding: 0 0.4em;
108105
}
109106

110-
.monaco-hover-container .monaco-tokenized-source {
107+
.monaco-hover .monaco-tokenized-source {
111108
white-space: pre-wrap;
112109
}
113110

114-
.monaco-hover-container .hover-row.status-bar {
111+
.monaco-hover .hover-row.status-bar {
115112
font-size: 12px;
116113
line-height: 22px;
117114
}
118115

119-
.monaco-hover-container .hover-row.status-bar .info {
116+
.monaco-hover .hover-row.status-bar .info {
120117
font-style: italic;
121118
padding: 0px 8px;
122119
}
123120

124-
.monaco-hover-container .hover-row.status-bar .actions {
121+
.monaco-hover .hover-row.status-bar .actions {
125122
display: flex;
126123
padding: 0px 8px;
127124
}
128125

129-
.monaco-hover-container .hover-row.status-bar .actions .action-container {
126+
.monaco-hover .hover-row.status-bar .actions .action-container {
130127
margin-right: 16px;
131128
cursor: pointer;
132129
}
133130

134-
.monaco-hover-container .hover-row.status-bar .actions .action-container .action .icon {
131+
.monaco-hover .hover-row.status-bar .actions .action-container .action .icon {
135132
padding-right: 4px;
136133
}
137134

138-
.monaco-hover-container .markdown-hover .hover-contents .codicon {
135+
.monaco-hover .markdown-hover .hover-contents .codicon {
139136
color: inherit;
140137
font-size: inherit;
141138
vertical-align: middle;
142139
}
143140

144-
.monaco-hover-container .hover-contents a.code-link:hover,
145-
.monaco-hover-container .hover-contents a.code-link {
141+
.monaco-hover .hover-contents a.code-link:hover,
142+
.monaco-hover .hover-contents a.code-link {
146143
color: inherit;
147144
}
148145

149-
.monaco-hover-container .hover-contents a.code-link:before {
146+
.monaco-hover .hover-contents a.code-link:before {
150147
content: '(';
151148
}
152149

153-
.monaco-hover-container .hover-contents a.code-link:after {
150+
.monaco-hover .hover-contents a.code-link:after {
154151
content: ')';
155152
}
156153

157-
.monaco-hover-container .hover-contents a.code-link > span {
154+
.monaco-hover .hover-contents a.code-link > span {
158155
text-decoration: underline;
159156
/** Hack to force underline to show **/
160157
border-bottom: 1px solid transparent;
161158
text-underline-position: under;
162159
color: var(--vscode-textLink-foreground);
163160
}
164161

165-
.monaco-hover-container .hover-contents a.code-link > span:hover {
162+
.monaco-hover .hover-contents a.code-link > span:hover {
166163
color: var(--vscode-textLink-activeForeground);
167164
}
168165

169166
/** Spans in markdown hovers need a margin-bottom to avoid looking cramped: https://github.com/microsoft/vscode/issues/101496 **/
170-
.monaco-hover-container .markdown-hover .hover-contents:not(.code-hover-contents):not(.html-hover-contents) span {
167+
.monaco-hover .markdown-hover .hover-contents:not(.code-hover-contents):not(.html-hover-contents) span {
171168
margin-bottom: 4px;
172169
display: inline-block;
173170
}

src/vs/base/browser/ui/hover/hoverWidget.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ export class HoverWidget extends Disposable {
2626
super();
2727

2828
this.containerDomNode = document.createElement('div');
29-
this.containerDomNode.className = 'monaco-hover-container';
29+
this.containerDomNode.className = 'monaco-hover';
3030
this.containerDomNode.tabIndex = 0;
3131
this.containerDomNode.setAttribute('role', 'tooltip');
3232

src/vs/editor/contrib/hover/browser/contentHover.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -488,7 +488,7 @@ export class ContentHoverWidget extends ResizableContentWidget {
488488
this._hoverFocusedKey = EditorContextKeys.hoverFocused.bindTo(_contextKeyService);
489489

490490
dom.append(this._resizableNode.domNode, this._hover.containerDomNode);
491-
this._resizableNode.domNode.classList.add('monaco-hover');
491+
this._resizableNode.domNode.style.zIndex = '50';
492492

493493
this._disposableStore.add(this._editor.onDidLayoutChange(() => this._layout()));
494494
this._disposableStore.add(this._editor.onDidChangeConfiguration((e: ConfigurationChangedEvent) => {

src/vs/editor/contrib/hover/browser/hover.css

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,26 +7,26 @@
77
background-color: var(--vscode-editor-hoverHighlightBackground);
88
}
99

10-
.monaco-editor .monaco-hover-container {
10+
.monaco-editor .monaco-hover {
1111
color: var(--vscode-editorHoverWidget-foreground);
1212
background-color: var(--vscode-editorHoverWidget-background);
1313
border: 1px solid var(--vscode-editorHoverWidget-border);
1414
border-radius: 3px;
1515
}
1616

17-
.monaco-editor .monaco-hover-container a {
17+
.monaco-editor .monaco-hover a {
1818
color: var(--vscode-textLink-foreground);
1919
}
2020

21-
.monaco-editor .monaco-hover-container a:hover {
21+
.monaco-editor .monaco-hover a:hover {
2222
color: var(--vscode-textLink-activeForeground);
2323
}
2424

25-
.monaco-editor .monaco-hover-container .hover-row .actions {
25+
.monaco-editor .monaco-hover .hover-row .actions {
2626
background-color: var(--vscode-editorHoverWidget-statusBarBackground);
2727
}
2828

29-
.monaco-editor .monaco-hover-container code {
29+
.monaco-editor .monaco-hover code {
3030
background-color: var(--vscode-textCodeBlock-background);
3131
}
3232

src/vs/editor/contrib/hover/browser/hover.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -691,8 +691,8 @@ HoverParticipantRegistry.register(MarkerHoverParticipant);
691691
registerThemingParticipant((theme, collector) => {
692692
const hoverBorder = theme.getColor(editorHoverBorder);
693693
if (hoverBorder) {
694-
collector.addRule(`.monaco-editor .monaco-hover-content .hover-row:not(:first-child):not(:empty) { border-top: 1px solid ${hoverBorder.transparent(0.5)}; }`);
695-
collector.addRule(`.monaco-editor .monaco-hover-content hr { border-top: 1px solid ${hoverBorder.transparent(0.5)}; }`);
696-
collector.addRule(`.monaco-editor .monaco-hover-content hr { border-bottom: 0px solid ${hoverBorder.transparent(0.5)}; }`);
694+
collector.addRule(`.monaco-editor .monaco-hover .hover-row:not(:first-child):not(:empty) { border-top: 1px solid ${hoverBorder.transparent(0.5)}; }`);
695+
collector.addRule(`.monaco-editor .monaco-hover hr { border-top: 1px solid ${hoverBorder.transparent(0.5)}; }`);
696+
collector.addRule(`.monaco-editor .monaco-hover hr { border-bottom: 0px solid ${hoverBorder.transparent(0.5)}; }`);
697697
}
698698
});

src/vs/editor/standalone/browser/standalone-tokens.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
stroke-width: 1.2px;
2121
}
2222

23-
.monaco-hover-container p {
23+
.monaco-hover p {
2424
margin: 0;
2525
}
2626

0 commit comments

Comments
 (0)