Book a Demo!
CoCalc Logo Icon
StoreFeaturesDocsShareSupportNewsAboutPoliciesSign UpSign In
microsoft
GitHub Repository: microsoft/vscode
Path: blob/main/src/vs/platform/hover/browser/hover.css
4777 views
1
/*---------------------------------------------------------------------------------------------
2
* Copyright (c) Microsoft Corporation. All rights reserved.
3
* Licensed under the MIT License. See License.txt in the project root for license information.
4
*--------------------------------------------------------------------------------------------*/
5
6
/* stylelint-disable layer-checker */
7
8
.monaco-hover.workbench-hover {
9
position: relative;
10
font-size: 13px;
11
line-height: 19px;
12
/* Must be higher than sash's z-index and terminal canvases */
13
z-index: 40;
14
overflow: hidden;
15
max-width: 700px;
16
background: var(--vscode-editorHoverWidget-background);
17
border: 1px solid var(--vscode-editorHoverWidget-border);
18
border-radius: 5px;
19
color: var(--vscode-editorHoverWidget-foreground);
20
box-shadow: 0 2px 8px var(--vscode-widget-shadow);
21
}
22
23
.monaco-hover.workbench-hover .monaco-action-bar .action-item .codicon {
24
/* Given our font-size, adjust action icons accordingly */
25
width: 13px;
26
height: 13px;
27
}
28
29
.monaco-hover.workbench-hover hr {
30
border-bottom: none;
31
}
32
33
.monaco-hover.workbench-hover.compact {
34
font-size: 12px;
35
}
36
37
.monaco-hover.workbench-hover.compact .monaco-action-bar .action-item .codicon {
38
/* Given our font-size, adjust action icons accordingly */
39
width: 12px;
40
height: 12px;
41
}
42
43
.monaco-hover.workbench-hover.compact .hover-contents {
44
padding: 2px 8px;
45
}
46
47
.workbench-hover-container.locked .monaco-hover.workbench-hover {
48
outline: 1px solid var(--vscode-editorHoverWidget-border);
49
}
50
.workbench-hover-container:focus-within.locked .monaco-hover.workbench-hover {
51
outline-color: var(--vscode-focusBorder);
52
}
53
54
.workbench-hover-pointer {
55
position: absolute;
56
/* Must be higher than workbench hover z-index */
57
z-index: 41;
58
pointer-events: none;
59
}
60
61
.workbench-hover-pointer:after {
62
content: '';
63
position: absolute;
64
width: 5px;
65
height: 5px;
66
background-color: var(--vscode-editorHoverWidget-background);
67
border-right: 1px solid var(--vscode-editorHoverWidget-border);
68
border-bottom: 1px solid var(--vscode-editorHoverWidget-border);
69
}
70
.workbench-hover-container:not(:focus-within).locked .workbench-hover-pointer:after {
71
width: 4px;
72
height: 4px;
73
border-right-width: 2px;
74
border-bottom-width: 2px;
75
}
76
.workbench-hover-container:focus-within .workbench-hover-pointer:after {
77
border-right: 1px solid var(--vscode-focusBorder);
78
border-bottom: 1px solid var(--vscode-focusBorder);
79
}
80
81
.workbench-hover-pointer.left { left: -3px; }
82
.workbench-hover-pointer.right { right: 3px; }
83
.workbench-hover-pointer.top { top: -3px; }
84
.workbench-hover-pointer.bottom { bottom: 3px; }
85
86
.workbench-hover-pointer.left:after {
87
transform: rotate(135deg);
88
}
89
90
.workbench-hover-pointer.right:after {
91
transform: rotate(315deg);
92
}
93
94
.workbench-hover-pointer.top:after {
95
transform: rotate(225deg);
96
}
97
98
.workbench-hover-pointer.bottom:after {
99
transform: rotate(45deg);
100
}
101
102
.monaco-hover.workbench-hover a {
103
color: var(--vscode-textLink-foreground);
104
}
105
106
.monaco-hover.workbench-hover a:focus {
107
outline: 1px solid;
108
outline-offset: -1px;
109
text-decoration: underline;
110
outline-color: var(--vscode-focusBorder);
111
}
112
113
.monaco-hover.workbench-hover a.codicon:focus,
114
.monaco-hover.workbench-hover a.monaco-button:focus {
115
text-decoration: none;
116
}
117
118
.monaco-hover.workbench-hover a:hover,
119
.monaco-hover.workbench-hover a:active {
120
color: var(--vscode-textLink-activeForeground);
121
}
122
123
.monaco-hover.workbench-hover code {
124
background: var(--vscode-textCodeBlock-background);
125
}
126
127
.monaco-hover.workbench-hover .hover-row .actions {
128
background: var(--vscode-editorHoverWidget-statusBarBackground);
129
}
130
131
.monaco-hover.workbench-hover.right-aligned {
132
/* The context view service wraps strangely when it's right up against the edge without this */
133
left: 1px;
134
}
135
136
.monaco-hover.workbench-hover.right-aligned .hover-row.status-bar .actions {
137
flex-direction: row-reverse;
138
}
139
140
.monaco-hover.workbench-hover.right-aligned .hover-row.status-bar .actions .action-container {
141
margin-right: 0;
142
margin-left: 16px;
143
}
144
145