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
9
.mate-panel-menu-bar menubar,
10
#PanelApplet-window-menu-applet-button {
11
background-color: transparent;
12
}
13
// let's start it
15
.mate-panel-menu-bar {
16
background-color: $panel;
17
color: hint($on-panel);
18
font-weight: 500;
19
button {
21
min-height: 16px;
22
min-width: 16px;
23
padding: 0; // NOTE: Most buttons padding are hard-coded to 0 (except for hide buttons)
24
border-radius: 0;
25
background-color: transparent;
26
color: hint($on-panel);
27
@include ink-color($on-panel);
28
&:disabled {
30
color: disabled-hint($on-panel);
31
}
32
&:checked {
34
background-color: overlay("activated", $on-panel);
35
color: $on-panel;
36
@include ink-color($on-panel);
37
&:disabled {
39
color: disabled($on-panel);
40
}
41
}
42
}
43
}
44
// hide buttons
46
PanelToplevel.horizontal > grid > button {
47
min-width: 24px;
48
}
49
PanelToplevel.vertical > grid > button {
51
min-height: 24px;
52
}
53
#PanelApplet {
55
// border-width: 0;
56
}
57
PanelSeparator {
59
color: divider($on-panel);
60
}
61
// the grid left from na-tray and wncktasklist
63
MatePanelAppletFrameDBus > MatePanelAppletFrameDBus {
64
background-image:
65
repeating-linear-gradient(
66
currentcolor,
67
currentcolor 4px,
68
transparent 4px,
69
transparent 6px
70
);
71
background-repeat: no-repeat;
72
background-size: 4px 10px;
73
color: disabled-hint($on-panel);
74
&:dir(ltr) {
76
background-position: 3px;
77
}
78
&:dir(rtl) {
80
background-position: calc(100% - 3px);
81
}
82
}
83
// main menu
85
.mate-panel-menu-bar {
86
// set normal menubar button
87
menubar > menuitem {
88
color: hint($on-panel);
89
&:hover {
91
background-color: overlay("activated", $on-panel);
92
color: $on-panel;
93
}
94
&:disabled {
96
color: disabled-hint($on-panel);
97
}
98
}
99
&.horizontal menubar > menuitem {
101
padding: 0 8px;
102
}
103
&.vertical menubar > menuitem {
105
padding: 8px 0;
106
}
107
// set normal menubar menuitem
109
menubar menu > menuitem {
110
// adjust sizing since the menuitem has large icons
111
min-height: $menuitem-size;
112
padding: 0 6px;
113
// font-weight: initial;
114
}
115
}
116
// all applets
118
.mate-panel-menu-bar #PanelApplet button {
119
-GtkWidget-window-dragging: true;
120
// padding: 4px;
121
}
122
.mate-panel-menu-bar #tasklist-button {
124
border-image:
125
radial-gradient(
126
circle closest-corner at center calc(100% - 1px),
127
currentcolor 0%,
128
transparent 0%
129
) 0 0 0 / 0 0 0;
130
&:checked {
132
border-image:
133
radial-gradient(
134
circle closest-corner at center calc(100% - 1px),
135
currentcolor 100%,
136
transparent 0%
137
) 0 0 2 / 0 0 2px;
138
}
139
// instead of #tasklist-button { padding: 0 4px; }
141
image:dir(ltr),
142
label:dir(rtl) {
143
padding-left: 4px;
144
}
145
label:dir(ltr),
147
image:dir(rtl) {
148
padding-right: 4px;
149
}
150
}
151
// #tasklist-button is always horizontal even if the panel is vertical
153
.mate-panel-menu-bar.vertical #tasklist-button {
154
min-height: 32px;
155
}
156
#showdesktop-button {
158
.mate-panel-menu-bar.horizontal & image {
159
min-width: 24px;
160
padding: 0 4px;
161
}
162
.mate-panel-menu-bar.vertical & image {
164
min-height: 24px;
165
padding: 4px 0;
166
}
167
}
168
// WnckPager
170
PanelApplet.wnck-applet .wnck-pager {
171
background-color: transparent;
172
color: primary($on-panel);
173
&:hover {
175
background-color: overlay("hover", $on-panel);
176
}
177
&:active {
179
background-color: overlay("pressed", $on-panel);
180
}
181
&:selected {
183
background-color: $primary;
184
}
185
}
186
#clock-applet-button {
188
.mate-panel-menu-bar.horizontal & label {
189
padding: 0 8px;
190
}
191
.mate-panel-menu-bar.vertical & label {
193
padding: 8px 0;
194
}
195
}
196
#MatePanelPopupWindow {
198
border: 1px solid divider($on-surface);
199
border-radius: $corner-radius + 1px;
200
box-shadow: inset 0 1px highlight($surface);
201
background-clip: padding-box;
202
background-color: $surface;
203
frame > border {
205
border-style: none;
206
background-color: transparent;
207
}
208
calendar {
210
border-style: none;
211
&:not(:selected) {
213
background-color: transparent;
214
}
215
// Add separator between calendar and location
217
+ box {
218
margin-top: -5px;
219
padding-top: 5px;
220
border-top: 1px solid divider($on-surface);
221
}
222
}
223
expander > title {
225
min-height: 32px;
226
}
227
button {
229
@extend %button-flat-basic;
230
padding: 4px 16px;
232
}
233
// Weird, this sets the border color of the clockmap
235
> frame > box > box > box > widget {
236
color: divider($on-surface);
237
}
238
}
239
na-tray-applet {
241
-NaTrayApplet-icon-padding: 3px;
242
-NaTrayApplet-icon-size: 16;
243
}
244
// remove right space a bit
246
na-tray-applet > widget > box {
247
// margin-right: 2px;
248
}
249
// no background for icon-padding area
251
na-tray-applet widget box widget {
252
// background-color: transparent;
253
}
254
// Classic icon style
256
.mate-panel-menu-bar {
257
-PanelMenuBar-icon-visible: true;
258
}
259
// volume applet, brightness applet
261
.mate-panel-applet-slider {
262
border: 1px solid divider($on-surface);
263
border-radius: $corner-radius + 1px;
264
box-shadow: inset 0 1px highlight($surface);
265
background-clip: padding-box;
266
background-color: $surface;
267
frame > border {
269
border-style: none;
270
background-color: transparent;
271
}
272
}
273
// mate-menu
275
// #PanelApplet itself cannot change the background-color
277
#PanelApplet {
278
&:not(:selected) > box {
279
transition: $transition;
280
}
281
&:selected > box {
283
background-color: overlay("activated", $on-panel);
284
color: $on-panel;
285
}
286
}
287
#mate-menu {
289
// FIXME, does not work
290
border: 1px solid divider($on-surface);
291
background-clip: padding-box;
292
background-color: $surface;
293
button {
295
@extend %button-flat-basic;
296
min-height: 24px;
298
min-width: 24px;
299
padding: 4px 0;
300
color: $on-surface;
301
font-weight: normal;
302
&:not(.flat) {
304
background-color: overlay("activated", $on-surface);
305
}
306
image,
308
label + label {
309
color: hint($on-surface);
310
}
311
}
312
entry {
314
margin: 0 0 4px;
315
image {
317
margin: 0;
318
}
319
+ button {
321
margin: 0 4px 4px;
322
padding: ($medium-size - 24px) / 2;
323
}
324
}
325
}
326
// brisk-menu
328
.brisk-menu {
329
box-shadow: inset 0 1px highlight($surface);
330
background-color: $surface;
331
entry {
333
margin-bottom: -2px;
334
border-bottom: 1px solid divider($on-surface);
335
border-image: none;
336
box-shadow: none;
337
background-color: transparent;
338
}
339
entry + box > box {
341
&:dir(ltr) {
342
margin-right: -2px;
343
border-right: 1px solid divider($on-surface);
344
}
345
&:dir(rtl) {
347
margin-left: -2px;
348
border-left: 1px solid divider($on-surface);
349
}
350
}
351
.categories-list {
353
padding-top: 4px;
354
button {
356
margin: 0 4px;
357
}
358
}
359
.session-button {
361
padding: ($large-size - 24px) / 2;
362
}
363
.frame {
365
border-style: none;
366
background-color: transparent;
367
}
368
.apps-list {
370
padding: 4px 0;
371
background-color: transparent;
372
row {
374
padding: 0;
375
&:hover {
377
box-shadow: none;
378
}
379
}
380
button {
382
border-radius: 0;
383
color: $on-surface;
384
font-weight: normal;
385
}
386
}
387
}
388
/**
390
* CAJA File manager
391
*/
392
// pathbar toggle button
394
.caja-navigation-window box.horizontal > button.toggle.image-button {
395
@extend %button-flat-activatable;
396
border-radius: $corner-radius;
398
}
399
// pathbar
401
// pathbar buttons
402
.caja-pathbar button {
403
margin: 0 -1px 0 -2px;
404
// padding: 4px;
405
@extend %pathbar_button;
407
// NOTE: padding is hard-coded to 0
409
&.slider-button {
410
min-width: 24px;
411
}
412
// arrow button
414
> widget {
415
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
416
-GtkArrow-arrow-scaling: 1;
417
}
418
}
419
// places, treeview, history, information, emblems and notes
421
// .caja-side-pane notebook treeview.view,
422
// .caja-side-pane notebook textview.view text,
423
.caja-side-pane notebook viewport.frame,
424
.caja-side-pane notebook widget .vertical {
425
// background-color: $base;
426
}
427
// treeview rows
429
.caja-side-pane treeview.view {
430
// padding: 2px 0;
431
}
432
.caja-side-pane notebook,
434
.caja-notebook {
435
border-top: 1px solid divider($on-surface);
436
.frame {
438
border-style: none;
439
background-color: transparent;
440
}
441
}
442
// window and desktop mode
444
.caja-canvas-item {
445
border-radius: $corner-radius;
446
}
447
// desktop mode
449
.caja-desktop.caja-canvas-item {
450
@extend %iconview-desktop;
451
}
452
.caja-desktop EelEditableLabel.entry {
454
}
455
// override https://github.com/mate-desktop/caja/blob/master/data/caja.css
457
.caja-desktop.view .entry,
458
.caja-navigation-window .view .entry {
459
border: none;
460
border-radius: $corner-radius;
461
background-color: entry-fill($on-surface);
462
background-image: none;
463
color: $on-surface;
464
&:selected {
466
background-color: $overlay-selected;
467
}
468
}
469
.caja-desktop.view .entry {
471
background-color: $scrim-alt;
472
color: $on-dark;
473
text-shadow: $text-shadow;
474
caret-color: currentcolor; // this shouldn't be needed.
475
&:selected {
477
// FIXME: this should have light overlay.
478
background-color: $overlay-selected;
479
}
480
}
481
// statusbar
483
.caja-navigation-window statusbar {
484
margin: 0 -10px;
485
padding: 0 4px;
486
border-top: 1px solid divider($on-surface);
487
}
488
// infobar
490
.caja-notebook frame > border {
492
border-style: none;
493
background-color: transparent;
494
}
495
#caja-extra-view-widget {
497
border-bottom: 1px solid divider($on-surface);
498
// background-color: $base;
499
> box > box > label {
501
font-weight: bold;
502
}
503
button {
505
@extend %button-flat;
506
&:not(:disabled) {
508
color: $primary;
509
@include ink-color($primary);
510
}
511
}
512
}
513
/**
515
* Pluma
516
*/
517
// Pluma status bar
519
.pluma-window statusbar {
520
margin: 0 -10px;
521
padding: 0 4px;
522
border-top: 1px solid divider($on-surface);
523
frame {
525
> border {
526
border-style: none;
527
background-color: transparent;
528
}
529
button.flat {
531
padding: 0 4px;
532
border-radius: 0;
533
widget {
535
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
536
-GtkArrow-arrow-scaling: 1;
537
}
538
}
539
}
540
}
541
// Printpreview
543
.pluma-print-preview {
544
toolbar {
545
border-bottom: 1px solid divider($on-surface);
546
}
547
scrolledwindow {
549
// background-color: $base;
550
}
551
}
552
// sidebar file-browser
554
.pluma-window paned.horizontal box.vertical {
555
box.horizontal button.flat {
556
margin: 1px;
557
@extend %button-small;
559
}
560
.frame {
562
border-style: none;
563
background-color: transparent;
564
}
565
notebook.frame {
567
margin-top: -1px;
568
border-top: 1px solid divider($on-surface);
569
box.vertical toolbar.horizontal {
571
border-bottom: 1px solid divider($on-surface);
572
}
573
}
574
}
575
/**
577
* Atril
578
*/
579
.atril-window paned.horizontal box.vertical {
581
.frame {
582
border-style: none;
583
background-color: transparent;
584
}
585
notebook .frame {
587
border-top: 1px solid divider($on-surface);
588
}
589
}
590
/* mate-screensaver lock dialog */
592
.lock-dialog {
594
border: 1px solid divider($on-surface);
595
border-radius: $corner-radius + 1px;
596
box-shadow: $shadow-z6, inset 0 1px highlight($surface); // not sure if box-shadow works here
597
background-clip: padding-box;
598
background-color: $surface;
599
frame > border {
601
border-style: none;
602
background-color: transparent;
603
}
604
button {
606
@extend %button-flat;
607
&:not(:disabled) {
609
color: $primary;
610
@include ink-color($primary);
611
}
612
}
613
}
614
/* multimedia OSD */
616
MsdOsdWindow.background.osd {
618
border-radius: $corner-radius;
619
background-color: $tooltip;
620
color: $on-tooltip;
621
.trough {
623
border-radius: 0;
624
background-color: disabled-stroke($on-tooltip);
625
}
626
.progressbar {
628
border-radius: 0;
629
background-color: $on-tooltip;
630
}
631
// For mate-settings-daemon noncomposited osd windows
633
&.msd-osd-window-solid {
634
}
635
}
636