A fork of the Materia GTK theme.

By using this site, you agree to have cookies stored on your device, strictly for functional purposes, such as storing your session and preferences.

Dismiss

 _panel.scss

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