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