ASCII text
1
/* Top Bar */
2
@use "../../../../theme";
4
@use "../../../../theme-color";
5
@use "../../../../st-theme";
6
@use "../../gnome-shell";
7
@use "../overview/overview";
8
$color: theme-color.$panel;
10
$on-color: theme-color.$on-panel;
11
@if gnome-shell.$version >= 3.26 and gnome-shell.$version < 3.32 {
13
$color: theme-color.$scrim;
14
$on-color: theme-color.$on-scrim;
15
}
16
$button-hpadding: 12px;
18
@if theme.$compact {
20
$button-hpadding: 8px;
21
}
22
#panel {
24
transition-duration: overview.$transition-duration;
25
height: st-theme.$menuitem-size;
26
background-color: $color;
27
font-weight: bold;
28
font-feature-settings: "tnum";
29
// spacing between activities, app menu and such
31
#panelLeft,
32
#panelCenter {
33
spacing: 0;
34
}
35
// the rounded outset corners
37
.panel-corner {
38
-panel-corner-radius: 0;
39
-panel-corner-background-color: transparent;
40
-panel-corner-border-width: 0;
41
-panel-corner-border-color: transparent;
42
@if gnome-shell.$version >= 40 {
44
-panel-corner-opacity: 0;
45
transition-duration: overview.$transition-duration;
46
} @else {
47
&:active, &:overview, &:focus {
48
-panel-corner-border-color: transparent;
49
}
50
}
51
}
52
// panel menus
54
.panel-button {
55
-natural-hpadding: $button-hpadding;
56
-minimum-hpadding: $button-hpadding / 2;
57
transition-duration: st-theme.$duration;
58
border: 0;
59
border-radius: 0;
60
color: theme-color.hint($on-color);
61
text-shadow: none;
62
font-weight: bold;
63
@if gnome-shell.$version >= 3.36 {
65
&.clock-display {
66
.clock {
67
transition-duration: st-theme.$duration;
68
border: 0;
69
border-radius: 0;
70
}
71
}
72
}
73
.system-status-icon,
75
.app-menu-icon > StIcon,
76
.popup-menu-arrow {
77
icon-shadow: none;
78
}
79
&:hover {
81
box-shadow: none;
82
color: $on-color;
83
text-shadow: none;
84
@if gnome-shell.$version >= 3.36 {
86
&.clock-display {
87
box-shadow: none;
88
.clock {
90
box-shadow: none;
91
}
92
}
93
}
94
.system-status-icon,
96
.app-menu-icon > StIcon,
97
.popup-menu-arrow {
98
icon-shadow: none;
99
}
100
}
101
&:active, &:overview, &:focus, &:checked {
103
box-shadow: inset 0 -2px $on-color;
104
// Trick due to St limitations. It needs a background to draw a box-shadow
105
background-color: rgba($color, .01);
106
color: $on-color;
107
@if gnome-shell.$version >= 3.36 {
109
// The clock display needs to have the background on .clock because
110
// we want to exclude the do-not-disturb indicator from the background
111
&.clock-display {
112
box-shadow: none;
113
background-color: transparent;
114
.clock {
116
box-shadow: inset 0 -2px $on-color;
117
background-color: rgba($color, .01);
118
}
119
}
120
}
121
> .system-status-icon {
123
icon-shadow: none;
124
}
125
}
126
// status area icons
128
.system-status-icon {
129
icon-size: 16px;
130
padding: 0 4px;
131
@if gnome-shell.$version >= 40 {
133
margin: 0 4px;
134
}
135
}
136
@if gnome-shell.$version >= 40 {
138
.panel-status-indicators-box .system-status-icon,
139
.panel-status-menu-box .system-status-icon {
140
margin: 0;
141
}
142
}
143
// app menu icon
145
.app-menu-icon {
146
-st-icon-style: symbolic;
147
// dimensions of the icon are hardcoded
148
@if gnome-shell.$version < 40 {
150
margin-left: 4px;
151
margin-right: 4px;
152
}
153
}
154
@if gnome-shell.$version >= 40 {
156
&#panelActivities {
157
-natural-hpadding: $button-hpadding;
158
}
159
}
160
}
161
.panel-status-indicators-box,
163
.panel-status-menu-box {
164
spacing: 2px;
165
}
166
// spacing between power icon and (optional) percentage label
168
.power-status.panel-status-indicators-box {
169
spacing: 0;
170
}
171
// indicator for active
173
.screencast-indicator,
174
.remote-access-indicator {
175
color: theme-color.$warning;
176
}
177
// transparent panel on lock & login screens
179
@at-root %transparent-panel {
180
background-color: transparent;
181
.panel-corner {
183
@if gnome-shell.$version >= 40 {
184
-panel-corner-opacity: 0;
185
} @else {
186
-panel-corner-radius: 0;
187
-panel-corner-background-color: transparent;
188
-panel-corner-border-color: transparent;
189
}
190
}
191
.panel-button {
193
color: theme-color.hint(theme-color.$on-dark);
194
&:hover, &:active, &:overview, &:focus, &:checked {
196
color: theme-color.$on-dark;
197
}
198
}
199
}
200
&.unlock-screen,
202
&.login-screen,
203
&:overview {
204
@extend %transparent-panel;
205
}
206
@if gnome-shell.$version < 3.36 {
208
&.lock-screen {
209
@extend %transparent-panel;
210
background-color: theme-color.$scrim-alt;
211
}
212
}
213
@if gnome-shell.$version >= 3.26 and gnome-shell.$version < 3.32 {
215
&.solid {
216
transition-duration: overview.$transition-duration;
217
background-color: theme-color.$panel;
218
.panel-corner {
220
-panel-corner-background-color: transparent;
221
}
222
.panel-button {
224
color: theme-color.hint(theme-color.$on-panel);
225
text-shadow: none;
226
&:hover, &:active, &:overview, &:focus, &:checked {
228
color: theme-color.$on-panel;
229
}
230
}
231
.system-status-icon,
233
.app-menu-icon > StIcon,
234
.popup-menu-arrow {
235
icon-shadow: none;
236
}
237
}
238
}
239
}
240
// App Menu
242
#appMenu {
243
spacing: 4px;
244
@if gnome-shell.$version < 3.34 {
246
spinner-image: url("process-working.svg");
247
}
248
.label-shadow {
250
color: transparent;
251
}
252
@if gnome-shell.$version >= 40 {
254
.panel-status-menu-box {
255
padding: 0;
256
spacing: 4px;
257
}
258
}
259
}
260
.clock-display-box {
262
spacing: 0;
263
.clock {
265
padding-left: $button-hpadding;
266
padding-right: $button-hpadding;
267
}
268
}
269