removing the css changes that have been previously done and setting the z-index to 50 on the hover widget

This commit is contained in:
Aiday Marlen Kyzy
2023-06-20 11:51:39 +02:00
parent 0bdacdb965
commit 8755ad6c02
6 changed files with 59 additions and 62 deletions

View File

@@ -4,10 +4,6 @@
*--------------------------------------------------------------------------------------------*/
.monaco-hover {
z-index: 50;
}
.monaco-hover-container {
cursor: default;
position: absolute;
overflow: hidden;
@@ -18,52 +14,53 @@
line-height: 1.5em;
}
.monaco-hover-container.hidden {
.monaco-hover.hidden {
display: none;
}
.monaco-hover-container a:hover:not(.disabled) {
.monaco-hover a:hover:not(.disabled) {
cursor: pointer;
}
.monaco-hover-container .hover-contents:not(.html-hover-contents) {
.monaco-hover .hover-contents:not(.html-hover-contents) {
padding: 4px 8px;
}
.monaco-hover-container .markdown-hover > .hover-contents:not(.code-hover-contents) {
.monaco-hover .markdown-hover > .hover-contents:not(.code-hover-contents) {
max-width: 500px;
word-wrap: break-word;
}
.monaco-hover-container .markdown-hover > .hover-contents:not(.code-hover-contents) hr {
.monaco-hover .markdown-hover > .hover-contents:not(.code-hover-contents) hr {
min-width: 100%;
}
.monaco-hover-container p,
.monaco-hover-container .code,
.monaco-hover-container ul,
.monaco-hover-container h1,
.monaco-hover-container h2,
.monaco-hover-container h3,
.monaco-hover-container h4,
.monaco-hover-container h5,
.monaco-hover-container h6 {
.monaco-hover p,
.monaco-hover .code,
.monaco-hover ul,
.monaco-hover h1,
.monaco-hover h2,
.monaco-hover h3,
.monaco-hover h4,
.monaco-hover h5,
.monaco-hover h6 {
margin: 8px 0;
}
.monaco-hover-container h1,
.monaco-hover-container h2,
.monaco-hover-container h3,
.monaco-hover-container h4,
.monaco-hover-container h5,
.monaco-hover-container h6 {
.monaco-hover h1,
.monaco-hover h2,
.monaco-hover h3,
.monaco-hover h4,
.monaco-hover h5,
.monaco-hover h6 {
line-height: 1.1;
}
.monaco-hover-container code {
.monaco-hover code {
font-family: var(--monaco-monospace-font);
}
.monaco-hover-container hr {
.monaco-hover hr {
box-sizing: border-box;
border-left: 0px;
border-right: 0px;
@@ -74,87 +71,87 @@
height: 1px;
}
.monaco-hover-container p:first-child,
.monaco-hover-container .code:first-child,
.monaco-hover-container ul:first-child {
.monaco-hover p:first-child,
.monaco-hover .code:first-child,
.monaco-hover ul:first-child {
margin-top: 0;
}
.monaco-hover-container p:last-child,
.monaco-hover-container .code:last-child,
.monaco-hover-container ul:last-child {
.monaco-hover p:last-child,
.monaco-hover .code:last-child,
.monaco-hover ul:last-child {
margin-bottom: 0;
}
/* MarkupContent Layout */
.monaco-hover-container ul {
.monaco-hover ul {
padding-left: 20px;
}
.monaco-hover-container ol {
.monaco-hover ol {
padding-left: 20px;
}
.monaco-hover-container li > p {
.monaco-hover li > p {
margin-bottom: 0;
}
.monaco-hover-container li > ul {
.monaco-hover li > ul {
margin-top: 0;
}
.monaco-hover-container code {
.monaco-hover code {
border-radius: 3px;
padding: 0 0.4em;
}
.monaco-hover-container .monaco-tokenized-source {
.monaco-hover .monaco-tokenized-source {
white-space: pre-wrap;
}
.monaco-hover-container .hover-row.status-bar {
.monaco-hover .hover-row.status-bar {
font-size: 12px;
line-height: 22px;
}
.monaco-hover-container .hover-row.status-bar .info {
.monaco-hover .hover-row.status-bar .info {
font-style: italic;
padding: 0px 8px;
}
.monaco-hover-container .hover-row.status-bar .actions {
.monaco-hover .hover-row.status-bar .actions {
display: flex;
padding: 0px 8px;
}
.monaco-hover-container .hover-row.status-bar .actions .action-container {
.monaco-hover .hover-row.status-bar .actions .action-container {
margin-right: 16px;
cursor: pointer;
}
.monaco-hover-container .hover-row.status-bar .actions .action-container .action .icon {
.monaco-hover .hover-row.status-bar .actions .action-container .action .icon {
padding-right: 4px;
}
.monaco-hover-container .markdown-hover .hover-contents .codicon {
.monaco-hover .markdown-hover .hover-contents .codicon {
color: inherit;
font-size: inherit;
vertical-align: middle;
}
.monaco-hover-container .hover-contents a.code-link:hover,
.monaco-hover-container .hover-contents a.code-link {
.monaco-hover .hover-contents a.code-link:hover,
.monaco-hover .hover-contents a.code-link {
color: inherit;
}
.monaco-hover-container .hover-contents a.code-link:before {
.monaco-hover .hover-contents a.code-link:before {
content: '(';
}
.monaco-hover-container .hover-contents a.code-link:after {
.monaco-hover .hover-contents a.code-link:after {
content: ')';
}
.monaco-hover-container .hover-contents a.code-link > span {
.monaco-hover .hover-contents a.code-link > span {
text-decoration: underline;
/** Hack to force underline to show **/
border-bottom: 1px solid transparent;
@@ -162,12 +159,12 @@ white-space: pre-wrap;
color: var(--vscode-textLink-foreground);
}
.monaco-hover-container .hover-contents a.code-link > span:hover {
.monaco-hover .hover-contents a.code-link > span:hover {
color: var(--vscode-textLink-activeForeground);
}
/** Spans in markdown hovers need a margin-bottom to avoid looking cramped: https://github.com/microsoft/vscode/issues/101496 **/
.monaco-hover-container .markdown-hover .hover-contents:not(.code-hover-contents):not(.html-hover-contents) span {
.monaco-hover .markdown-hover .hover-contents:not(.code-hover-contents):not(.html-hover-contents) span {
margin-bottom: 4px;
display: inline-block;
}

View File

@@ -26,7 +26,7 @@ export class HoverWidget extends Disposable {
super();
this.containerDomNode = document.createElement('div');
this.containerDomNode.className = 'monaco-hover-container';
this.containerDomNode.className = 'monaco-hover';
this.containerDomNode.tabIndex = 0;
this.containerDomNode.setAttribute('role', 'tooltip');