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