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
/**************
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
// let's start it
14
.mate-panel-menu-bar {
15
background-color: $panel;
16
color: on($panel, text2);
17
font-weight: 500;
18
button {
20
min-height: 16px;
21
min-width: 16px;
22
padding: 0; // NOTE: Most buttons padding are hard-coded to 0 (except for hide buttons)
23
border-radius: 0;
24
@include ink-color(on($panel, text2));
26
&:disabled { color: on($panel, text2-disabled); }
28
&:checked {
30
color: on(dark);
31
&:disabled { color: on(dark, text-disabled); }
33
}
34
}
35
}
36
// hide buttons
38
PanelToplevel.horizontal > grid > button {
39
min-width: 24px;
40
}
41
PanelToplevel.vertical > grid > button {
43
min-height: 24px;
44
}
45
#PanelApplet {
47
// border-width: 0;
48
}
49
PanelSeparator {
51
color: on($panel, divider);
52
}
53
// the grid left from na-tray and wncktasklist
55
MatePanelAppletFrameDBus > MatePanelAppletFrameDBus {
56
background-image:
57
repeating-linear-gradient(
58
currentcolor,
59
currentcolor 4px,
60
transparent 4px,
61
transparent 6px
62
);
63
background-repeat: no-repeat;
64
background-size: 4px 10px;
65
color: on($panel, text2-disabled);
66
&:dir(ltr) { background-position: 3px; }
68
&:dir(rtl) { background-position: calc(100% - 3px); }
70
}
71
// main menu
73
.mate-panel-menu-bar {
74
// set normal menubar button
75
menubar > menuitem {
76
color: on($panel, text2);
77
&:hover { color: on($panel); }
79
&:disabled { color: on($panel, text2-disabled); }
81
}
82
&.horizontal menubar > menuitem { padding: 0 8px; }
84
&.vertical menubar > menuitem { padding: 8px 0; }
85
// set normal menubar menuitem
87
menubar menu > menuitem {
88
// adjust sizing since the menuitem has large icons
89
min-height: $menuitem-size;
90
padding: 0 6px;
91
// font-weight: initial;
92
}
93
}
94
// all applets
96
.mate-panel-menu-bar #PanelApplet button {
97
-GtkWidget-window-dragging: true;
98
// padding: 4px;
99
}
100
.mate-panel-menu-bar #tasklist-button {
102
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px),
103
currentColor 0%,
104
transparent 0%)
105
0 0 0 / 0 0 0px;
106
&:checked {
108
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px),
109
currentColor 100%,
110
transparent 0%)
111
0 0 2 / 0 0 2px;
112
}
113
// instead of #tasklist-button { padding: 0 4px; }
115
image:dir(ltr), label:dir(rtl) { padding-left: 4px; }
116
label:dir(ltr), image:dir(rtl) { padding-right: 4px; }
117
}
118
// #tasklist-button is always horizontal even if the panel is vertical
120
.mate-panel-menu-bar.vertical #tasklist-button { min-height: 32px; }
121
#showdesktop-button {
123
.mate-panel-menu-bar.horizontal & image {
124
min-width: 24px;
125
padding: 0 4px;
126
}
127
.mate-panel-menu-bar.vertical & image {
129
min-height: 24px;
130
padding: 4px 0;
131
}
132
}
133
// WnckPager
135
PanelApplet.wnck-applet .wnck-pager {
136
background-color: transparent;
137
color: on($panel, primary);
138
&:hover { background-color: $overlay-hover; }
140
&:active { background-color: $overlay-active; }
142
&:selected { background-color: $primary; }
144
}
145
#clock-applet-button {
147
.mate-panel-menu-bar.horizontal & label { padding: 0 8px; }
148
.mate-panel-menu-bar.vertical & label { padding: 8px 0; }
149
}
150
#MatePanelPopupWindow {
152
border: 1px solid $divider;
153
border-radius: $corner-radius + 1px;
154
box-shadow: inset 0 1px highlight($surface);
155
background-color: $surface;
156
frame > border { border-style: none; }
158
calendar {
160
border-style: none;
161
&:not(:selected) { background-color: transparent; }
163
// Add separator between calendar and location
165
+ box {
166
margin-top: -5px;
167
padding-top: 5px;
168
border-top: 1px solid $divider;
169
}
170
}
171
expander > title { min-height: 32px; }
173
button {
175
@extend %button-flat-basic;
176
padding: 4px 16px;
178
}
179
// Weird, this sets the border color of the clockmap
181
> frame > box > box > box > widget { color: $divider; }
182
}
183
na-tray-applet {
185
-NaTrayApplet-icon-padding: 3px;
186
-NaTrayApplet-icon-size: 16;
187
}
188
// remove right space a bit
190
na-tray-applet > widget > box {
191
// margin-right: 2px;
192
}
193
// no background for icon-padding area
195
na-tray-applet widget box widget {
196
// background-color: transparent;
197
}
198
// Classic icon style
200
.mate-panel-menu-bar {
201
-PanelMenuBar-icon-visible: true;
202
}
203
// volume applet, brightness applet
205
.mate-panel-applet-slider {
206
border: 1px solid $divider;
207
border-radius: $corner-radius + 1px;
208
box-shadow: inset 0 1px highlight($surface);
209
background-color: $surface;
210
frame > border { border-style: none; }
212
}
213
// mate-menu
215
// #PanelApplet itself cannot change the background-color
217
#PanelApplet {
218
&:not(:selected) > box { transition: $transition; }
219
&:selected > box {
221
background-color: $overlay-checked;
222
color: on($panel);
223
}
224
}
225
#mate-menu {
227
// FIXME, does not work
228
border: 1px solid $divider;
229
background-color: $surface;
230
button {
232
@extend %button-flat-basic;
233
min-height: 24px;
235
min-width: 24px;
236
padding: 4px 0;
237
color: $text;
238
font-weight: normal;
239
&:not(.flat) { background-color: $overlay-checked; }
241
image,
243
label + label { color: $text2; }
244
}
245
entry {
247
margin: 0 0 4px;
248
image { margin: 0; }
250
+ button {
252
margin: 0 4px 4px;
253
padding: ($medium-size - 24px) / 2;
254
}
255
}
256
}
257
// brisk-menu
259
.brisk-menu {
260
box-shadow: inset 0 1px highlight($surface);
261
background-color: $surface;
262
entry {
264
margin-bottom: -2px;
265
border-bottom: 1px solid $divider;
266
border-image: none;
267
box-shadow: none;
268
background-color: transparent;
269
}
270
entry + box > box {
272
&:dir(ltr) {
273
margin-right: -2px;
274
border-right: 1px solid $divider;
275
}
276
&:dir(rtl) {
278
margin-left: -2px;
279
border-left: 1px solid $divider;
280
}
281
}
282
.categories-list {
284
padding-top: 4px;
285
button {
287
margin: 0 4px;
288
&:checked { @include ink-color($primary); }
290
}
291
}
292
.session-button { padding: ($large-size - 24px) / 2; }
294
.frame { border-style: none; }
296
.apps-list {
298
padding: 4px 0;
299
background-color: transparent;
300
row {
302
padding: 0;
303
&:hover { box-shadow: none; }
305
}
306
button {
308
border-radius: 0;
309
color: $text;
310
font-weight: normal;
311
}
312
}
313
}
314
/*********************
317
* CAJA File manager *
318
*********************/
319
// pathbar toggle button
320
.caja-navigation-window box.horizontal > button.toggle.image-button {
321
@extend %button-flat-activatable;
322
border-radius: $corner-radius;
324
}
325
// pathbar
327
// pathbar buttons
328
.caja-pathbar button {
329
margin: 0 -1px 0 -2px;
330
// padding: 4px;
331
@extend %pathbar_button;
333
// NOTE: padding is hard-coded to 0
335
&.slider-button { min-width: 24px; }
336
// arrow button
338
> widget {
339
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
340
-GtkArrow-arrow-scaling: 1;
341
}
342
}
343
// places, treeview, history, information, emblems and notes
345
// .caja-side-pane notebook treeview.view,
346
// .caja-side-pane notebook textview.view text,
347
.caja-side-pane notebook viewport.frame,
348
.caja-side-pane notebook widget .vertical {
349
background-color: $base;
350
}
351
// treeview rows
353
.caja-side-pane treeview.view {
354
// padding: 2px 0;
355
}
356
.caja-side-pane notebook,
358
.caja-notebook {
359
border-top: 1px solid $divider;
360
.frame { border-style: none; }
362
}
363
// window and desktop mode
365
.caja-canvas-item {
366
border-radius: $corner-radius;
367
}
368
// desktop mode
370
.caja-desktop.caja-canvas-item {
371
@extend %iconview-desktop;
372
}
373
.caja-desktop EelEditableLabel.entry {
375
}
376
// override https://github.com/mate-desktop/caja/blob/master/data/caja.css
378
.caja-desktop.view .entry,
379
.caja-navigation-window .view .entry {
380
border: none;
381
border-radius: $corner-radius;
382
background-color: $entry-fill;
383
background-image: none;
384
color: $text;
385
&:selected { background-color: $overlay-selected; }
387
}
388
.caja-desktop.view .entry {
390
background-color: $scrim-alt;
391
color: on(dark);
392
text-shadow: $text-shadow;
393
caret-color: currentColor; // this shouldn't be needed.
394
&:selected { background-color: $overlay-selected; } // FIXME: this should have light overlay.
396
}
397
// statusbar
399
.caja-navigation-window statusbar {
400
margin: 0 -10px;
401
padding: 0 4px;
402
border-top: 1px solid $divider;
403
}
404
// infobar
406
.caja-notebook frame > border {
408
border-style: none;
409
}
410
#caja-extra-view-widget {
412
border-bottom: 1px solid $divider;
413
background-color: $base;
414
> box > box > label { font-weight: bold; }
416
button {
418
@extend %button-flat;
419
&:not(:disabled) { @include ink-color($primary); }
421
}
422
}
423
/*********
426
* Pluma *
427
*********/
428
// Pluma status bar
429
.pluma-window statusbar {
430
margin: 0 -10px;
431
padding: 0 4px;
432
border-top: 1px solid $divider;
433
frame {
435
> border { border-style: none; }
436
button.flat {
438
padding: 0 4px;
439
border-radius: 0;
440
widget {
442
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
443
-GtkArrow-arrow-scaling: 1;
444
}
445
}
446
}
447
}
448
// Printpreview
450
.pluma-print-preview {
451
toolbar { border-bottom: 1px solid $divider; }
452
// scrolledwindow { background-color: $base; }
454
}
455
// sidebar file-browser
457
.pluma-window paned.horizontal box.vertical {
458
box.horizontal button.flat {
459
margin: 1px;
460
@extend %button-small;
462
}
463
.frame { border-style: none; }
465
notebook.frame {
467
margin-top: -1px;
468
border-top: 1px solid $divider;
469
box.vertical toolbar.horizontal { border-bottom: 1px solid $divider; }
471
}
472
}
473
/*********
476
* Atril *
477
*********/
478
.atril-window paned.horizontal box.vertical {
479
.frame { border-style: none; }
480
notebook .frame { border-top: 1px solid $divider; }
482
}
483
/* mate-screensaver lock dialog */
486
.lock-dialog {
487
border: 1px solid $divider;
488
border-radius: $corner-radius + 1px;
489
box-shadow: $shadow-z6, inset 0 1px highlight($surface); // not sure if box-shadow works here
490
background-color: $surface;
491
frame > border { border-style: none; }
493
button {
495
@extend %button-flat;
496
&:not(:disabled) { @include ink-color($primary); }
498
}
499
}
500
/* multimedia OSD */
502
MsdOsdWindow.background.osd {
503
border-radius: $corner-radius;
504
background-color: $tooltip;
505
color: on($tooltip);
506
.trough {
508
border-radius: 0;
509
background-color: on($tooltip, stroke-disabled);
510
}
511
.progressbar {
513
border-radius: 0;
514
background-color: on($tooltip);
515
}
516
// For mate-settings-daemon noncomposited osd windows
518
&.msd-osd-window-solid {
519
}
520
}
521