A fork of the Materia GTK theme.

Important information: Google announced that, from September 2026, Android devices will require ALL apps to be signed by Google, effectively leading to an iOS situation. Value your right to a computer that does what you want; do not tolerate this monopolistic practice! Contact me if you don't understand why it is bad. Click to learn more.

 _mate.scss

View raw Download
text/plain • 8.18 kiB
ASCII text
        
            
1
// based css:
2
// https://github.com/mate-desktop/mate-themes/blob/master/desktop-themes/Menta/gtk-3.0/mate-applications.css
3
4
/**************
5
* Mate-Panel *
6
**************/
7
// first make all transparent
8
.mate-panel-menu-bar menubar,
9
#PanelApplet-window-menu-applet-button {
10
background-color: transparent;
11
}
12
13
// let's start it
14
.mate-panel-menu-bar {
15
background-color: $solid_panel_bg_color;
16
font-weight: 500;
17
18
// Avoid changing the menu text color
19
&:not(.popup) { color: $inverse_secondary_fg_color; }
20
21
button {
22
@extend %flat_button;
23
@extend %button_selected.flat;
24
25
min-height: 16px;
26
min-width: 16px;
27
padding: 0; // NOTE: Most buttons padding are hard-coded to 0 (except hide buttons)
28
border-radius: 0;
29
30
&:checked { background-color: $inverse_divider_color; }
31
}
32
}
33
34
// hide buttons
35
PanelToplevel.horizontal > grid > button {
36
min-width: 24px;
37
}
38
39
PanelToplevel.vertical > grid > button {
40
min-height: 24px;
41
}
42
43
#PanelApplet {
44
// border-width: 0;
45
}
46
47
PanelSeparator {
48
color: $inverse_divider_color;
49
}
50
51
// the grid left from na-tray and wncktasklist
52
MatePanelAppletFrameDBus {
53
border-style: solid;
54
border-color: $inverse_divider_color;
55
56
.mate-panel-menu-bar.horizontal & { border-width: 0 1px; }
57
.mate-panel-menu-bar.vertical & { border-width: 1px 0; }
58
}
59
60
// main menu
61
.mate-panel-menu-bar {
62
// set normal menubar button
63
menubar > menuitem {
64
color: $inverse_secondary_fg_color;
65
66
&:hover {
67
background-color: $inverse_divider_color;
68
color: $inverse_fg_color;
69
}
70
71
&:disabled { color: $inverse_disabled_secondary_fg_color; }
72
}
73
74
&.horizontal menubar > menuitem { padding: 0 8px; }
75
&.vertical menubar > menuitem { padding: 8px 0; }
76
77
// set normal menubar menuitem
78
menubar menu > menuitem {
79
// adjust sizing since the menuitem has large icons
80
min-height: $menuitem_size;
81
padding: 0 6px;
82
// font-weight: initial;
83
}
84
}
85
86
// all applets
87
.mate-panel-menu-bar #PanelApplet button {
88
-GtkWidget-window-dragging: true;
89
// padding: 4px;
90
}
91
92
.mate-panel-menu-bar #tasklist-button {
93
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px),
94
currentColor 0%,
95
transparent 0%)
96
0 0 0 / 0 0 0px;
97
98
&:checked {
99
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px),
100
currentColor 100%,
101
transparent 0%)
102
0 0 2 / 0 0 2px;
103
}
104
105
// instead of #tasklist-button { padding: 0 4px; }
106
image:dir(ltr), label:dir(rtl) { padding-left: 4px; }
107
label:dir(ltr), image:dir(rtl) { padding-right: 4px; }
108
}
109
110
// #tasklist-button is always horizontal even if the panel is vertical
111
.mate-panel-menu-bar.vertical #tasklist-button { min-height: 32px; }
112
113
#showdesktop-button {
114
.mate-panel-menu-bar.horizontal & image {
115
min-width: 24px;
116
padding: 0 4px;
117
}
118
119
.mate-panel-menu-bar.vertical & image {
120
min-height: 24px;
121
padding: 4px 0;
122
}
123
}
124
125
// WnckPager
126
PanelApplet.wnck-applet .wnck-pager {
127
background-color: transparent;
128
color: $alt_primary_color;
129
130
&:hover { background-color: $inverse_divider_color; }
131
132
&:active { background-color: $inverse_track_color; }
133
134
&:selected { background-color: $primary_color; }
135
}
136
137
#clock-applet-button {
138
.mate-panel-menu-bar.horizontal & label { padding: 0 8px; }
139
.mate-panel-menu-bar.vertical & label { padding: 8px 0; }
140
}
141
142
#MatePanelPopupWindow {
143
border: 1px solid $border_color;
144
border-radius: $material_radius + 1px;
145
box-shadow: inset 0 1px $highlight_color;
146
147
frame > border { border-style: none; }
148
149
button { padding: 4px 16px; }
150
151
// Weird, this sets the border color of the clockmap
152
> frame > box > box > box > widget { color: $border_color; }
153
}
154
155
na-tray-applet {
156
-NaTrayApplet-icon-padding: 3px;
157
-NaTrayApplet-icon-size: 16;
158
}
159
160
// remove right space a bit
161
na-tray-applet > widget > box {
162
// margin-right: 2px;
163
}
164
165
// no background for icon-padding area
166
na-tray-applet widget box widget {
167
// background-color: transparent;
168
}
169
170
// Classic icon style
171
.mate-panel-menu-bar {
172
-PanelMenuBar-icon-visible: true;
173
}
174
175
// volume applet, brightness applet
176
.mate-panel-applet-slider {
177
border: 1px solid $border_color;
178
border-radius: $material_radius + 1px;
179
box-shadow: inset 0 1px $highlight_color;
180
background-color: $bg_color;
181
182
frame > border { border-style: none; }
183
}
184
185
// mate-menu
186
187
// mimic menubar menuitem style
188
#PanelApplet {
189
&:not(:selected) > box { transition: $shorter_transition; }
190
191
&:selected > box {
192
background-color: $inverse_divider_color;
193
color: $inverse_fg_color;
194
}
195
}
196
197
#mate-menu {
198
// FIXME, does not work
199
border: 1px solid $border_color;
200
201
button {
202
@extend %simple_flat_button;
203
204
min-height: 24px;
205
min-width: 24px;
206
padding: 4px 0;
207
color: $fg_color;
208
font-weight: normal;
209
210
label:not(:first-child) { color: $secondary_fg_color; }
211
}
212
213
entry {
214
margin: 0 0 8px;
215
216
image { margin: 0; }
217
218
+ button {
219
margin: 0 4px 8px;
220
padding: ($medium_size - 24px) / 2;
221
}
222
}
223
}
224
225
226
/*********************
227
* CAJA File manager *
228
*********************/
229
// pathpar toggle button
230
.caja-navigation-window button.toggle.image-button {
231
border-radius: $material_radius;
232
}
233
234
// pathbar
235
// pathbar buttons
236
.caja-pathbar button {
237
margin: 0 -1px 0 -2px;
238
// padding: 4px;
239
240
@extend %pathbar_button;
241
242
// arrow button
243
> widget {
244
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
245
-GtkArrow-arrow-scaling: 1;
246
}
247
}
248
249
// places, treeview, history, information, emblems and notes
250
// .caja-side-pane notebook treeview.view,
251
// .caja-side-pane notebook textview.view text,
252
.caja-side-pane notebook viewport.frame,
253
.caja-side-pane notebook widget .vertical {
254
background-color: $base_color;
255
}
256
257
// treeview rows
258
.caja-side-pane treeview.view {
259
// padding: 2px 0;
260
}
261
262
.caja-side-pane notebook,
263
.caja-notebook {
264
border-top: 1px solid $border_color;
265
266
.frame { border-style: none; }
267
}
268
269
// window and desktop mode
270
.caja-canvas-item {
271
// border-radius: $material_radius;
272
}
273
274
// desktop mode
275
.caja-desktop.caja-canvas-item {
276
@extend .nautilus-desktop.nautilus-canvas-item;
277
}
278
279
.caja-desktop EelEditableLabel.entry {
280
}
281
282
// statusbar
283
.caja-navigation-window statusbar {
284
margin: 0 -10px;
285
padding: 0 4px;
286
border-top: 1px solid $border_color;
287
}
288
289
// infobar
290
.caja-notebook frame > border {
291
border-style: none;
292
}
293
294
#caja-extra-view-widget {
295
border-bottom: 1px solid $border_color;
296
background-color: $bg_color; // needs overriding
297
298
> box > box > label { font-weight: bold; }
299
}
300
301
302
/*********
303
* Pluma *
304
*********/
305
// Pluma status bar
306
.pluma-window statusbar {
307
margin: 0 -10px;
308
padding: 0 4px;
309
border-top: 1px solid $border_color;
310
311
frame {
312
> border { border-style: none; }
313
314
button.flat {
315
padding: 0 4px;
316
border-radius: 0;
317
318
widget {
319
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
320
-GtkArrow-arrow-scaling: 1;
321
}
322
}
323
}
324
}
325
326
// Printpreview
327
.pluma-print-preview {
328
toolbar { border-bottom: 1px solid $border_color; }
329
330
// scrolledwindow { background-color: $base_color; }
331
}
332
333
// sidebar file-browser
334
.pluma-window paned.horizontal box.vertical {
335
box.horizontal button.flat {
336
margin: 1px;
337
338
@extend %small_button;
339
}
340
341
.frame { border-style: none; }
342
343
notebook.frame {
344
margin-top: -1px;
345
border-top: 1px solid $border_color;
346
347
box.vertical toolbar.horizontal { border-bottom: 1px solid $border_color; }
348
}
349
}
350
351
352
/*********
353
* Atril *
354
*********/
355
.atril-window paned.horizontal box.vertical {
356
.frame { border-style: none; }
357
358
notebook .frame { border-top: 1px solid $border_color; }
359
}
360
361
362
/* mate-screensaver lock dialog */
363
.lock-dialog {
364
border-radius: $material_radius;
365
// not sure if box-shadow works here
366
box-shadow: $shadow_4, inset 0 1px $highlight_color;
367
368
frame > border { border-style: none; }
369
}
370
371
/* multimedia OSD */
372
MsdOsdWindow.background.osd {
373
border-radius: $material_radius;
374
background-color: $tooltip_bg_color;
375
color: $tooltip_fg_color;
376
377
.trough {
378
border-radius: 0;
379
background-color: $inverse_divider_color;
380
}
381
382
.progressbar {
383
border-radius: 0;
384
background-color: $primary_color;
385
}
386
387
// For mate-settings-daemon noncomposited osd windows
388
&.msd-osd-window-solid {
389
}
390
}
391