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.49 kiB
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