_mate.scss
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: $panel;
16
color: on($panel, secondary);
17
font-weight: 500;
18
19
button {
20
@extend %flat_button;
21
@extend %button_selected.flat;
22
23
min-height: 16px;
24
min-width: 16px;
25
padding: 0; // NOTE: Most buttons padding are hard-coded to 0 (except hide buttons)
26
border-radius: 0;
27
}
28
}
29
30
// hide buttons
31
PanelToplevel.horizontal > grid > button {
32
min-width: 24px;
33
}
34
35
PanelToplevel.vertical > grid > button {
36
min-height: 24px;
37
}
38
39
#PanelApplet {
40
// border-width: 0;
41
}
42
43
PanelSeparator {
44
color: on($panel, divider);
45
}
46
47
// the grid left from na-tray and wncktasklist
48
MatePanelAppletFrameDBus {
49
border-style: solid;
50
border-color: on($panel, divider);
51
52
.mate-panel-menu-bar.horizontal & { border-width: 0 1px; }
53
.mate-panel-menu-bar.vertical & { border-width: 1px 0; }
54
}
55
56
// main menu
57
.mate-panel-menu-bar {
58
// set normal menubar button
59
menubar > menuitem {
60
color: on($panel, secondary);
61
62
&:hover { color: on($panel); }
63
64
&:disabled { color: on($panel, secondary-disabled); }
65
}
66
67
&.horizontal menubar > menuitem { padding: 0 8px; }
68
&.vertical menubar > menuitem { padding: 8px 0; }
69
70
// set normal menubar menuitem
71
menubar menu > menuitem {
72
// adjust sizing since the menuitem has large icons
73
min-height: $menuitem-size;
74
padding: 0 6px;
75
// font-weight: initial;
76
}
77
}
78
79
// all applets
80
.mate-panel-menu-bar #PanelApplet button {
81
-GtkWidget-window-dragging: true;
82
// padding: 4px;
83
}
84
85
.mate-panel-menu-bar #tasklist-button {
86
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px),
87
currentColor 0%,
88
transparent 0%)
89
0 0 0 / 0 0 0px;
90
91
&:checked {
92
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px),
93
currentColor 100%,
94
transparent 0%)
95
0 0 2 / 0 0 2px;
96
}
97
98
// instead of #tasklist-button { padding: 0 4px; }
99
image:dir(ltr), label:dir(rtl) { padding-left: 4px; }
100
label:dir(ltr), image:dir(rtl) { padding-right: 4px; }
101
}
102
103
// #tasklist-button is always horizontal even if the panel is vertical
104
.mate-panel-menu-bar.vertical #tasklist-button { min-height: 32px; }
105
106
#showdesktop-button {
107
.mate-panel-menu-bar.horizontal & image {
108
min-width: 24px;
109
padding: 0 4px;
110
}
111
112
.mate-panel-menu-bar.vertical & image {
113
min-height: 24px;
114
padding: 4px 0;
115
}
116
}
117
118
// WnckPager
119
PanelApplet.wnck-applet .wnck-pager {
120
background-color: transparent;
121
color: $primary-light;
122
123
&:hover { background-color: $overlay-hover; }
124
125
&:active { background-color: $overlay-active; }
126
127
&:selected { background-color: $primary; }
128
}
129
130
#clock-applet-button {
131
.mate-panel-menu-bar.horizontal & label { padding: 0 8px; }
132
.mate-panel-menu-bar.vertical & label { padding: 8px 0; }
133
}
134
135
#MatePanelPopupWindow {
136
border: 1px solid $frame;
137
border-radius: $corner-radius + 1px;
138
box-shadow: inset 0 1px highlight($surface);
139
background-color: $surface;
140
141
frame > border { border-style: none; }
142
143
calendar {
144
border-style: none;
145
146
&:not(:selected) { background-color: transparent; }
147
148
// Add separator between calendar and location
149
+ box {
150
margin-top: -5px;
151
padding-top: 5px;
152
border-top: 1px solid $divider;
153
}
154
}
155
156
expander > title { min-height: 32px; }
157
158
button {
159
@extend %simple_flat_button;
160
161
padding: 4px 16px;
162
}
163
164
// Weird, this sets the border color of the clockmap
165
> frame > box > box > box > widget { color: $divider; }
166
}
167
168
na-tray-applet {
169
-NaTrayApplet-icon-padding: 3px;
170
-NaTrayApplet-icon-size: 16;
171
}
172
173
// remove right space a bit
174
na-tray-applet > widget > box {
175
// margin-right: 2px;
176
}
177
178
// no background for icon-padding area
179
na-tray-applet widget box widget {
180
// background-color: transparent;
181
}
182
183
// Classic icon style
184
.mate-panel-menu-bar {
185
-PanelMenuBar-icon-visible: true;
186
}
187
188
// volume applet, brightness applet
189
.mate-panel-applet-slider {
190
border: 1px solid $frame;
191
border-radius: $corner-radius + 1px;
192
box-shadow: inset 0 1px highlight($surface);
193
background-color: $surface;
194
195
frame > border { border-style: none; }
196
}
197
198
// mate-menu
199
200
// mimic menubar menuitem style
201
#PanelApplet {
202
&:not(:selected) > box { transition: $transition; }
203
204
&:selected > box {
205
background-color: $overlay-checked;
206
color: on($panel);
207
}
208
}
209
210
#mate-menu {
211
// FIXME, does not work
212
border: 1px solid $frame;
213
background-color: $surface;
214
215
button {
216
@extend %simple_flat_button;
217
218
min-height: 24px;
219
min-width: 24px;
220
padding: 4px 0;
221
color: $text;
222
font-weight: normal;
223
224
&:not(.flat) { background-color: $overlay-checked; }
225
226
image,
227
label + label { color: $text-secondary; }
228
}
229
230
entry {
231
margin: 0 0 4px;
232
233
image { margin: 0; }
234
235
+ button {
236
margin: 0 4px 4px;
237
padding: ($medium-size - 24px) / 2;
238
}
239
}
240
}
241
242
// brisk-menu
243
.brisk-menu {
244
box-shadow: inset 0 1px highlight($surface);
245
background-color: $surface;
246
247
entry {
248
margin-bottom: -2px;
249
border-bottom: 1px solid $divider;
250
border-image: none;
251
box-shadow: none;
252
background-color: transparent;
253
}
254
255
entry + box > box {
256
&:dir(ltr) {
257
margin-right: -2px;
258
border-right: 1px solid $divider;
259
}
260
261
&:dir(rtl) {
262
margin-left: -2px;
263
border-left: 1px solid $divider;
264
}
265
}
266
267
.categories-list {
268
padding-top: 4px;
269
270
button {
271
margin: 0 4px;
272
273
&:checked { color: $primary; }
274
}
275
}
276
277
.session-button { padding: ($large-size - 24px) / 2; }
278
279
.frame { border-style: none; }
280
281
.apps-list {
282
padding: 4px 0;
283
background-color: transparent;
284
285
row {
286
padding: 0;
287
288
&:hover { box-shadow: none; }
289
}
290
291
button {
292
border-radius: 0;
293
color: $text;
294
font-weight: normal;
295
}
296
}
297
}
298
299
300
/*********************
301
* CAJA File manager *
302
*********************/
303
// pathpar toggle button
304
.caja-navigation-window button.toggle.image-button {
305
border-radius: $corner-radius;
306
}
307
308
// pathbar
309
// pathbar buttons
310
.caja-pathbar button {
311
margin: 0 -1px 0 -2px;
312
// padding: 4px;
313
314
@extend %pathbar_button;
315
316
// arrow button
317
> widget {
318
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
319
-GtkArrow-arrow-scaling: 1;
320
}
321
}
322
323
// places, treeview, history, information, emblems and notes
324
// .caja-side-pane notebook treeview.view,
325
// .caja-side-pane notebook textview.view text,
326
.caja-side-pane notebook viewport.frame,
327
.caja-side-pane notebook widget .vertical {
328
background-color: $base;
329
}
330
331
// treeview rows
332
.caja-side-pane treeview.view {
333
// padding: 2px 0;
334
}
335
336
.caja-side-pane notebook,
337
.caja-notebook {
338
border-top: 1px solid $divider;
339
340
.frame { border-style: none; }
341
}
342
343
// window and desktop mode
344
.caja-canvas-item {
345
// border-radius: $corner-radius;
346
}
347
348
// desktop mode
349
.caja-desktop.caja-canvas-item {
350
@extend .nautilus-desktop.nautilus-canvas-item;
351
}
352
353
.caja-desktop EelEditableLabel.entry {
354
}
355
356
// statusbar
357
.caja-navigation-window statusbar {
358
margin: 0 -10px;
359
padding: 0 4px;
360
border-top: 1px solid $divider;
361
}
362
363
// infobar
364
.caja-notebook frame > border {
365
border-style: none;
366
}
367
368
#caja-extra-view-widget {
369
border-bottom: 1px solid $divider;
370
background-color: $base; // needs overriding
371
372
> box > box > label { font-weight: bold; }
373
}
374
375
376
/*********
377
* Pluma *
378
*********/
379
// Pluma status bar
380
.pluma-window statusbar {
381
margin: 0 -10px;
382
padding: 0 4px;
383
border-top: 1px solid $divider;
384
385
frame {
386
> border { border-style: none; }
387
388
button.flat {
389
padding: 0 4px;
390
border-radius: 0;
391
392
widget {
393
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
394
-GtkArrow-arrow-scaling: 1;
395
}
396
}
397
}
398
}
399
400
// Printpreview
401
.pluma-print-preview {
402
toolbar { border-bottom: 1px solid $divider; }
403
404
// scrolledwindow { background-color: $base; }
405
}
406
407
// sidebar file-browser
408
.pluma-window paned.horizontal box.vertical {
409
box.horizontal button.flat {
410
margin: 1px;
411
412
@extend %small_button;
413
}
414
415
.frame { border-style: none; }
416
417
notebook.frame {
418
margin-top: -1px;
419
border-top: 1px solid $divider;
420
421
box.vertical toolbar.horizontal { border-bottom: 1px solid $divider; }
422
}
423
}
424
425
426
/*********
427
* Atril *
428
*********/
429
.atril-window paned.horizontal box.vertical {
430
.frame { border-style: none; }
431
432
notebook .frame { border-top: 1px solid $divider; }
433
}
434
435
436
/* mate-screensaver lock dialog */
437
.lock-dialog {
438
border: 1px solid $frame;
439
border-radius: $corner-radius + 1px;
440
box-shadow: $shadow-4, inset 0 1px highlight($surface); // not sure if box-shadow works here
441
background-color: $surface;
442
443
frame > border { border-style: none; }
444
445
button {
446
@extend %simple_flat_button;
447
}
448
}
449
450
/* multimedia OSD */
451
MsdOsdWindow.background.osd {
452
border-radius: $corner-radius;
453
background-color: $tooltip;
454
color: on($tooltip);
455
456
.trough {
457
border-radius: 0;
458
background-color: on($tooltip, track-disabled);
459
}
460
461
.progressbar {
462
border-radius: 0;
463
background-color: $primary;
464
}
465
466
// For mate-settings-daemon noncomposited osd windows
467
&.msd-osd-window-solid {
468
}
469
}
470