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.

 gtk-compact.css

View raw Download
text/plain • 139.97 kiB
ASCII text, with very long lines (677)
        
            
1
@keyframes ripple_effect {
2
to {
3
background-size: 1000% 1000%;
4
}
5
}
6
7
@keyframes header_ripple_effect {
8
from {
9
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 0%, transparent 0%);
10
}
11
to {
12
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 100%, transparent 0%);
13
}
14
}
15
16
* {
17
background-clip: padding-box;
18
-GtkToolButton-icon-spacing: 0;
19
-GtkTextView-error-underline-color: #DD2C00;
20
-GtkScrolledWindow-scrollbar-spacing: 0;
21
-GtkToolItemGroup-expander-size: 11;
22
-GtkWidget-text-handle-width: 24;
23
-GtkWidget-text-handle-height: 24;
24
-GtkDialog-button-spacing: 4;
25
-GtkDialog-action-area-border: 0;
26
outline-style: solid;
27
outline-width: 2px;
28
outline-color: transparent;
29
outline-offset: -4px;
30
-gtk-outline-radius: 2px;
31
-gtk-secondary-caret-color: #42A5F5;
32
}
33
34
switch:focus slider,
35
notebook:focus tab,
36
*:focus {
37
outline-color: alpha(currentColor, 0.3);
38
}
39
40
/***************
41
* Base States *
42
***************/
43
.background {
44
background-color: #F5F5F5;
45
color: rgba(0, 0, 0, 0.87);
46
}
47
48
/*
49
These wildcard seems unavoidable, need to investigate.
50
Wildcards are bad and troublesome, use them with care,
51
or better, just don't.
52
Everytime a wildcard is used a kitten dies, painfully.
53
*/
54
*:disabled {
55
-gtk-icon-effect: dim;
56
}
57
58
.gtkstyle-fallback {
59
background-color: #F5F5F5;
60
color: rgba(0, 0, 0, 0.87);
61
}
62
63
.gtkstyle-fallback:hover {
64
background-color: #e8e8e8;
65
color: rgba(0, 0, 0, 0.87);
66
}
67
68
.gtkstyle-fallback:active {
69
background-color: gainsboro;
70
color: rgba(0, 0, 0, 0.87);
71
}
72
73
.gtkstyle-fallback:disabled {
74
background-color: #F5F5F5;
75
color: rgba(0, 0, 0, 0.38);
76
}
77
78
.gtkstyle-fallback:selected {
79
background-color: #42A5F5;
80
color: #FFFFFF;
81
}
82
83
.view {
84
background-color: #FFFFFF;
85
color: rgba(0, 0, 0, 0.87);
86
}
87
88
.view:disabled {
89
color: rgba(0, 0, 0, 0.38);
90
}
91
92
.view:hover, .view:active, .view:selected {
93
border-radius: 2px;
94
}
95
96
textview text {
97
background-color: #FFFFFF;
98
}
99
100
textview border {
101
background-color: #FAFAFA;
102
color: rgba(0, 0, 0, 0.38);
103
}
104
105
.rubberband,
106
rubberband,
107
flowbox rubberband,
108
treeview.view rubberband,
109
.content-view rubberband,
110
.content-view .rubberband {
111
border: 1px solid #40C4FF;
112
background-color: rgba(64, 196, 255, 0.3);
113
}
114
115
flowbox flowboxchild {
116
padding: 4px;
117
border-radius: 2px;
118
}
119
120
.content-view .tile:selected {
121
background-color: transparent;
122
color: inherit;
123
}
124
125
label {
126
caret-color: currentColor;
127
}
128
129
label.separator {
130
color: rgba(0, 0, 0, 0.87);
131
}
132
133
label selection {
134
background-color: #42A5F5;
135
color: #FFFFFF;
136
}
137
138
label:disabled {
139
color: rgba(0, 0, 0, 0.38);
140
}
141
142
tab label:disabled,
143
button label:disabled {
144
color: inherit;
145
}
146
147
.dim-label, label.separator, .titlebar:not(headerbar) .subtitle,
148
headerbar .subtitle, .budgie-notification .notification-body, .budgie-switcher .notification-body {
149
opacity: 0.6;
150
}
151
152
assistant .sidebar {
153
padding: 4px 0;
154
}
155
156
assistant .sidebar label {
157
min-height: 32px;
158
padding: 0 12px;
159
color: rgba(0, 0, 0, 0.38);
160
font-weight: 500;
161
}
162
163
assistant .sidebar label.highlight {
164
color: rgba(0, 0, 0, 0.87);
165
}
166
167
popover.background.touch-selection, popover.background.magnifier, popover.background.osd, .app-notification, .osd .scale-popup, .nautilus-window .floating-bar, .osd {
168
opacity: 0.9;
169
}
170
171
/*********************
172
* Spinner Animation *
173
*********************/
174
@keyframes spin {
175
to {
176
-gtk-icon-transform: rotate(1turn);
177
}
178
}
179
180
spinner {
181
background: none;
182
opacity: 0;
183
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
184
}
185
186
spinner:checked {
187
opacity: 1;
188
animation: spin 1s linear infinite;
189
}
190
191
spinner:checked:disabled {
192
opacity: 0.5;
193
}
194
195
/****************
196
* Text Entries *
197
****************/
198
spinbutton:not(.vertical),
199
entry {
200
min-height: 32px;
201
padding: 0 8px;
202
border-radius: 2px;
203
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
204
border-image: none;
205
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
206
background-color: #FFFFFF;
207
color: rgba(0, 0, 0, 0.87);
208
}
209
210
spinbutton:focus:not(.vertical),
211
entry:focus {
212
border-image: none;
213
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
214
}
215
216
spinbutton:disabled:not(.vertical),
217
entry:disabled {
218
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
219
background-color: #FAFAFA;
220
color: rgba(0, 0, 0, 0.38);
221
}
222
223
spinbutton.flat:not(.vertical), notebook > stack:not(:only-child) entry:not(.search),
224
notebook > stack:not(:only-child) spinbutton:not(.vertical), messagedialog entry, colorchooser .popover.osd spinbutton:not(.vertical), layoutpane entry.search, editortweak entry.search, .raven .raven-background spinbutton:not(.vertical), #login_window entry,
225
entry.flat {
226
border-radius: 0;
227
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
228
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
229
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.26);
230
background-color: transparent;
231
color: rgba(0, 0, 0, 0.87);
232
}
233
234
spinbutton.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry:focus:not(.search),
235
notebook > stack:not(:only-child) spinbutton:focus:not(.vertical), messagedialog entry:focus, colorchooser .popover.osd spinbutton:focus:not(.vertical), layoutpane entry.search:focus, editortweak entry.search:focus, .raven .raven-background spinbutton:focus:not(.vertical), #login_window entry:focus,
236
entry.flat:focus {
237
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
238
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.26);
239
}
240
241
spinbutton.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry:disabled:not(.search),
242
notebook > stack:not(:only-child) spinbutton:disabled:not(.vertical), messagedialog entry:disabled, colorchooser .popover.osd spinbutton:disabled:not(.vertical), layoutpane entry.search:disabled, editortweak entry.search:disabled, .raven .raven-background spinbutton:disabled:not(.vertical), #login_window entry:disabled,
243
entry.flat:disabled {
244
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12);
245
background-color: transparent;
246
color: rgba(0, 0, 0, 0.38);
247
}
248
249
spinbutton:not(.vertical) image,
250
entry image {
251
color: rgba(0, 0, 0, 0.54);
252
}
253
254
spinbutton:not(.vertical) image:hover, spinbutton:not(.vertical) image:active,
255
entry image:hover,
256
entry image:active {
257
color: rgba(0, 0, 0, 0.87);
258
}
259
260
spinbutton:not(.vertical) image:disabled,
261
entry image:disabled {
262
color: rgba(0, 0, 0, 0.38);
263
}
264
265
spinbutton:not(.vertical) image.left,
266
entry image.left {
267
margin-left: 0px;
268
margin-right: 6px;
269
}
270
271
spinbutton:not(.vertical) image.right,
272
entry image.right {
273
margin-left: 6px;
274
margin-right: 0px;
275
}
276
277
spinbutton:not(.vertical) undershoot.left,
278
entry undershoot.left {
279
background-color: transparent;
280
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%);
281
padding-left: 1px;
282
background-size: 1px 12px;
283
background-repeat: repeat-y;
284
background-origin: content-box;
285
background-position: left top;
286
}
287
288
spinbutton:not(.vertical) undershoot.right,
289
entry undershoot.right {
290
background-color: transparent;
291
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%);
292
padding-right: 1px;
293
background-size: 1px 12px;
294
background-repeat: repeat-y;
295
background-origin: content-box;
296
background-position: right top;
297
}
298
299
spinbutton.error:not(.vertical),
300
entry.error {
301
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
302
border-image: none;
303
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
304
background-color: #DD2C00;
305
color: #FFFFFF;
306
}
307
308
spinbutton.error:focus:not(.vertical),
309
entry.error:focus {
310
border-image: none;
311
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
312
}
313
314
spinbutton.error:disabled:not(.vertical),
315
entry.error:disabled {
316
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
317
background-color: #FAFAFA;
318
color: rgba(0, 0, 0, 0.38);
319
}
320
321
spinbutton.error.flat:not(.vertical), notebook > stack:not(:only-child) entry.error:not(.search),
322
notebook > stack:not(:only-child) spinbutton.error:not(.vertical), messagedialog entry.error, colorchooser .popover.osd spinbutton.error:not(.vertical), layoutpane entry.error.search, editortweak entry.error.search, .raven .raven-background spinbutton.error:not(.vertical), #login_window entry.error,
323
entry.error.flat {
324
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
325
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #DD2C00 0%, transparent 0%) 0 0 0/0 0 0px;
326
box-shadow: inset 0 -1px #DD2C00;
327
background-color: transparent;
328
color: rgba(0, 0, 0, 0.87);
329
}
330
331
spinbutton.error.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry.error:focus:not(.search),
332
notebook > stack:not(:only-child) spinbutton.error:focus:not(.vertical), messagedialog entry.error:focus, colorchooser .popover.osd spinbutton.error:focus:not(.vertical), layoutpane entry.error.search:focus, editortweak entry.error.search:focus, .raven .raven-background spinbutton.error:focus:not(.vertical), #login_window entry.error:focus,
333
entry.error.flat:focus {
334
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #DD2C00 100%, transparent 0%) 0 0 2/0 0 2px;
335
box-shadow: inset 0 -1px #DD2C00;
336
}
337
338
spinbutton.error.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry.error:disabled:not(.search),
339
notebook > stack:not(:only-child) spinbutton.error:disabled:not(.vertical), messagedialog entry.error:disabled, colorchooser .popover.osd spinbutton.error:disabled:not(.vertical), layoutpane entry.error.search:disabled, editortweak entry.error.search:disabled, .raven .raven-background spinbutton.error:disabled:not(.vertical), #login_window entry.error:disabled,
340
entry.error.flat:disabled {
341
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12);
342
background-color: transparent;
343
color: rgba(0, 0, 0, 0.38);
344
}
345
346
spinbutton.error:not(.vertical) image,
347
entry.error image {
348
color: rgba(255, 255, 255, 0.7);
349
}
350
351
spinbutton.error:not(.vertical) image:hover, spinbutton.error:not(.vertical) image:active,
352
entry.error image:hover,
353
entry.error image:active {
354
color: #FFFFFF;
355
}
356
357
spinbutton.error:not(.vertical) image:disabled,
358
entry.error image:disabled {
359
color: rgba(255, 255, 255, 0.5);
360
}
361
362
spinbutton.warning:not(.vertical),
363
entry.warning {
364
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
365
border-image: none;
366
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
367
background-color: #FF6D00;
368
color: #FFFFFF;
369
}
370
371
spinbutton.warning:focus:not(.vertical),
372
entry.warning:focus {
373
border-image: none;
374
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
375
}
376
377
spinbutton.warning:disabled:not(.vertical),
378
entry.warning:disabled {
379
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
380
background-color: #FAFAFA;
381
color: rgba(0, 0, 0, 0.38);
382
}
383
384
spinbutton.warning.flat:not(.vertical), notebook > stack:not(:only-child) entry.warning:not(.search),
385
notebook > stack:not(:only-child) spinbutton.warning:not(.vertical), messagedialog entry.warning, colorchooser .popover.osd spinbutton.warning:not(.vertical), layoutpane entry.warning.search, editortweak entry.warning.search, .raven .raven-background spinbutton.warning:not(.vertical), #login_window entry.warning,
386
entry.warning.flat {
387
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
388
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FF6D00 0%, transparent 0%) 0 0 0/0 0 0px;
389
box-shadow: inset 0 -1px #FF6D00;
390
background-color: transparent;
391
color: rgba(0, 0, 0, 0.87);
392
}
393
394
spinbutton.warning.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry.warning:focus:not(.search),
395
notebook > stack:not(:only-child) spinbutton.warning:focus:not(.vertical), messagedialog entry.warning:focus, colorchooser .popover.osd spinbutton.warning:focus:not(.vertical), layoutpane entry.warning.search:focus, editortweak entry.warning.search:focus, .raven .raven-background spinbutton.warning:focus:not(.vertical), #login_window entry.warning:focus,
396
entry.warning.flat:focus {
397
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FF6D00 100%, transparent 0%) 0 0 2/0 0 2px;
398
box-shadow: inset 0 -1px #FF6D00;
399
}
400
401
spinbutton.warning.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry.warning:disabled:not(.search),
402
notebook > stack:not(:only-child) spinbutton.warning:disabled:not(.vertical), messagedialog entry.warning:disabled, colorchooser .popover.osd spinbutton.warning:disabled:not(.vertical), layoutpane entry.warning.search:disabled, editortweak entry.warning.search:disabled, .raven .raven-background spinbutton.warning:disabled:not(.vertical), #login_window entry.warning:disabled,
403
entry.warning.flat:disabled {
404
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12);
405
background-color: transparent;
406
color: rgba(0, 0, 0, 0.38);
407
}
408
409
spinbutton.warning:not(.vertical) image,
410
entry.warning image {
411
color: rgba(255, 255, 255, 0.7);
412
}
413
414
spinbutton.warning:not(.vertical) image:hover, spinbutton.warning:not(.vertical) image:active,
415
entry.warning image:hover,
416
entry.warning image:active {
417
color: #FFFFFF;
418
}
419
420
spinbutton.warning:not(.vertical) image:disabled,
421
entry.warning image:disabled {
422
color: rgba(255, 255, 255, 0.5);
423
}
424
425
spinbutton:not(.vertical) progress,
426
entry progress {
427
margin: 2px -6px;
428
border-bottom: 2px solid #42A5F5;
429
background-color: transparent;
430
}
431
432
.linked:not(.vertical) > spinbutton.flat:not(.vertical), notebook > stack:not(:only-child) .linked:not(.vertical) > entry:not(.search),
433
notebook > stack:not(:only-child) .linked:not(.vertical) > spinbutton:not(.vertical), messagedialog .linked:not(.vertical) > entry, colorchooser .popover.osd .linked:not(.vertical) > spinbutton:not(.vertical), layoutpane .linked:not(.vertical) > entry.search, editortweak .linked:not(.vertical) > entry.search, .raven .raven-background .linked:not(.vertical) > spinbutton:not(.vertical), #login_window .linked:not(.vertical) > entry,
434
.linked.vertical > spinbutton.flat:not(.vertical), notebook > stack:not(:only-child)
435
.linked.vertical > entry:not(.search),
436
notebook > stack:not(:only-child)
437
.linked.vertical > spinbutton:not(.vertical), messagedialog
438
.linked.vertical > entry, colorchooser .popover.osd
439
.linked.vertical > spinbutton:not(.vertical), layoutpane
440
.linked.vertical > entry.search, editortweak
441
.linked.vertical > entry.search, .raven .raven-background
442
.linked.vertical > spinbutton:not(.vertical), #login_window
443
.linked.vertical > entry, .linked:not(.vertical) >
444
entry.flat,
445
.linked.vertical >
446
entry.flat {
447
border-radius: 0;
448
}
449
450
treeview entry.flat, treeview entry {
451
min-height: 0;
452
padding: 2px;
453
border-radius: 0;
454
background-color: #FFFFFF;
455
}
456
457
treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:focus {
458
border-image: none;
459
box-shadow: none;
460
}
461
462
.entry-tag, .documents-entry-tag, .photos-entry-tag {
463
margin: 4px;
464
border-radius: 9999px;
465
box-shadow: none;
466
background-color: #42A5F5;
467
color: #FFFFFF;
468
}
469
470
.entry-tag:hover, .documents-entry-tag:hover, .photos-entry-tag:hover {
471
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
472
}
473
474
:dir(ltr) .entry-tag, :dir(ltr) .documents-entry-tag, :dir(ltr) .photos-entry-tag {
475
margin-left: 8px;
476
margin-right: -4px;
477
padding-left: 8px;
478
padding-right: 4px;
479
}
480
481
:dir(rtl) .entry-tag, :dir(rtl) .documents-entry-tag, :dir(rtl) .photos-entry-tag {
482
margin-left: -4px;
483
margin-right: 8px;
484
padding-left: 4px;
485
padding-right: 8px;
486
}
487
488
.entry-tag.button, .button.documents-entry-tag, .button.photos-entry-tag {
489
box-shadow: none;
490
background-color: transparent;
491
}
492
493
.entry-tag.button:not(:hover):not(:active), .button.documents-entry-tag:not(:hover):not(:active), .button.photos-entry-tag:not(:hover):not(:active) {
494
color: rgba(255, 255, 255, 0.7);
495
}
496
497
/***********
498
* Buttons *
499
***********/
500
@keyframes needs_attention {
501
from {
502
background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent));
503
}
504
to {
505
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#FF4081), to(transparent));
506
}
507
}
508
509
510
button {
511
min-height: 24px;
512
min-width: 16px;
513
padding: 4px 8px;
514
border-radius: 2px;
515
font-weight: 500;
516
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1), background-size 0.5s cubic-bezier(0, 0, 0.2, 1), background-image 1s cubic-bezier(0, 0, 0.2, 1);
517
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 0 0 9999px transparent;
518
background-color: #FAFAFA;
519
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
520
background-repeat: no-repeat;
521
background-position: center;
522
background-size: 1000% 1000%;
523
color: rgba(0, 0, 0, 0.62);
524
}
525
526
527
button:hover {
528
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 0 0 9999px transparent;
529
color: rgba(0, 0, 0, 0.87);
530
}
531
532
533
button:active {
534
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
535
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
536
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 0 0 9999px alpha(currentColor, 0.15);
537
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
538
background-size: 0% 0%;
539
color: rgba(0, 0, 0, 0.87);
540
}
541
542
543
button:disabled {
544
box-shadow: none;
545
background-color: rgba(0, 0, 0, 0.12);
546
color: rgba(0, 0, 0, 0.26);
547
}
548
549
550
button:checked {
551
background-color: #42A5F5;
552
color: #FFFFFF;
553
}
554
555
556
button:checked:disabled {
557
background-color: rgba(66, 165, 245, 0.3);
558
color: rgba(66, 165, 245, 0.5);
559
}
560
561
modelbutton.flat,
562
.menuitem.button.flat, spinbutton:not(.vertical) button, spinbutton.vertical button, popover.background.menu button,
563
popover.background button.model, notebook > header > tabs > arrow, scrollbar button, check,
564
radio, calendar.button, messagedialog.csd .dialog-action-area button, button.sidebar-button, .gedit-search-slider button, PanelToplevel > grid > button, .raven .raven-header:not(.top) button, .drop-shadow button, .budgie-session-dialog .linked.horizontal > button, .lightdm-gtk-greeter button, :not(headerbar) .caja-pathbar button, .caja-pathbar :not(headerbar) button, :not(headerbar)
565
.path-bar button, layouttabbar button, .mate-panel-menu-bar #PanelApplet button, .budgie-panel #tasklist-button, .raven stackswitcher.linked > button, toolbar button, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
566
headerbar button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button,
567
button.flat {
568
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0.5s cubic-bezier(0, 0, 0.2, 1), background-image 1s cubic-bezier(0, 0, 0.2, 1);
569
box-shadow: inset 0 0 0 9999px transparent;
570
background-color: transparent;
571
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
572
background-repeat: no-repeat;
573
background-position: center;
574
background-size: 1000% 1000%;
575
color: rgba(0, 0, 0, 0.54);
576
}
577
578
modelbutton.flat:hover,
579
.menuitem.button.flat:hover, spinbutton:not(.vertical) button:hover, spinbutton.vertical button:hover, popover.background.menu button:hover,
580
popover.background button.model:hover, notebook > header > tabs > arrow:hover, scrollbar button:hover, check:hover,
581
radio:hover, calendar.button:hover, messagedialog.csd .dialog-action-area button:hover, button.sidebar-button:hover, .gedit-search-slider button:hover, PanelToplevel > grid > button:hover, .raven .raven-header:not(.top) button:hover, .drop-shadow button:hover, .budgie-session-dialog .linked.horizontal > button:hover, .lightdm-gtk-greeter button:hover, :not(headerbar) .caja-pathbar button:hover, .caja-pathbar :not(headerbar) button:hover, :not(headerbar)
582
.path-bar button:hover, layouttabbar button:hover, .mate-panel-menu-bar #PanelApplet button:hover, .budgie-panel #tasklist-button:hover, .raven stackswitcher.linked > button:hover, toolbar button:hover, .titlebar:not(headerbar) button:hover:not(.suggested-action):not(.destructive-action),
583
headerbar button:hover:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:hover:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:hover,
584
button.flat:hover {
585
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
586
color: rgba(0, 0, 0, 0.87);
587
}
588
589
modelbutton.flat:active,
590
.menuitem.button.flat:active, spinbutton:not(.vertical) button:active, spinbutton.vertical button:active, popover.background.menu button:active,
591
popover.background button.model:active, notebook > header > tabs > arrow:active, scrollbar button:active, check:active,
592
radio:active, calendar.button:active, messagedialog.csd .dialog-action-area button:active, button.sidebar-button:active, .gedit-search-slider button:active, PanelToplevel > grid > button:active, .raven .raven-header:not(.top) button:active, .drop-shadow button:active, .budgie-session-dialog .linked.horizontal > button:active, .lightdm-gtk-greeter button:active, :not(headerbar) .caja-pathbar button:active, .caja-pathbar :not(headerbar) button:active, :not(headerbar)
593
.path-bar button:active, layouttabbar button:active, .mate-panel-menu-bar #PanelApplet button:active, .budgie-panel #tasklist-button:active, .raven stackswitcher.linked > button:active, toolbar button:active, .titlebar:not(headerbar) button:active:not(.suggested-action):not(.destructive-action),
594
headerbar button:active:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:active,
595
button.flat:active {
596
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
597
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
598
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
599
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
600
background-size: 0% 0%;
601
color: rgba(0, 0, 0, 0.87);
602
}
603
604
modelbutton.flat:disabled,
605
.menuitem.button.flat:disabled, spinbutton:not(.vertical) button:disabled, spinbutton.vertical button:disabled, popover.background.menu button:disabled,
606
popover.background button.model:disabled, notebook > header > tabs > arrow:disabled, scrollbar button:disabled, check:disabled,
607
radio:disabled, calendar.button:disabled, messagedialog.csd .dialog-action-area button:disabled, button.sidebar-button:disabled, .gedit-search-slider button:disabled, PanelToplevel > grid > button:disabled, .raven .raven-header:not(.top) button:disabled, .drop-shadow button:disabled, .budgie-session-dialog .linked.horizontal > button:disabled, .lightdm-gtk-greeter button:disabled, :not(headerbar) .caja-pathbar button:disabled, .caja-pathbar :not(headerbar) button:disabled, :not(headerbar)
608
.path-bar button:disabled, layouttabbar button:disabled, .mate-panel-menu-bar #PanelApplet button:disabled, .budgie-panel #tasklist-button:disabled, .raven stackswitcher.linked > button:disabled, toolbar button:disabled, .titlebar:not(headerbar) button:disabled:not(.suggested-action):not(.destructive-action),
609
headerbar button:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:disabled:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:disabled,
610
button.flat:disabled {
611
box-shadow: none;
612
background-color: transparent;
613
color: rgba(0, 0, 0, 0.26);
614
}
615
616
:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar)
617
.path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar #PanelApplet button:checked, .budgie-panel #tasklist-button:checked, .raven stackswitcher.linked > button:checked, toolbar button:checked, .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action),
618
headerbar button:checked:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked,
619
button.flat:checked {
620
background-color: rgba(0, 0, 0, 0.26);
621
color: rgba(0, 0, 0, 0.87);
622
}
623
624
:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar)
625
.path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar #PanelApplet button:checked:disabled, .budgie-panel #tasklist-button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, toolbar button:checked:disabled, .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action),
626
headerbar button:checked:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked:disabled,
627
button.flat:checked:disabled {
628
background-color: rgba(0, 0, 0, 0.12);
629
color: rgba(0, 0, 0, 0.38);
630
}
631
632
633
button.text-button {
634
padding-left: 16px;
635
padding-right: 16px;
636
}
637
638
639
button.image-button {
640
min-width: 24px;
641
padding: 4px;
642
}
643
644
645
button.text-button.image-button {
646
border-radius: 2px;
647
-gtk-outline-radius: 2px;
648
}
649
650
651
button.text-button.image-button label:first-child {
652
margin-left: 12px;
653
}
654
655
656
button.text-button.image-button label:last-child {
657
margin-right: 12px;
658
}
659
660
661
button.text-button.image-button image:not(:only-child) {
662
margin: 0 4px;
663
}
664
665
toolbar .linked > button, .titlebar:not(headerbar) .linked > button:not(.suggested-action):not(.destructive-action),
666
headerbar .linked > button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked > button:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification .linked > button, toolbar
667
.linked.vertical > button, .titlebar:not(headerbar)
668
.linked.vertical > button:not(.suggested-action):not(.destructive-action),
669
headerbar
670
.linked.vertical > button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box
671
.linked.vertical > button:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification
672
.linked.vertical > button, .linked >
673
button.flat,
674
.linked.vertical >
675
button.flat {
676
border-radius: 2px;
677
}
678
679
toolbar .linked > button.text-button.image-button, .titlebar:not(headerbar) .linked > button.text-button.image-button:not(.suggested-action):not(.destructive-action),
680
headerbar .linked > button.text-button.image-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked > button.text-button.image-button:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification .linked > button.text-button.image-button, toolbar
681
.linked.vertical > button.text-button.image-button, .titlebar:not(headerbar)
682
.linked.vertical > button.text-button.image-button:not(.suggested-action):not(.destructive-action),
683
headerbar
684
.linked.vertical > button.text-button.image-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box
685
.linked.vertical > button.text-button.image-button:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification
686
.linked.vertical > button.text-button.image-button, .linked >
687
button.flat.text-button.image-button,
688
.linked.vertical >
689
button.flat.text-button.image-button {
690
border-radius: 2px;
691
-gtk-outline-radius: 2px;
692
}
693
694
infobar.info button:disabled, infobar.question button:disabled, infobar.warning button:disabled, infobar.error button:disabled, row:selected
695
button:disabled {
696
background-color: rgba(255, 255, 255, 0.12);
697
color: rgba(255, 255, 255, 0.3);
698
}
699
700
row:selected button.sidebar-button, infobar.info button.flat, infobar.question button.flat, infobar.warning button.flat, infobar.error button.flat, .budgie-panel button, .budgie-panel #tasklist-button, .raven stackswitcher.linked > button, .raven-mpris button.image-button, row:selected
701
button.flat {
702
color: rgba(255, 255, 255, 0.7);
703
}
704
705
row:selected button.sidebar-button:hover, infobar.info button.flat:hover, infobar.question button.flat:hover, infobar.warning button.flat:hover, infobar.error button.flat:hover, .budgie-panel button:hover, .budgie-panel #tasklist-button:hover, .raven stackswitcher.linked > button:hover, .raven-mpris button.image-button:hover, row:selected button.sidebar-button:active, infobar.info button.flat:active, infobar.question button.flat:active, infobar.warning button.flat:active, infobar.error button.flat:active, .budgie-panel button:active, .budgie-panel #tasklist-button:active, .raven stackswitcher.linked > button:active, .raven-mpris button.image-button:active, row:selected
706
button.flat:hover, row:selected
707
button.flat:active {
708
color: #FFFFFF;
709
}
710
711
row:selected button.sidebar-button:disabled, infobar.info button.flat:disabled, infobar.question button.flat:disabled, infobar.warning button.flat:disabled, infobar.error button.flat:disabled, .budgie-panel button:disabled, .budgie-panel #tasklist-button:disabled, .raven stackswitcher.linked > button:disabled, .raven-mpris button.image-button:disabled, row:selected
712
button.flat:disabled {
713
color: rgba(255, 255, 255, 0.3);
714
}
715
716
row:selected button.sidebar-button:checked, infobar.info button.flat:checked, infobar.question button.flat:checked, infobar.warning button.flat:checked, infobar.error button.flat:checked, .budgie-panel button:checked, .budgie-panel #tasklist-button:checked, .raven stackswitcher.linked > button:checked, .raven-mpris button.image-button:checked, row:selected
717
button.flat:checked {
718
background-color: rgba(255, 255, 255, 0.3);
719
color: #FFFFFF;
720
}
721
722
row:selected button.sidebar-button:checked:disabled, infobar.info button.flat:checked:disabled, infobar.question button.flat:checked:disabled, infobar.warning button.flat:checked:disabled, infobar.error button.flat:checked:disabled, .budgie-panel button:checked:disabled, .budgie-panel #tasklist-button:checked:disabled, .raven stackswitcher.linked > button:checked:disabled, .raven-mpris button.image-button:checked:disabled, row:selected
723
button.flat:checked:disabled {
724
background-color: rgba(255, 255, 255, 0.12);
725
color: rgba(255, 255, 255, 0.5);
726
}
727
728
729
button.osd {
730
padding: 10px 14px;
731
}
732
733
734
button.osd.image-button {
735
padding: 10px;
736
}
737
738
739
button.osd:disabled {
740
opacity: 0;
741
}
742
743
744
button.suggested-action {
745
background-color: #FF4081;
746
color: #FFFFFF;
747
}
748
749
750
button.suggested-action:disabled {
751
box-shadow: none;
752
background-color: rgba(0, 0, 0, 0.12);
753
color: rgba(0, 0, 0, 0.38);
754
}
755
756
757
button.suggested-action:checked {
758
background-color: #ff79a7;
759
}
760
761
762
button.suggested-action.flat {
763
background-color: transparent;
764
color: #FF4081;
765
}
766
767
768
button.suggested-action.flat:disabled {
769
box-shadow: none;
770
background-color: transparent;
771
color: rgba(0, 0, 0, 0.38);
772
}
773
774
775
button.suggested-action.flat:checked {
776
background-color: rgba(255, 64, 129, 0.3);
777
}
778
779
780
button.destructive-action {
781
background-color: #FF5252;
782
color: #FFFFFF;
783
}
784
785
786
button.destructive-action:disabled {
787
box-shadow: none;
788
background-color: rgba(0, 0, 0, 0.12);
789
color: rgba(0, 0, 0, 0.38);
790
}
791
792
793
button.destructive-action:checked {
794
background-color: #ff8686;
795
}
796
797
798
button.destructive-action.flat {
799
background-color: transparent;
800
color: #FF5252;
801
}
802
803
804
button.destructive-action.flat:disabled {
805
box-shadow: none;
806
background-color: transparent;
807
color: rgba(0, 0, 0, 0.38);
808
}
809
810
811
button.destructive-action.flat:checked {
812
background-color: rgba(255, 82, 82, 0.3);
813
}
814
815
.stack-switcher >
816
button {
817
outline-offset: -4px;
818
}
819
820
.stack-switcher >
821
button > label {
822
padding-left: 6px;
823
padding-right: 6px;
824
}
825
826
.stack-switcher >
827
button > image {
828
padding-left: 6px;
829
padding-right: 6px;
830
padding-top: 3px;
831
padding-bottom: 3px;
832
}
833
834
.stack-switcher >
835
button.text-button {
836
padding-left: 10px;
837
padding-right: 10px;
838
}
839
840
.stack-switcher >
841
button.image-button {
842
padding-left: 2px;
843
padding-right: 2px;
844
}
845
846
.stack-switcher >
847
button.needs-attention:checked > label,
848
.stack-switcher >
849
button.needs-attention:checked > image {
850
animation: none;
851
background-image: none;
852
}
853
854
.primary-toolbar
855
button {
856
-gtk-icon-shadow: none;
857
}
858
859
860
button.image-button, toolbar .linked > button.image-button, .titlebar:not(headerbar) .linked > button.image-button:not(.suggested-action):not(.destructive-action),
861
headerbar .linked > button.image-button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked > button.image-button:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification .linked > button.image-button, toolbar
862
.linked.vertical > button.image-button,
863
headerbar
864
.linked.vertical > button.image-button:not(.suggested-action):not(.destructive-action), .app-notification
865
.linked.vertical > button.image-button, .linked > button.flat.image-button,
866
.linked.vertical > button.flat.image-button, .inline-toolbar button:not(.text-button), check,
867
radio, button.titlebutton, .nautilus-window headerbar > revealer > button, .raven .raven-header:not(.top) button.image-button, .raven .expander-button,
868
button.close,
869
button.circular {
870
border-radius: 9999px;
871
-gtk-outline-radius: 9999px;
872
}
873
874
spinbutton:not(.vertical) button, notebook > header tab button.flat, button.sidebar-button, .nautilus-window .floating-bar button, .gedit-document-panel row button.flat, .gedit-search-slider button:dir(ltr), .gedit-search-slider button:dir(rtl), .pluma-window paned.horizontal box.vertical box.horizontal button.flat {
875
min-height: 20px;
876
min-width: 20px;
877
padding: 0;
878
border-radius: 9999px;
879
-gtk-outline-radius: 9999px;
880
}
881
882
.stack-switcher >
883
button.needs-attention > label,
884
.stack-switcher >
885
button.needs-attention > image, stacksidebar row.needs-attention > label {
886
animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
887
background-repeat: no-repeat;
888
background-position: right 3px;
889
background-size: 6px 6px;
890
}
891
892
.stack-switcher >
893
button.needs-attention > label:dir(rtl),
894
.stack-switcher >
895
button.needs-attention > image:dir(rtl), stacksidebar row.needs-attention > label:dir(rtl) {
896
background-position: left 3px;
897
}
898
899
.linked:not(.vertical) > spinbutton:not(.vertical), .linked:not(.vertical) > entry, .linked > button, .linked:not(.vertical) > combobox > box > button.combo {
900
border-radius: 0;
901
-gtk-outline-radius: 2px;
902
}
903
904
.linked:not(.vertical) > spinbutton:first-child:not(.vertical), .linked:not(.vertical) > entry:first-child, .linked > button:first-child, combobox.linked button:nth-child(2):dir(rtl), .linked:not(.vertical) > combobox:first-child > box > button.combo {
905
border-top-left-radius: 2px;
906
border-bottom-left-radius: 2px;
907
}
908
909
.linked:not(.vertical) > spinbutton:last-child:not(.vertical), .linked:not(.vertical) > entry:last-child, .linked > button:last-child, combobox.linked button:nth-child(2):dir(ltr), .linked:not(.vertical) > combobox:last-child > box > button.combo {
910
border-top-right-radius: 2px;
911
border-bottom-right-radius: 2px;
912
}
913
914
.linked:not(.vertical) > spinbutton:only-child:not(.vertical), .linked:not(.vertical) > entry:only-child, .linked > button:only-child, .linked:not(.vertical) > combobox:only-child > box > button.combo {
915
border-radius: 2px;
916
}
917
918
.linked.vertical > spinbutton:not(.vertical), .linked.vertical > entry, .linked.vertical > button, .linked.vertical > combobox > box > button.combo {
919
border-radius: 0;
920
-gtk-outline-radius: 2px;
921
}
922
923
.linked.vertical > spinbutton:first-child:not(.vertical), .linked.vertical > entry:first-child, .linked.vertical > button:first-child, .linked.vertical > combobox:first-child > box > button.combo {
924
border-top-left-radius: 2px;
925
border-top-right-radius: 2px;
926
}
927
928
.linked.vertical > spinbutton:last-child:not(.vertical), .linked.vertical > entry:last-child, .linked.vertical > button:last-child, .linked.vertical > combobox:last-child > box > button.combo {
929
border-bottom-left-radius: 2px;
930
border-bottom-right-radius: 2px;
931
}
932
933
.linked.vertical > spinbutton:only-child:not(.vertical), .linked.vertical > entry:only-child, .linked.vertical > button:only-child, .linked.vertical > combobox:only-child > box > button.combo {
934
border-radius: 2px;
935
}
936
937
/* menu buttons */
938
modelbutton.flat,
939
.menuitem.button.flat {
940
min-height: 28px;
941
padding: 0 8px;
942
border-radius: 2px;
943
color: inherit;
944
}
945
946
modelbutton.flat arrow {
947
background: none;
948
}
949
950
modelbutton.flat arrow:hover {
951
background: none;
952
}
953
954
modelbutton.flat arrow.left {
955
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
956
}
957
958
modelbutton.flat arrow.right {
959
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
960
}
961
962
button.color {
963
min-height: 20px;
964
min-width: 20px;
965
padding: 6px;
966
}
967
968
/*********
969
* Links *
970
*********/
971
*:link, button:link,
972
button:visited, *:link:hover, button:hover:link,
973
button:hover:visited, *:link:active, button:active:link,
974
button:active:visited {
975
color: #42A5F5;
976
}
977
978
*:link:visited,
979
button:visited, *:link:visited:hover,
980
button:visited:hover, *:link:visited:active,
981
button:visited:active {
982
color: #E040FB;
983
}
984
985
infobar.info *:link, infobar.info button:link, infobar.info
986
button:visited, infobar.question *:link, infobar.question button:link, infobar.question
987
button:visited, infobar.warning *:link, infobar.warning button:link, infobar.warning
988
button:visited, infobar.error *:link, infobar.error button:link, infobar.error
989
button:visited, *:link:selected, button:selected:link,
990
button:selected:visited, .selection-mode.titlebar:not(headerbar) .subtitle:link,
991
headerbar.selection-mode .subtitle:link,
992
*:selected *:link,
993
*:selected button:link,
994
*:selected
995
button:visited {
996
color: #FFFFFF;
997
}
998
999
button:link > label,
1000
button:visited > label {
1001
text-decoration-line: underline;
1002
}
1003
1004
/*****************
1005
* GtkSpinButton *
1006
*****************/
1007
spinbutton:not(.vertical) {
1008
padding: 0;
1009
}
1010
1011
notebook > stack:not(:only-child) spinbutton:not(.vertical) entry, notebook > stack:not(:only-child) spinbutton:not(.vertical) entry:focus, notebook > stack:not(:only-child) spinbutton:not(.vertical) entry:disabled,
1012
spinbutton:not(.vertical) entry {
1013
min-width: 28px;
1014
margin: 0;
1015
border-image: none;
1016
border-radius: 0;
1017
box-shadow: none;
1018
background-color: transparent;
1019
}
1020
1021
spinbutton:not(.vertical) button {
1022
border: solid 6px transparent;
1023
}
1024
1025
spinbutton:not(.vertical) button.up:dir(ltr), spinbutton:not(.vertical) button.down:dir(rtl) {
1026
margin-left: -3px;
1027
}
1028
1029
spinbutton:not(.vertical) button.up:dir(rtl), spinbutton:not(.vertical) button.down:dir(ltr) {
1030
margin-right: -3px;
1031
}
1032
1033
spinbutton.vertical:disabled {
1034
color: rgba(0, 0, 0, 0.38);
1035
}
1036
1037
spinbutton.vertical:drop(active) {
1038
box-shadow: none;
1039
}
1040
1041
spinbutton.vertical entry {
1042
min-height: 32px;
1043
min-width: 44px;
1044
padding: 0;
1045
}
1046
1047
spinbutton.vertical button {
1048
min-height: 32px;
1049
min-width: 44px;
1050
padding: 0;
1051
}
1052
1053
spinbutton.vertical button.up {
1054
border-radius: 2px 2px 0 0;
1055
}
1056
1057
spinbutton.vertical button.down {
1058
border-radius: 0 0 2px 2px;
1059
}
1060
1061
treeview spinbutton:not(.vertical) {
1062
min-height: 0;
1063
border-style: none;
1064
border-radius: 0;
1065
}
1066
1067
treeview spinbutton:not(.vertical) entry {
1068
min-height: 0;
1069
padding: 1px 2px;
1070
}
1071
1072
/**************
1073
* ComboBoxes *
1074
**************/
1075
combobox arrow {
1076
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1077
min-height: 16px;
1078
min-width: 16px;
1079
}
1080
1081
combobox decoration,
1082
combobox button.combo:checked {
1083
transition: none;
1084
}
1085
1086
combobox button.combo cellview:dir(ltr) {
1087
margin-left: 0px;
1088
}
1089
1090
combobox button.combo cellview:dir(rtl) {
1091
margin-right: 0px;
1092
}
1093
1094
combobox #gtk-combobox-popup-menu {
1095
padding: 2px 0;
1096
}
1097
1098
combobox #gtk-combobox-popup-menu menuitem {
1099
min-height: 28px;
1100
padding: 0 8px;
1101
}
1102
1103
combobox #gtk-combobox-popup-menu > arrow.top {
1104
margin-top: -2px;
1105
}
1106
1107
combobox #gtk-combobox-popup-menu > arrow.bottom {
1108
margin-bottom: -6px;
1109
}
1110
1111
combobox:drop(active) {
1112
box-shadow: none;
1113
}
1114
1115
notebook > stack:not(:only-child) button.combo, .raven .raven-background button.combo, #login_window #user_combobox button {
1116
border-radius: 0;
1117
background-image: none;
1118
font-weight: inherit;
1119
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1120
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1121
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.26);
1122
background-color: transparent;
1123
color: rgba(0, 0, 0, 0.87);
1124
}
1125
1126
notebook > stack:not(:only-child) button.combo:hover, .raven .raven-background button.combo:hover, #login_window #user_combobox button:hover {
1127
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.38);
1128
}
1129
1130
notebook > stack:not(:only-child) button.combo:checked, .raven .raven-background button.combo:checked, #login_window #user_combobox button:checked {
1131
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1132
}
1133
1134
notebook > stack:not(:only-child) button.combo:disabled, .raven .raven-background button.combo:disabled, #login_window #user_combobox button:disabled {
1135
color: rgba(0, 0, 0, 0.38);
1136
}
1137
1138
/************
1139
* Toolbars *
1140
************/
1141
toolbar {
1142
-GtkWidget-window-dragging: true;
1143
padding: 3px;
1144
background-color: #F5F5F5;
1145
}
1146
1147
.osd toolbar {
1148
background-color: transparent;
1149
}
1150
1151
toolbar.osd, .app-notification, frame.documents-dropdown {
1152
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1153
padding: 6px;
1154
border-radius: 2px;
1155
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4);
1156
background-color: #FFFFFF;
1157
}
1158
1159
toolbar.osd:backdrop, .app-notification:backdrop, frame.documents-dropdown:backdrop {
1160
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.4);
1161
}
1162
1163
toolbar.osd.left, .left.app-notification, frame.left.documents-dropdown, toolbar.osd.right, .right.app-notification, frame.right.documents-dropdown, toolbar.osd.top, .top.app-notification, frame.top.documents-dropdown, toolbar.osd.bottom, .bottom.app-notification, frame.bottom.documents-dropdown {
1164
border-radius: 0;
1165
}
1166
1167
toolbar.horizontal separator {
1168
margin: 3px;
1169
}
1170
1171
toolbar.vertical separator {
1172
margin: 3px;
1173
}
1174
1175
toolbar:not(.inline-toolbar):not(.osd) scale,
1176
toolbar:not(.inline-toolbar):not(.osd) entry,
1177
toolbar:not(.inline-toolbar):not(.osd) spinbutton,
1178
toolbar:not(.inline-toolbar):not(.osd) button {
1179
margin: 3px;
1180
}
1181
1182
toolbar:not(.inline-toolbar):not(.osd) .linked entry:not(:first-child),
1183
toolbar:not(.inline-toolbar):not(.osd) .linked spinbutton:not(:first-child),
1184
toolbar:not(.inline-toolbar):not(.osd) .linked button:not(:first-child) {
1185
margin-left: 0;
1186
}
1187
1188
toolbar:not(.inline-toolbar):not(.osd) .linked entry:not(:last-child),
1189
toolbar:not(.inline-toolbar):not(.osd) .linked spinbutton:not(:last-child),
1190
toolbar:not(.inline-toolbar):not(.osd) .linked button:not(:last-child) {
1191
margin-right: 0;
1192
}
1193
1194
toolbar:not(.inline-toolbar):not(.osd) switch {
1195
margin: 9px 3px;
1196
}
1197
1198
.inline-toolbar {
1199
padding: 6px;
1200
border-style: solid;
1201
border-width: 0 1px 1px;
1202
border-color: rgba(0, 0, 0, 0.1);
1203
background-color: #FAFAFA;
1204
}
1205
1206
searchbar,
1207
.location-bar {
1208
padding: 6px;
1209
border-style: solid;
1210
border-width: 0 0 1px;
1211
border-color: rgba(0, 0, 0, 0.1);
1212
background-color: #F5F5F5;
1213
background-clip: border-box;
1214
}
1215
1216
/***************
1217
* Header bars *
1218
***************/
1219
.titlebar:not(headerbar),
1220
headerbar {
1221
transition: background-color 0.2s cubic-bezier(0, 0, 0.2, 1);
1222
min-height: 44px;
1223
padding: 0 6px;
1224
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.15);
1225
background-color: #455A64;
1226
color: #FFFFFF;
1227
}
1228
1229
.titlebar:disabled:not(headerbar) :not(button) > label,
1230
headerbar:disabled :not(button) > label {
1231
color: rgba(255, 255, 255, 0.5);
1232
}
1233
1234
.titlebar:backdrop:not(headerbar),
1235
headerbar:backdrop {
1236
color: rgba(255, 255, 255, 0.7);
1237
}
1238
1239
.titlebar:backdrop:disabled:not(headerbar) :not(button) > label,
1240
headerbar:backdrop:disabled :not(button) > label {
1241
color: rgba(255, 255, 255, 0.3);
1242
}
1243
1244
.titlebar:not(headerbar) .title,
1245
headerbar .title {
1246
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1247
padding: 0 12px;
1248
font-weight: bold;
1249
}
1250
1251
.titlebar:not(headerbar) .subtitle,
1252
headerbar .subtitle {
1253
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1254
padding: 0 12px;
1255
font-size: smaller;
1256
}
1257
1258
.titlebar:not(headerbar) .linked:not(.vertical) > entry:not(.flat),
1259
headerbar .linked:not(.vertical) > entry:not(.flat) {
1260
border-radius: 2px;
1261
}
1262
1263
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
1264
headerbar button:not(.suggested-action):not(.destructive-action) {
1265
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px;
1266
color: rgba(255, 255, 255, 0.7);
1267
}
1268
1269
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):hover, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):active,
1270
headerbar button:not(.suggested-action):not(.destructive-action):hover,
1271
headerbar button:not(.suggested-action):not(.destructive-action):active {
1272
color: #FFFFFF;
1273
}
1274
1275
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled,
1276
headerbar button:not(.suggested-action):not(.destructive-action):disabled {
1277
color: rgba(255, 255, 255, 0.3);
1278
}
1279
1280
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1281
headerbar button:not(.suggested-action):not(.destructive-action):checked {
1282
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
1283
color: #FFFFFF;
1284
}
1285
1286
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1287
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled {
1288
color: rgba(255, 255, 255, 0.5);
1289
}
1290
1291
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1292
headerbar button:not(.suggested-action):not(.destructive-action):checked,
1293
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled {
1294
background-color: transparent;
1295
}
1296
1297
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop,
1298
headerbar button:not(.suggested-action):not(.destructive-action):backdrop {
1299
color: rgba(255, 255, 255, 0.5);
1300
}
1301
1302
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:hover, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:active,
1303
headerbar button:not(.suggested-action):not(.destructive-action):backdrop:hover,
1304
headerbar button:not(.suggested-action):not(.destructive-action):backdrop:active {
1305
color: rgba(255, 255, 255, 0.7);
1306
}
1307
1308
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:disabled,
1309
headerbar button:not(.suggested-action):not(.destructive-action):backdrop:disabled {
1310
color: rgba(255, 255, 255, 0.3);
1311
}
1312
1313
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked,
1314
headerbar button:not(.suggested-action):not(.destructive-action):backdrop:checked {
1315
color: rgba(255, 255, 255, 0.7);
1316
}
1317
1318
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled,
1319
headerbar button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled {
1320
color: rgba(255, 255, 255, 0.3);
1321
}
1322
1323
.titlebar:not(headerbar) button.suggested-action:disabled, .titlebar:not(headerbar) button.destructive-action:disabled,
1324
headerbar button.suggested-action:disabled,
1325
headerbar button.destructive-action:disabled {
1326
background-color: rgba(255, 255, 255, 0.12);
1327
color: rgba(255, 255, 255, 0.5);
1328
}
1329
1330
.selection-mode.titlebar:not(headerbar),
1331
headerbar.selection-mode {
1332
transition: background-color 0.00001s 0.3s;
1333
animation: header_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1);
1334
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2);
1335
background-color: #42A5F5;
1336
color: #FFFFFF;
1337
}
1338
1339
.selection-mode.titlebar:backdrop:not(headerbar),
1340
headerbar.selection-mode:backdrop {
1341
color: rgba(255, 255, 255, 0.7);
1342
}
1343
1344
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
1345
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action) {
1346
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px;
1347
color: #FFFFFF;
1348
}
1349
1350
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled,
1351
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled {
1352
color: rgba(255, 255, 255, 0.5);
1353
}
1354
1355
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1356
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked {
1357
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
1358
color: #FFFFFF;
1359
}
1360
1361
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1362
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled {
1363
color: rgba(255, 255, 255, 0.5);
1364
}
1365
1366
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop,
1367
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):backdrop {
1368
color: rgba(255, 255, 255, 0.7);
1369
}
1370
1371
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:disabled,
1372
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):backdrop:disabled {
1373
color: rgba(255, 255, 255, 0.3);
1374
}
1375
1376
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked,
1377
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):backdrop:checked {
1378
color: rgba(255, 255, 255, 0.7);
1379
}
1380
1381
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled,
1382
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled {
1383
color: rgba(255, 255, 255, 0.3);
1384
}
1385
1386
.selection-mode.titlebar:not(headerbar) .selection-menu,
1387
headerbar.selection-mode .selection-menu {
1388
padding-left: 16px;
1389
padding-right: 16px;
1390
}
1391
1392
.selection-mode.titlebar:not(headerbar) .selection-menu GtkArrow,
1393
headerbar.selection-mode .selection-menu GtkArrow {
1394
-GtkArrow-arrow-scaling: 1;
1395
}
1396
1397
.selection-mode.titlebar:not(headerbar) .selection-menu .arrow,
1398
headerbar.selection-mode .selection-menu .arrow {
1399
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1400
}
1401
1402
.fullscreen .titlebar:not(headerbar),
1403
.tiled .titlebar:not(headerbar),
1404
.maximized .titlebar:not(headerbar), .fullscreen
1405
headerbar,
1406
.tiled
1407
headerbar,
1408
.maximized
1409
headerbar {
1410
border-radius: 0;
1411
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1412
}
1413
1414
.default-decoration.titlebar:not(headerbar),
1415
headerbar.default-decoration {
1416
min-height: 20px;
1417
padding: 6px;
1418
box-shadow: inset 0 1px rgba(255, 255, 255, 0.15);
1419
}
1420
1421
.fullscreen .default-decoration.titlebar:not(headerbar),
1422
.tiled .default-decoration.titlebar:not(headerbar),
1423
.maximized .default-decoration.titlebar:not(headerbar), .fullscreen
1424
headerbar.default-decoration,
1425
.tiled
1426
headerbar.default-decoration,
1427
.maximized
1428
headerbar.default-decoration {
1429
box-shadow: none;
1430
}
1431
1432
.default-decoration.titlebar:not(headerbar) button.titlebutton,
1433
headerbar.default-decoration button.titlebutton {
1434
min-height: 20px;
1435
min-width: 20px;
1436
margin: 0;
1437
padding: 0;
1438
}
1439
1440
.background:not(.csd) .default-decoration.titlebar:not(headerbar) button.titlebutton:active, .background:not(.csd)
1441
headerbar.default-decoration button.titlebutton:active {
1442
background-size: 1000% 1000%;
1443
}
1444
1445
headerbar entry,
1446
headerbar spinbutton,
1447
headerbar button {
1448
margin-top: 6px;
1449
margin-bottom: 6px;
1450
}
1451
1452
headerbar switch {
1453
margin-top: 12px;
1454
margin-bottom: 12px;
1455
}
1456
1457
headerbar spinbutton button {
1458
margin-top: 0;
1459
margin-bottom: 0;
1460
}
1461
1462
.background:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) .titlebar {
1463
border-top-left-radius: 2px;
1464
border-top-right-radius: 2px;
1465
}
1466
1467
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) separator:first-child + headerbar,
1468
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) headerbar:first-child {
1469
border-top-left-radius: 2px;
1470
}
1471
1472
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) headerbar:last-child {
1473
border-top-right-radius: 2px;
1474
}
1475
1476
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) stack headerbar:first-child, window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) stack headerbar:last-child {
1477
border-top-left-radius: 2px;
1478
border-top-right-radius: 2px;
1479
}
1480
1481
window.csd > .titlebar:not(headerbar) {
1482
padding: 0;
1483
background-color: transparent;
1484
background-image: none;
1485
border-style: none;
1486
box-shadow: none;
1487
}
1488
1489
.titlebar:not(headerbar) > separator {
1490
background-color: #455A64;
1491
background-image: image(rgba(0, 0, 0, 0.1));
1492
}
1493
1494
/************
1495
* Pathbars *
1496
************/
1497
.caja-pathbar button,
1498
.path-bar button {
1499
padding-left: 4px;
1500
padding-right: 4px;
1501
}
1502
1503
.caja-pathbar button label:not(:only-child):first-child,
1504
.path-bar button label:not(:only-child):first-child {
1505
margin-left: 4px;
1506
}
1507
1508
.caja-pathbar button label:not(:only-child):last-child,
1509
.path-bar button label:not(:only-child):last-child {
1510
margin-right: 4px;
1511
}
1512
1513
.caja-pathbar button.slider-button,
1514
.path-bar button.slider-button {
1515
padding-left: 4px;
1516
padding-right: 4px;
1517
}
1518
1519
:not(headerbar) .caja-pathbar button, .caja-pathbar :not(headerbar) button, :not(headerbar)
1520
.path-bar button {
1521
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1522
border-radius: 2px;
1523
}
1524
1525
:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar)
1526
.path-bar button:checked {
1527
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1528
}
1529
1530
:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar)
1531
.path-bar button:checked, :not(headerbar)
1532
.path-bar button:checked:disabled {
1533
background-color: transparent;
1534
}
1535
1536
/**************
1537
* Tree Views *
1538
**************/
1539
treeview.view {
1540
border-left-color: rgba(0, 0, 0, 0.26);
1541
border-top-color: rgba(0, 0, 0, 0.1);
1542
}
1543
1544
* {
1545
-GtkTreeView-horizontal-separator: 4;
1546
-GtkTreeView-grid-line-width: 1;
1547
-GtkTreeView-grid-line-pattern: '';
1548
-GtkTreeView-tree-line-width: 1;
1549
-GtkTreeView-tree-line-pattern: '';
1550
-GtkTreeView-expander-size: 16;
1551
}
1552
1553
treeview.view:selected {
1554
border-left-color: rgba(255, 255, 255, 0.3);
1555
}
1556
1557
treeview.view:hover, treeview.view:active, treeview.view:selected {
1558
border-radius: 0;
1559
}
1560
1561
treeview.view.separator {
1562
min-height: 5px;
1563
color: rgba(0, 0, 0, 0.1);
1564
}
1565
1566
treeview.view:drop(active) {
1567
border-style: solid none;
1568
border-width: 1px;
1569
border-color: #FF4081;
1570
}
1571
1572
treeview.view:drop(active).after {
1573
border-top-style: none;
1574
}
1575
1576
treeview.view:drop(active).before {
1577
border-bottom-style: none;
1578
}
1579
1580
treeview.view.expander {
1581
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1582
-gtk-icon-transform: rotate(-90deg);
1583
color: rgba(0, 0, 0, 0.54);
1584
}
1585
1586
treeview.view.expander:dir(rtl) {
1587
-gtk-icon-transform: rotate(90deg);
1588
}
1589
1590
treeview.view.expander:checked {
1591
-gtk-icon-transform: unset;
1592
}
1593
1594
treeview.view.expander:hover, treeview.view.expander:active {
1595
color: rgba(0, 0, 0, 0.87);
1596
}
1597
1598
treeview.view.expander:disabled {
1599
color: rgba(0, 0, 0, 0.26);
1600
}
1601
1602
treeview.view.expander:selected {
1603
color: rgba(255, 255, 255, 0.7);
1604
}
1605
1606
treeview.view.expander:selected:hover, treeview.view.expander:selected:active {
1607
color: #FFFFFF;
1608
}
1609
1610
treeview.view.expander:selected:disabled {
1611
color: rgba(255, 255, 255, 0.3);
1612
}
1613
1614
treeview.view.progressbar {
1615
border-bottom: 4px solid #42A5F5;
1616
box-shadow: none;
1617
background-color: transparent;
1618
}
1619
1620
treeview.view.progressbar:selected {
1621
border-bottom-color: #FFFFFF;
1622
}
1623
1624
treeview.view.trough {
1625
border-bottom: 4px solid rgba(66, 165, 245, 0.3);
1626
box-shadow: none;
1627
background-color: transparent;
1628
}
1629
1630
treeview.view.trough:selected {
1631
border-bottom-color: rgba(255, 255, 255, 0.3);
1632
}
1633
1634
treeview.view header button {
1635
padding: 2px 6px;
1636
border-style: none solid solid none;
1637
border-width: 1px;
1638
border-color: rgba(0, 0, 0, 0.1);
1639
border-radius: 0;
1640
background-clip: border-box;
1641
}
1642
1643
treeview.view header button, treeview.view header button:hover, treeview.view header button:active {
1644
box-shadow: none;
1645
}
1646
1647
treeview.view header button, treeview.view header button:disabled {
1648
background-color: #FFFFFF;
1649
}
1650
1651
treeview.view header button:last-child {
1652
border-right-style: none;
1653
}
1654
1655
treeview.view button.dnd,
1656
treeview.view header.button.dnd {
1657
padding: 2px 6px;
1658
border-style: none solid solid;
1659
border-width: 1px;
1660
border-color: rgba(0, 0, 0, 0.1);
1661
border-radius: 0;
1662
box-shadow: none;
1663
background-color: #FFFFFF;
1664
background-clip: border-box;
1665
color: #42A5F5;
1666
}
1667
1668
treeview.view acceleditor > label {
1669
background-color: #42A5F5;
1670
}
1671
1672
/*********
1673
* Menus *
1674
*********/
1675
menubar,
1676
.menubar {
1677
-GtkWidget-window-dragging: true;
1678
padding: 0;
1679
background-color: #455A64;
1680
}
1681
1682
menubar > menuitem,
1683
.menubar > menuitem {
1684
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
1685
min-height: 20px;
1686
padding: 4px 8px;
1687
color: rgba(255, 255, 255, 0.7);
1688
}
1689
1690
menubar > menuitem:hover,
1691
.menubar > menuitem:hover {
1692
transition: none;
1693
background-color: rgba(255, 255, 255, 0.12);
1694
color: #FFFFFF;
1695
}
1696
1697
menubar > menuitem:disabled,
1698
.menubar > menuitem:disabled {
1699
color: rgba(255, 255, 255, 0.3);
1700
}
1701
1702
.csd.popup {
1703
background-color: transparent;
1704
}
1705
1706
menu,
1707
.menu,
1708
.context-menu {
1709
margin: 4px 0;
1710
padding: 4px 0;
1711
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
1712
background-color: #FFFFFF;
1713
border: 1px solid rgba(0, 0, 0, 0.1);
1714
}
1715
1716
.csd menu, .csd
1717
.menu, .csd
1718
.context-menu {
1719
border: none;
1720
border-radius: 2px;
1721
}
1722
1723
menu menuitem,
1724
.menu menuitem,
1725
.context-menu menuitem {
1726
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
1727
min-height: 20px;
1728
min-width: 40px;
1729
padding: 4px 8px;
1730
font: initial;
1731
text-shadow: none;
1732
}
1733
1734
menu menuitem:hover,
1735
.menu menuitem:hover,
1736
.context-menu menuitem:hover {
1737
transition: none;
1738
background-color: rgba(0, 0, 0, 0.12);
1739
}
1740
1741
menu menuitem:disabled,
1742
.menu menuitem:disabled,
1743
.context-menu menuitem:disabled {
1744
color: rgba(0, 0, 0, 0.38);
1745
}
1746
1747
menu menuitem arrow,
1748
.menu menuitem arrow,
1749
.context-menu menuitem arrow {
1750
min-height: 16px;
1751
min-width: 16px;
1752
}
1753
1754
menu menuitem arrow:dir(ltr),
1755
.menu menuitem arrow:dir(ltr),
1756
.context-menu menuitem arrow:dir(ltr) {
1757
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1758
margin-left: 8px;
1759
}
1760
1761
menu menuitem arrow:dir(rtl),
1762
.menu menuitem arrow:dir(rtl),
1763
.context-menu menuitem arrow:dir(rtl) {
1764
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl");
1765
margin-right: 8px;
1766
}
1767
1768
menu menuitem label:dir(rtl), menu menuitem label:dir(ltr),
1769
.menu menuitem label:dir(rtl),
1770
.menu menuitem label:dir(ltr),
1771
.context-menu menuitem label:dir(rtl),
1772
.context-menu menuitem label:dir(ltr) {
1773
color: inherit;
1774
}
1775
1776
menu > arrow,
1777
.menu > arrow,
1778
.context-menu > arrow {
1779
min-height: 16px;
1780
min-width: 16px;
1781
padding: 4px;
1782
background-color: #FFFFFF;
1783
color: rgba(0, 0, 0, 0.54);
1784
}
1785
1786
menu > arrow.top,
1787
.menu > arrow.top,
1788
.context-menu > arrow.top {
1789
margin-top: -4px;
1790
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
1791
border-radius: 2px 2px 0 0;
1792
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
1793
}
1794
1795
menu > arrow.bottom,
1796
.menu > arrow.bottom,
1797
.context-menu > arrow.bottom {
1798
margin-bottom: -12px;
1799
border-top: 1px solid rgba(0, 0, 0, 0.1);
1800
border-radius: 0 0 2px 2px;
1801
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1802
}
1803
1804
menu > arrow:hover,
1805
.menu > arrow:hover,
1806
.context-menu > arrow:hover {
1807
background-image: image(rgba(0, 0, 0, 0.12));
1808
color: rgba(0, 0, 0, 0.87);
1809
}
1810
1811
menu > arrow:disabled,
1812
.menu > arrow:disabled,
1813
.context-menu > arrow:disabled {
1814
border-color: transparent;
1815
background-color: transparent;
1816
color: transparent;
1817
}
1818
1819
menu separator,
1820
.menu separator,
1821
.context-menu separator {
1822
margin: 4px 0;
1823
}
1824
1825
menuitem accelerator {
1826
color: rgba(0, 0, 0, 0.54);
1827
}
1828
1829
.popup:not(.csd) menu menuitem {
1830
color: #212121;
1831
}
1832
1833
.popup:not(.csd) menu menuitem:hover {
1834
background-color: #E0E0E0;
1835
}
1836
1837
.popup:not(.csd) menu menuitem:disabled {
1838
color: #9E9E9E;
1839
}
1840
1841
.popup:not(.csd) menu accelerator {
1842
color: #757575;
1843
}
1844
1845
/************
1846
* Popovers *
1847
************/
1848
popover.background {
1849
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1850
padding: 2px;
1851
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
1852
background-color: #FAFAFA;
1853
}
1854
1855
popover.background:backdrop {
1856
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1857
}
1858
1859
popover.background, .csd popover.background {
1860
border-style: solid;
1861
border-width: 1px;
1862
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3);
1863
border-radius: 3px;
1864
}
1865
1866
popover.background > stack {
1867
margin: -4px;
1868
}
1869
1870
popover.background > toolbar {
1871
margin: -2px;
1872
}
1873
1874
popover.background > list,
1875
popover.background > .view,
1876
popover.background > toolbar {
1877
border-style: none;
1878
box-shadow: none;
1879
background-color: transparent;
1880
}
1881
1882
popover.background.menu button,
1883
popover.background button.model {
1884
min-height: 32px;
1885
padding: 0 8px;
1886
border-radius: 2px;
1887
}
1888
1889
popover.background separator {
1890
margin: 4px 0;
1891
}
1892
1893
popover.background list separator {
1894
margin: 0;
1895
}
1896
1897
/*************
1898
* Notebooks *
1899
*************/
1900
notebook > header {
1901
border-width: 1px;
1902
border-color: rgba(0, 0, 0, 0.1);
1903
background-color: #F5F5F5;
1904
background-clip: border-box;
1905
}
1906
1907
notebook > header.top {
1908
border-bottom-style: solid;
1909
}
1910
1911
notebook > header.top > tabs {
1912
margin-bottom: -1px;
1913
}
1914
1915
notebook > header.top > tabs > tab:hover {
1916
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.26);
1917
}
1918
1919
notebook > header.top > tabs > tab:checked {
1920
box-shadow: inset 0 -2px #42A5F5;
1921
}
1922
1923
notebook > header.bottom {
1924
border-top-style: solid;
1925
}
1926
1927
notebook > header.bottom > tabs {
1928
margin-top: -1px;
1929
}
1930
1931
notebook > header.bottom > tabs > tab:hover {
1932
box-shadow: inset 0 2px rgba(0, 0, 0, 0.26);
1933
}
1934
1935
notebook > header.bottom > tabs > tab:checked {
1936
box-shadow: inset 0 2px #42A5F5;
1937
}
1938
1939
notebook > header.left {
1940
border-right-style: solid;
1941
}
1942
1943
notebook > header.left > tabs {
1944
margin-right: -1px;
1945
}
1946
1947
notebook > header.left > tabs > tab:hover {
1948
box-shadow: inset -2px 0 rgba(0, 0, 0, 0.26);
1949
}
1950
1951
notebook > header.left > tabs > tab:checked {
1952
box-shadow: inset -2px 0 #42A5F5;
1953
}
1954
1955
notebook > header.right {
1956
border-left-style: solid;
1957
}
1958
1959
notebook > header.right > tabs {
1960
margin-left: -1px;
1961
}
1962
1963
notebook > header.right > tabs > tab:hover {
1964
box-shadow: inset 2px 0 rgba(0, 0, 0, 0.26);
1965
}
1966
1967
notebook > header.right > tabs > tab:checked {
1968
box-shadow: inset 2px 0 #42A5F5;
1969
}
1970
1971
notebook > header.top > tabs > arrow {
1972
border-top-style: none;
1973
}
1974
1975
notebook > header.bottom > tabs > arrow {
1976
border-bottom-style: none;
1977
}
1978
1979
notebook > header.top > tabs > arrow, notebook > header.bottom > tabs > arrow {
1980
padding-left: 4px;
1981
padding-right: 4px;
1982
}
1983
1984
notebook > header.top > tabs > arrow.down, notebook > header.bottom > tabs > arrow.down {
1985
margin-left: -8px;
1986
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
1987
}
1988
1989
notebook > header.top > tabs > arrow.up, notebook > header.bottom > tabs > arrow.up {
1990
margin-right: -8px;
1991
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1992
}
1993
1994
notebook > header.left > tabs > arrow {
1995
border-left-style: none;
1996
}
1997
1998
notebook > header.right > tabs > arrow {
1999
border-right-style: none;
2000
}
2001
2002
notebook > header.left > tabs > arrow, notebook > header.right > tabs > arrow {
2003
padding-top: 4px;
2004
padding-bottom: 4px;
2005
}
2006
2007
notebook > header.left > tabs > arrow.down, notebook > header.right > tabs > arrow.down {
2008
margin-top: -8px;
2009
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
2010
}
2011
2012
notebook > header.left > tabs > arrow.up, notebook > header.right > tabs > arrow.up {
2013
margin-bottom: -8px;
2014
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
2015
}
2016
2017
notebook > header > tabs > arrow {
2018
min-height: 16px;
2019
min-width: 16px;
2020
border-radius: 0;
2021
}
2022
2023
notebook > header tab {
2024
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
2025
min-height: 20px;
2026
min-width: 20px;
2027
padding: 6px 12px;
2028
outline-offset: -6px;
2029
border-width: 1px;
2030
border-color: transparent;
2031
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 10%, transparent 0%);
2032
background-repeat: no-repeat;
2033
background-position: center;
2034
background-size: 0% 0%;
2035
color: rgba(0, 0, 0, 0.54);
2036
font-weight: 500;
2037
}
2038
2039
notebook > header tab:hover {
2040
color: rgba(0, 0, 0, 0.87);
2041
}
2042
2043
notebook > header tab:hover.reorderable-page {
2044
border-color: rgba(0, 0, 0, 0.1);
2045
background-color: #FAFAFA;
2046
}
2047
2048
notebook > header tab:disabled {
2049
color: rgba(0, 0, 0, 0.26);
2050
}
2051
2052
notebook > header tab:checked {
2053
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0.3s cubic-bezier(0, 0, 0.2, 1), background-image 0.8s cubic-bezier(0, 0, 0.2, 1);
2054
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
2055
background-size: 1000% 1000%;
2056
color: rgba(0, 0, 0, 0.87);
2057
}
2058
2059
notebook > header tab:checked:disabled {
2060
color: rgba(0, 0, 0, 0.38);
2061
}
2062
2063
notebook > header tab:checked.reorderable-page {
2064
border-color: rgba(0, 0, 0, 0.1);
2065
background-color: #FFFFFF;
2066
}
2067
2068
notebook > header tab button.flat:last-child {
2069
margin-left: 6px;
2070
margin-right: -6px;
2071
}
2072
2073
notebook > header tab button.flat:first-child {
2074
margin-left: -6px;
2075
margin-right: 6px;
2076
}
2077
2078
notebook > header.top tabs, notebook > header.bottom tabs {
2079
padding-left: 8px;
2080
padding-right: 8px;
2081
}
2082
2083
notebook > header.top tabs:not(:only-child):first-child, notebook > header.bottom tabs:not(:only-child):first-child {
2084
margin-left: 0;
2085
}
2086
2087
notebook > header.top tabs:not(:only-child):last-child, notebook > header.bottom tabs:not(:only-child):last-child {
2088
margin-right: 0;
2089
}
2090
2091
notebook > header.top tabs tab.reorderable-page, notebook > header.bottom tabs tab.reorderable-page {
2092
margin: 0 -1px;
2093
border-style: none solid;
2094
}
2095
2096
notebook > header.left tabs, notebook > header.right tabs {
2097
padding-top: 8px;
2098
padding-bottom: 8px;
2099
}
2100
2101
notebook > header.left tabs:not(:only-child):first-child, notebook > header.right tabs:not(:only-child):first-child {
2102
margin-top: 0;
2103
}
2104
2105
notebook > header.left tabs:not(:only-child):last-child, notebook > header.right tabs:not(:only-child):last-child {
2106
margin-bottom: 0;
2107
}
2108
2109
notebook > header.left tabs tab.reorderable-page, notebook > header.right tabs tab.reorderable-page {
2110
margin: -1px 0;
2111
border-style: solid none;
2112
}
2113
2114
notebook > stack:not(:only-child) {
2115
background-color: #FFFFFF;
2116
}
2117
2118
/**************
2119
* Scrollbars *
2120
**************/
2121
scrollbar {
2122
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2123
background-color: #FFFFFF;
2124
background-clip: padding-box;
2125
}
2126
2127
* {
2128
-GtkScrollbar-has-backward-stepper: false;
2129
-GtkScrollbar-has-forward-stepper: false;
2130
}
2131
2132
scrollbar.top {
2133
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
2134
}
2135
2136
scrollbar.bottom {
2137
border-top: 1px solid rgba(0, 0, 0, 0.1);
2138
}
2139
2140
scrollbar.left {
2141
border-right: 1px solid rgba(0, 0, 0, 0.1);
2142
}
2143
2144
scrollbar.right {
2145
border-left: 1px solid rgba(0, 0, 0, 0.1);
2146
}
2147
2148
scrollbar slider {
2149
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0;
2150
min-width: 8px;
2151
min-height: 8px;
2152
border: 4px solid transparent;
2153
border-radius: 9999px;
2154
background-clip: padding-box;
2155
background-color: rgba(0, 0, 0, 0.38);
2156
}
2157
2158
scrollbar slider:hover {
2159
background-color: rgba(0, 0, 0, 0.54);
2160
}
2161
2162
scrollbar slider:active {
2163
background-color: rgba(0, 0, 0, 0.87);
2164
}
2165
2166
scrollbar slider:disabled {
2167
background-color: rgba(0, 0, 0, 0.26);
2168
}
2169
2170
scrollbar.fine-tune slider {
2171
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0, min-width 0, min-height 0;
2172
min-width: 4px;
2173
min-height: 4px;
2174
}
2175
2176
scrollbar.fine-tune.horizontal slider {
2177
margin: 2px 0;
2178
}
2179
2180
scrollbar.fine-tune.vertical slider {
2181
margin: 0 2px;
2182
}
2183
2184
scrollbar.overlay-indicator:not(.dragging):not(.hovering) {
2185
border-color: transparent;
2186
background-color: transparent;
2187
}
2188
2189
scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider {
2190
min-width: 4px;
2191
min-height: 4px;
2192
margin: 3px;
2193
border: 1px solid rgba(255, 255, 255, 0.3);
2194
}
2195
2196
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button {
2197
min-width: 4px;
2198
min-height: 4px;
2199
margin: 3px;
2200
border: 1px solid rgba(255, 255, 255, 0.3);
2201
border-radius: 9999px;
2202
background-color: rgba(0, 0, 0, 0.38);
2203
background-clip: padding-box;
2204
-gtk-icon-source: none;
2205
}
2206
2207
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled {
2208
background-color: rgba(0, 0, 0, 0.26);
2209
}
2210
2211
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider {
2212
min-width: 24px;
2213
}
2214
2215
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal button {
2216
min-width: 8px;
2217
}
2218
2219
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider {
2220
min-height: 24px;
2221
}
2222
2223
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button {
2224
min-height: 8px;
2225
}
2226
2227
scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering {
2228
background-color: rgba(255, 255, 255, 0.9);
2229
}
2230
2231
scrollbar.horizontal slider {
2232
min-width: 24px;
2233
}
2234
2235
scrollbar.vertical slider {
2236
min-height: 24px;
2237
}
2238
2239
scrollbar button {
2240
min-width: 16px;
2241
min-height: 16px;
2242
padding: 0;
2243
border-radius: 0;
2244
}
2245
2246
scrollbar.vertical button.down {
2247
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
2248
}
2249
2250
scrollbar.vertical button.up {
2251
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
2252
}
2253
2254
scrollbar.horizontal button.down {
2255
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
2256
}
2257
2258
scrollbar.horizontal button.up {
2259
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
2260
}
2261
2262
/**********
2263
* Switch *
2264
**********/
2265
switch {
2266
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2267
margin: 6px 0;
2268
padding: 0 2px;
2269
border: 4px solid transparent;
2270
border-radius: 9999px;
2271
background-color: rgba(0, 0, 0, 0.26);
2272
background-clip: padding-box;
2273
font-size: 0;
2274
}
2275
2276
switch:disabled {
2277
background-color: rgba(0, 0, 0, 0.12);
2278
}
2279
2280
switch:checked {
2281
background-color: rgba(255, 64, 129, 0.5);
2282
}
2283
2284
switch:checked:disabled {
2285
background-color: rgba(255, 64, 129, 0.3);
2286
}
2287
2288
switch slider {
2289
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
2290
min-width: 20px;
2291
min-height: 20px;
2292
margin: -3px -2px;
2293
border-radius: 9999px;
2294
-gtk-outline-radius: 9999px;
2295
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2296
background-color: #FFFFFF;
2297
}
2298
2299
switch:hover slider {
2300
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2301
}
2302
2303
switch:checked slider {
2304
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1), background-image 0, background-color 0.00001s 0.3s;
2305
animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1);
2306
background-color: #FF4081;
2307
color: #FFFFFF;
2308
}
2309
2310
switch:disabled slider {
2311
background-color: #FAFAFA;
2312
}
2313
2314
switch:checked:disabled slider {
2315
animation: none;
2316
}
2317
2318
/*************************
2319
* Check and Radio items *
2320
*************************/
2321
.view.content-view.check:not(list),
2322
.content-view .tile check:not(list) {
2323
min-height: 40px;
2324
min-width: 40px;
2325
margin: 0;
2326
padding: 0;
2327
box-shadow: none;
2328
background-color: transparent;
2329
background-image: none;
2330
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2331
}
2332
2333
.view.content-view.check:not(list):hover, .view.content-view.check:not(list):active,
2334
.content-view .tile check:not(list):hover,
2335
.content-view .tile check:not(list):active {
2336
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2337
}
2338
2339
.view.content-view.check:not(list),
2340
.content-view .tile check:not(list) {
2341
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-unchecked.png"), url("assets/selectionmode-checkbox-unchecked@2.png"));
2342
}
2343
2344
.view.content-view.check:not(list):checked,
2345
.content-view .tile check:not(list):checked {
2346
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-checked.png"), url("assets/selectionmode-checkbox-checked@2.png"));
2347
}
2348
2349
checkbutton.text-button,
2350
radiobutton.text-button {
2351
padding: 2px;
2352
outline-offset: 0;
2353
}
2354
2355
checkbutton.text-button label:not(:only-child),
2356
radiobutton.text-button label:not(:only-child) {
2357
margin: 0 4px;
2358
}
2359
2360
check,
2361
radio {
2362
min-height: 24px;
2363
min-width: 24px;
2364
margin: -10px;
2365
padding: 10px;
2366
}
2367
2368
check:checked, check:indeterminate,
2369
radio:checked,
2370
radio:indeterminate {
2371
color: #FF4081;
2372
}
2373
2374
check:checked:disabled, check:indeterminate:disabled,
2375
radio:checked:disabled,
2376
radio:indeterminate:disabled {
2377
color: rgba(255, 64, 129, 0.5);
2378
}
2379
2380
row:selected check:not(:checked):not(:indeterminate), row:selected
2381
radio:not(:checked):not(:indeterminate) {
2382
color: rgba(255, 255, 255, 0.7);
2383
}
2384
2385
row:selected check:not(:checked):not(:indeterminate):hover, row:selected check:not(:checked):not(:indeterminate):active, row:selected
2386
radio:not(:checked):not(:indeterminate):hover, row:selected
2387
radio:not(:checked):not(:indeterminate):active {
2388
color: #FFFFFF;
2389
}
2390
2391
row:selected check:not(:checked):not(:indeterminate):disabled, row:selected
2392
radio:not(:checked):not(:indeterminate):disabled {
2393
color: rgba(255, 255, 255, 0.3);
2394
}
2395
2396
popover check, popover check:hover, popover check:disabled, popover
2397
radio, popover
2398
radio:hover, popover
2399
radio:disabled {
2400
box-shadow: none;
2401
background-image: none;
2402
}
2403
2404
popover check:not(:checked):not(:indeterminate):not(:disabled), popover
2405
radio:not(:checked):not(:indeterminate):not(:disabled) {
2406
color: rgba(0, 0, 0, 0.54);
2407
}
2408
2409
popover check.left:dir(rtl), popover
2410
radio.left:dir(rtl) {
2411
margin-left: -16px;
2412
margin-right: -8px;
2413
}
2414
2415
popover check.right:dir(ltr), popover
2416
radio.right:dir(ltr) {
2417
margin-left: -8px;
2418
margin-right: -16px;
2419
}
2420
2421
menu menuitem check, menu menuitem
2422
radio {
2423
transition: none;
2424
min-height: 16px;
2425
min-width: 16px;
2426
margin: 0;
2427
padding: 0;
2428
}
2429
2430
menu menuitem check:dir(ltr), menu menuitem
2431
radio:dir(ltr) {
2432
margin-right: 8px;
2433
}
2434
2435
menu menuitem check:dir(rtl), menu menuitem
2436
radio:dir(rtl) {
2437
margin-left: 8px;
2438
}
2439
2440
menu menuitem check:not(:checked):not(:indeterminate):not(:disabled), menu menuitem
2441
radio:not(:checked):not(:indeterminate):not(:disabled) {
2442
color: rgba(0, 0, 0, 0.54);
2443
}
2444
2445
menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem
2446
radio, menu menuitem
2447
radio:hover, menu menuitem
2448
radio:disabled {
2449
box-shadow: none;
2450
}
2451
2452
2453
check {
2454
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.symbolic.png")));
2455
}
2456
2457
2458
check:checked {
2459
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.symbolic.png")));
2460
}
2461
2462
2463
check:indeterminate {
2464
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.symbolic.png")));
2465
}
2466
2467
2468
radio {
2469
border-image-slice: 22;
2470
border-image-width: 22px;
2471
}
2472
2473
2474
radio {
2475
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.symbolic.png")));
2476
}
2477
2478
2479
radio:indeterminate {
2480
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-mixed-symbolic.symbolic.png")));
2481
}
2482
2483
2484
radio {
2485
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent));
2486
}
2487
2488
2489
radio:checked:not(:indeterminate) {
2490
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.11364, to(#FF4081), to(transparent));
2491
}
2492
2493
2494
radio:checked:not(:indeterminate):disabled {
2495
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.11364, to(rgba(255, 64, 129, 0.5)), to(transparent));
2496
}
2497
2498
window.background:not(.csd) > widget > checkbutton > check,
2499
menu menuitem check {
2500
border-radius: 2px;
2501
-gtk-outline-radius: 2px;
2502
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-checkbox-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/small-checkbox-unchecked-symbolic.symbolic.png")));
2503
}
2504
2505
window.background:not(.csd) > widget > checkbutton > check:checked,
2506
menu menuitem check:checked {
2507
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-checkbox-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/small-checkbox-checked-symbolic.symbolic.png")));
2508
}
2509
2510
window.background:not(.csd) > widget > checkbutton > check:indeterminate,
2511
menu menuitem check:indeterminate {
2512
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-checkbox-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/small-checkbox-mixed-symbolic.symbolic.png")));
2513
}
2514
2515
window.background:not(.csd) > widget > radiobutton > radio,
2516
menu menuitem radio {
2517
border-image: none;
2518
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-radio-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/small-radio-unchecked-symbolic.symbolic.png")));
2519
}
2520
2521
window.background:not(.csd) > widget > radiobutton > radio:checked,
2522
menu menuitem radio:checked {
2523
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-radio-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/small-radio-checked-symbolic.symbolic.png")));
2524
}
2525
2526
window.background:not(.csd) > widget > radiobutton > radio:indeterminate,
2527
menu menuitem radio:indeterminate {
2528
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-radio-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/small-radio-mixed-symbolic.symbolic.png")));
2529
}
2530
2531
check:not(:checked):active {
2532
-gtk-icon-transform: rotate(90deg);
2533
}
2534
2535
check:not(:checked):indeterminate:active,
2536
radio:not(:checked):indeterminate:active {
2537
-gtk-icon-transform: scaleX(-1);
2538
}
2539
2540
check:not(:checked),
2541
radio:not(:checked) {
2542
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0.5s cubic-bezier(0, 0, 0.2, 1), background-image 1s cubic-bezier(0, 0, 0.2, 1), -gtk-icon-transform 0;
2543
}
2544
2545
check:not(:checked):active,
2546
radio:not(:checked):active {
2547
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0, -gtk-icon-transform 0;
2548
}
2549
2550
menu menuitem check:not(:checked), menu menuitem
2551
radio:not(:checked) {
2552
transition: none;
2553
}
2554
2555
treeview.view check,
2556
treeview.view radio {
2557
padding: 0;
2558
}
2559
2560
treeview.view check:hover,
2561
treeview.view radio:hover {
2562
box-shadow: inset 0 0 0 9999px alpha(rgba(0, 0, 0, 0.87), 0.05);
2563
}
2564
2565
treeview.view check:hover:disabled,
2566
treeview.view radio:hover:disabled {
2567
box-shadow: none;
2568
}
2569
2570
treeview.view check:hover:selected,
2571
treeview.view radio:hover:selected {
2572
box-shadow: inset 0 0 0 9999px alpha(#FFFFFF, 0.05);
2573
}
2574
2575
treeview.view check,
2576
treeview.view radio {
2577
color: rgba(0, 0, 0, 0.54);
2578
}
2579
2580
treeview.view check:hover, treeview.view check:active,
2581
treeview.view radio:hover,
2582
treeview.view radio:active {
2583
color: rgba(0, 0, 0, 0.87);
2584
}
2585
2586
treeview.view check:disabled,
2587
treeview.view radio:disabled {
2588
color: rgba(0, 0, 0, 0.26);
2589
}
2590
2591
treeview.view check:checked, treeview.view check:indeterminate,
2592
treeview.view radio:checked,
2593
treeview.view radio:indeterminate {
2594
color: #FF4081;
2595
}
2596
2597
treeview.view check:checked:disabled, treeview.view check:indeterminate:disabled,
2598
treeview.view radio:checked:disabled,
2599
treeview.view radio:indeterminate:disabled {
2600
color: rgba(255, 64, 129, 0.5);
2601
}
2602
2603
treeview.view check:selected,
2604
treeview.view radio:selected {
2605
color: rgba(255, 255, 255, 0.7);
2606
}
2607
2608
treeview.view check:selected:hover, treeview.view check:selected:active,
2609
treeview.view radio:selected:hover,
2610
treeview.view radio:selected:active {
2611
color: #FFFFFF;
2612
}
2613
2614
treeview.view check:selected:disabled,
2615
treeview.view radio:selected:disabled {
2616
color: rgba(255, 255, 255, 0.3);
2617
}
2618
2619
treeview.view check:selected:checked, treeview.view check:selected:indeterminate,
2620
treeview.view radio:selected:checked,
2621
treeview.view radio:selected:indeterminate {
2622
color: #FF4081;
2623
}
2624
2625
treeview.view check:selected:checked:disabled, treeview.view check:selected:indeterminate:disabled,
2626
treeview.view radio:selected:checked:disabled,
2627
treeview.view radio:selected:indeterminate:disabled {
2628
color: rgba(255, 64, 129, 0.5);
2629
}
2630
2631
treeview.view radio:checked {
2632
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-checked-symbolic.symbolic.png")));
2633
border-image: none;
2634
}
2635
2636
/************
2637
* GtkScale *
2638
************/
2639
scale {
2640
min-height: 8px;
2641
min-width: 8px;
2642
padding: 12px;
2643
}
2644
2645
scale slider {
2646
min-height: 24px;
2647
min-width: 24px;
2648
margin: -11px;
2649
}
2650
2651
scale trough {
2652
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2653
outline-offset: 2px;
2654
background-color: rgba(0, 0, 0, 0.26);
2655
}
2656
2657
scale trough:disabled {
2658
background-color: rgba(0, 0, 0, 0.12);
2659
}
2660
2661
scale highlight {
2662
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2663
background-color: #FF4081;
2664
}
2665
2666
scale highlight:disabled {
2667
background-color: transparent;
2668
}
2669
2670
scale fill {
2671
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2672
background-color: rgba(0, 0, 0, 0.26);
2673
}
2674
2675
scale fill:disabled {
2676
background-color: transparent;
2677
}
2678
2679
scale slider {
2680
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
2681
background-repeat: no-repeat;
2682
background-position: center;
2683
background-size: calc(100% - 10px);
2684
}
2685
2686
scale slider {
2687
background-image: -gtk-scaled(url("assets/scale-slider.png"), url("assets/scale-slider@2.png"));
2688
}
2689
2690
scale slider:disabled {
2691
background-image: -gtk-scaled(url("assets/scale-slider-disabled.png"), url("assets/scale-slider-disabled@2.png"));
2692
}
2693
2694
scale slider:hover {
2695
background-size: calc(100% - 8px);
2696
}
2697
2698
scale slider:active {
2699
background-size: calc(100% - 6px);
2700
}
2701
2702
scale.fine-tune slider {
2703
background-size: calc(100% - 12px);
2704
}
2705
2706
scale marks label,
2707
scale value {
2708
color: rgba(0, 0, 0, 0.38);
2709
}
2710
2711
scale marks {
2712
color: rgba(0, 0, 0, 0.26);
2713
}
2714
2715
scale marks.top {
2716
margin-bottom: 8px;
2717
margin-top: -16px;
2718
}
2719
2720
scale marks.bottom {
2721
margin-top: 8px;
2722
margin-bottom: -16px;
2723
}
2724
2725
scale marks.top {
2726
margin-right: 8px;
2727
margin-left: -16px;
2728
}
2729
2730
scale marks.bottom {
2731
margin-left: 8px;
2732
margin-right: -16px;
2733
}
2734
2735
scale.horizontal indicator {
2736
min-height: 8px;
2737
min-width: 1px;
2738
}
2739
2740
scale.vertical indicator {
2741
min-height: 1px;
2742
min-width: 8px;
2743
}
2744
2745
scale.horizontal.marks-before:not(.marks-after) slider {
2746
min-height: 30px;
2747
min-width: 24px;
2748
margin-top: -17px;
2749
background-position: center calc(100% - 5px);
2750
}
2751
2752
scale.horizontal.marks-before:not(.marks-after) slider {
2753
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider.png"), url("assets/scale-horz-marks-before-slider@2.png"));
2754
}
2755
2756
scale.horizontal.marks-before:not(.marks-after) slider:disabled {
2757
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider-disabled.png"), url("assets/scale-horz-marks-before-slider-disabled@2.png"));
2758
}
2759
2760
scale.horizontal.marks-before:not(.marks-after) slider:hover {
2761
background-position: center calc(100% - 4px);
2762
}
2763
2764
scale.horizontal.marks-before:not(.marks-after) slider:active {
2765
background-position: center calc(100% - 3px);
2766
}
2767
2768
scale.horizontal.marks-before:not(.marks-after).fine-tune slider {
2769
background-position: center calc(100% - 6px);
2770
}
2771
2772
scale.horizontal.marks-after:not(.marks-before) slider {
2773
min-height: 30px;
2774
min-width: 24px;
2775
margin-bottom: -17px;
2776
background-position: center calc(5px);
2777
}
2778
2779
scale.horizontal.marks-after:not(.marks-before) slider {
2780
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider.png"), url("assets/scale-horz-marks-after-slider@2.png"));
2781
}
2782
2783
scale.horizontal.marks-after:not(.marks-before) slider:disabled {
2784
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider-disabled.png"), url("assets/scale-horz-marks-after-slider-disabled@2.png"));
2785
}
2786
2787
scale.horizontal.marks-after:not(.marks-before) slider:hover {
2788
background-position: center calc(4px);
2789
}
2790
2791
scale.horizontal.marks-after:not(.marks-before) slider:active {
2792
background-position: center calc(3px);
2793
}
2794
2795
scale.horizontal.marks-after:not(.marks-before).fine-tune slider {
2796
background-position: center calc(6px);
2797
}
2798
2799
scale.vertical.marks-before:not(.marks-after) slider {
2800
min-height: 24px;
2801
min-width: 30px;
2802
margin-left: -17px;
2803
background-position: calc(5px) center;
2804
}
2805
2806
scale.vertical.marks-before:not(.marks-after) slider {
2807
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider.png"), url("assets/scale-vert-marks-before-slider@2.png"));
2808
}
2809
2810
scale.vertical.marks-before:not(.marks-after) slider:disabled {
2811
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider-disabled.png"), url("assets/scale-vert-marks-before-slider-disabled@2.png"));
2812
}
2813
2814
scale.vertical.marks-before:not(.marks-after) slider:hover {
2815
background-position: calc(4px) center;
2816
}
2817
2818
scale.vertical.marks-before:not(.marks-after) slider:active {
2819
background-position: calc(3px) center;
2820
}
2821
2822
scale.vertical.marks-before:not(.marks-after).fine-tune slider {
2823
background-position: calc(6px) center;
2824
}
2825
2826
scale.vertical.marks-after:not(.marks-before) slider {
2827
min-height: 24px;
2828
min-width: 30px;
2829
margin-right: -17px;
2830
background-position: calc(100% - 5px) center;
2831
}
2832
2833
scale.vertical.marks-after:not(.marks-before) slider {
2834
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider.png"), url("assets/scale-vert-marks-after-slider@2.png"));
2835
}
2836
2837
scale.vertical.marks-after:not(.marks-before) slider:disabled {
2838
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider-disabled.png"), url("assets/scale-vert-marks-after-slider-disabled@2.png"));
2839
}
2840
2841
scale.vertical.marks-after:not(.marks-before) slider:hover {
2842
background-position: calc(100% - 4px) center;
2843
}
2844
2845
scale.vertical.marks-after:not(.marks-before) slider:active {
2846
background-position: calc(100% - 3px) center;
2847
}
2848
2849
scale.vertical.marks-after:not(.marks-before).fine-tune slider {
2850
background-position: calc(100% - 6px) center;
2851
}
2852
2853
scale.color {
2854
min-height: 0;
2855
min-width: 0;
2856
}
2857
2858
scale.color.horizontal {
2859
padding: 0 0 12px 0;
2860
}
2861
2862
scale.color.horizontal slider:dir(ltr), scale.color.horizontal slider:dir(rtl) {
2863
margin-bottom: -12px;
2864
margin-top: -2px;
2865
}
2866
2867
scale.color.vertical:dir(ltr) {
2868
padding: 0 0 0 12px;
2869
}
2870
2871
scale.color.vertical:dir(ltr) slider {
2872
margin-left: -12px;
2873
margin-right: -2px;
2874
}
2875
2876
scale.color.vertical:dir(rtl) {
2877
padding: 0 12px 0 0;
2878
}
2879
2880
scale.color.vertical:dir(rtl) slider {
2881
margin-right: -12px;
2882
margin-left: -2px;
2883
}
2884
2885
/*****************
2886
* Progress bars *
2887
*****************/
2888
progressbar {
2889
color: rgba(0, 0, 0, 0.38);
2890
font-size: smaller;
2891
}
2892
2893
progressbar.horizontal trough,
2894
progressbar.horizontal progress {
2895
min-height: 4px;
2896
}
2897
2898
progressbar.vertical trough,
2899
progressbar.vertical progress {
2900
min-width: 4px;
2901
}
2902
2903
progressbar trough {
2904
background-color: rgba(66, 165, 245, 0.3);
2905
}
2906
2907
progressbar progress {
2908
background-color: #42A5F5;
2909
}
2910
2911
progressbar trough.empty progress {
2912
all: unset;
2913
}
2914
2915
/*************
2916
* Level Bar *
2917
*************/
2918
levelbar block {
2919
min-width: 32px;
2920
min-height: 4px;
2921
}
2922
2923
levelbar.vertical block {
2924
min-width: 4px;
2925
min-height: 32px;
2926
}
2927
2928
levelbar trough {
2929
padding: 2px;
2930
border-radius: 2px;
2931
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2932
background-color: #FFFFFF;
2933
}
2934
2935
levelbar trough:disabled {
2936
background-color: #FAFAFA;
2937
}
2938
2939
levelbar.horizontal.discrete block {
2940
margin: 0 1px;
2941
}
2942
2943
levelbar.horizontal.discrete trough {
2944
padding: 2px 1px;
2945
}
2946
2947
levelbar.vertical.discrete block {
2948
margin: 1px 0;
2949
}
2950
2951
levelbar.vertical.discrete trough {
2952
padding: 1px 2px;
2953
}
2954
2955
levelbar block.low {
2956
background-color: #FF6D00;
2957
}
2958
2959
levelbar block.high, levelbar block:not(.empty) {
2960
background-color: #42A5F5;
2961
}
2962
2963
levelbar block.full {
2964
background-color: #00C853;
2965
}
2966
2967
levelbar block.empty {
2968
background-color: rgba(0, 0, 0, 0.12);
2969
}
2970
2971
/****************
2972
* Print dialog *
2973
*****************/
2974
printdialog paper {
2975
padding: 0;
2976
border: 1px solid rgba(0, 0, 0, 0.1);
2977
background-color: #FFFFFF;
2978
color: rgba(0, 0, 0, 0.87);
2979
}
2980
2981
printdialog .dialog-action-box {
2982
margin: 12px;
2983
}
2984
2985
/**********
2986
* Frames *
2987
**********/
2988
frame > border,
2989
.frame {
2990
margin: 0;
2991
padding: 0;
2992
border: 1px solid rgba(0, 0, 0, 0.1);
2993
border-radius: 0;
2994
box-shadow: none;
2995
}
2996
2997
frame > border.flat,
2998
.frame.flat,
2999
frame.flat > border {
3000
border-style: none;
3001
}
3002
3003
actionbar > revealer > box {
3004
padding: 6px;
3005
border-top: 1px solid rgba(0, 0, 0, 0.1);
3006
}
3007
3008
scrolledwindow viewport.frame {
3009
border-style: none;
3010
}
3011
3012
overshoot.top {
3013
background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
3014
background-repeat: no-repeat;
3015
background-position: center top;
3016
background-color: transparent;
3017
border: none;
3018
box-shadow: none;
3019
}
3020
3021
overshoot.bottom {
3022
background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
3023
background-repeat: no-repeat;
3024
background-position: center bottom;
3025
background-color: transparent;
3026
border: none;
3027
box-shadow: none;
3028
}
3029
3030
overshoot.left {
3031
background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
3032
background-repeat: no-repeat;
3033
background-position: left center;
3034
background-color: transparent;
3035
border: none;
3036
box-shadow: none;
3037
}
3038
3039
overshoot.right {
3040
background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
3041
background-repeat: no-repeat;
3042
background-position: right center;
3043
background-color: transparent;
3044
border: none;
3045
box-shadow: none;
3046
}
3047
3048
undershoot.top {
3049
background-color: transparent;
3050
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%);
3051
padding-top: 1px;
3052
background-size: 12px 1px;
3053
background-repeat: repeat-x;
3054
background-origin: content-box;
3055
background-position: left top;
3056
}
3057
3058
undershoot.bottom {
3059
background-color: transparent;
3060
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%);
3061
padding-bottom: 1px;
3062
background-size: 12px 1px;
3063
background-repeat: repeat-x;
3064
background-origin: content-box;
3065
background-position: left bottom;
3066
}
3067
3068
undershoot.left {
3069
background-color: transparent;
3070
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%);
3071
padding-left: 1px;
3072
background-size: 1px 12px;
3073
background-repeat: repeat-y;
3074
background-origin: content-box;
3075
background-position: left top;
3076
}
3077
3078
undershoot.right {
3079
background-color: transparent;
3080
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%);
3081
padding-right: 1px;
3082
background-size: 1px 12px;
3083
background-repeat: repeat-y;
3084
background-origin: content-box;
3085
background-position: right top;
3086
}
3087
3088
junction {
3089
border-style: solid none none solid;
3090
border-width: 1px;
3091
border-color: rgba(0, 0, 0, 0.1);
3092
background-color: #FFFFFF;
3093
}
3094
3095
junction:dir(rtl) {
3096
border-style: solid solid none none;
3097
}
3098
3099
separator {
3100
min-width: 1px;
3101
min-height: 1px;
3102
background-color: rgba(0, 0, 0, 0.1);
3103
}
3104
3105
3106
button.font separator,
3107
button.file separator, .tweak-categories separator {
3108
min-width: 0;
3109
min-height: 0;
3110
background-color: transparent;
3111
}
3112
3113
/*********
3114
* Lists *
3115
*********/
3116
list {
3117
border-color: rgba(0, 0, 0, 0.1);
3118
background-color: #FFFFFF;
3119
}
3120
3121
list row {
3122
padding: 2px;
3123
}
3124
3125
row.activatable, .view, treeview.view header button, .budgie-menu button {
3126
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, background-size 0.5s cubic-bezier(0, 0, 0.2, 1), background-image 1s cubic-bezier(0, 0, 0.2, 1);
3127
box-shadow: inset 0 0 0 9999px transparent;
3128
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
3129
background-repeat: no-repeat;
3130
background-position: center;
3131
background-size: 1000% 1000%;
3132
}
3133
3134
row.activatable:hover, .view:hover, treeview.view header button:hover, .budgie-menu button:hover {
3135
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, box-shadow 0, background-size 0.5s cubic-bezier(0, 0, 0.2, 1), background-image 1s cubic-bezier(0, 0, 0.2, 1);
3136
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.05);
3137
}
3138
3139
row.activatable.has-open-popup, .has-open-popup.view, treeview.view header button.has-open-popup, .budgie-menu button.has-open-popup, row.activatable:active, .view:active, treeview.view header button:active, .budgie-menu button:active {
3140
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, background-size 0, background-image 0;
3141
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
3142
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
3143
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
3144
background-size: 0% 0%;
3145
}
3146
3147
/*********************
3148
* App Notifications *
3149
*********************/
3150
.app-notification {
3151
margin: 8px;
3152
}
3153
3154
.app-notification.frame,
3155
.app-notification border {
3156
border-style: none;
3157
}
3158
3159
/*************
3160
* Expanders *
3161
*************/
3162
expander arrow {
3163
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
3164
min-width: 16px;
3165
min-height: 16px;
3166
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
3167
-gtk-icon-transform: rotate(-90deg);
3168
color: rgba(0, 0, 0, 0.54);
3169
}
3170
3171
expander arrow:dir(rtl) {
3172
-gtk-icon-transform: rotate(90deg);
3173
}
3174
3175
expander arrow:checked {
3176
-gtk-icon-transform: unset;
3177
}
3178
3179
expander arrow:hover, expander arrow:active {
3180
color: rgba(0, 0, 0, 0.87);
3181
}
3182
3183
expander arrow:disabled {
3184
color: rgba(0, 0, 0, 0.26);
3185
}
3186
3187
expander arrow:selected {
3188
color: rgba(255, 255, 255, 0.7);
3189
}
3190
3191
expander arrow:selected:hover, expander arrow:selected:active {
3192
color: #FFFFFF;
3193
}
3194
3195
expander arrow:selected:disabled {
3196
color: rgba(255, 255, 255, 0.3);
3197
}
3198
3199
/************
3200
* Calendar *
3201
************/
3202
calendar {
3203
padding: 1px;
3204
border: 1px solid rgba(0, 0, 0, 0.1);
3205
color: rgba(0, 0, 0, 0.87);
3206
}
3207
3208
calendar:disabled {
3209
color: rgba(0, 0, 0, 0.38);
3210
}
3211
3212
calendar:selected {
3213
border-radius: 3px;
3214
}
3215
3216
calendar.header {
3217
border-style: none none solid;
3218
border-radius: 0;
3219
}
3220
3221
calendar.highlight {
3222
color: rgba(0, 0, 0, 0.54);
3223
font-weight: 500;
3224
}
3225
3226
calendar:indeterminate {
3227
color: rgba(0, 0, 0, 0.26);
3228
}
3229
3230
/***********
3231
* Dialogs *
3232
***********/
3233
messagedialog.background {
3234
background-color: #FAFAFA;
3235
}
3236
3237
messagedialog .titlebar {
3238
min-height: 20px;
3239
border-style: none;
3240
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
3241
background-color: #FAFAFA;
3242
color: rgba(0, 0, 0, 0.87);
3243
}
3244
3245
messagedialog .titlebar:backdrop {
3246
color: rgba(0, 0, 0, 0.54);
3247
}
3248
3249
messagedialog.csd.background {
3250
border-bottom-left-radius: 2px;
3251
border-bottom-right-radius: 2px;
3252
}
3253
3254
messagedialog.csd .dialog-action-area button {
3255
padding: 8px 16px;
3256
border-top: 1px solid rgba(0, 0, 0, 0.1);
3257
border-radius: 0;
3258
}
3259
3260
messagedialog.csd .dialog-action-area button:first-child {
3261
border-bottom-left-radius: 2px;
3262
}
3263
3264
messagedialog.csd .dialog-action-area button:last-child {
3265
border-bottom-right-radius: 2px;
3266
}
3267
3268
filechooser .dialog-action-box {
3269
border-top: 1px solid rgba(0, 0, 0, 0.1);
3270
}
3271
3272
filechooser #pathbarbox {
3273
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3274
background-color: #F5F5F5;
3275
}
3276
3277
filechooserbutton:drop(active) {
3278
box-shadow: none;
3279
}
3280
3281
/***********
3282
* Sidebar *
3283
***********/
3284
.sidebar {
3285
border-style: none;
3286
background-color: #FAFAFA;
3287
}
3288
3289
stacksidebar.sidebar:dir(ltr) list, stacksidebar.sidebar.left list, stacksidebar.sidebar.left:dir(rtl) list, .sidebar:dir(ltr), .sidebar.left, .sidebar.left:dir(rtl) {
3290
border-right: 1px solid rgba(0, 0, 0, 0.1);
3291
border-left-style: none;
3292
}
3293
3294
stacksidebar.sidebar:dir(rtl) list, stacksidebar.sidebar.right list, .sidebar:dir(rtl), .sidebar.right {
3295
border-left: 1px solid rgba(0, 0, 0, 0.1);
3296
border-right-style: none;
3297
}
3298
3299
.sidebar list {
3300
background-color: transparent;
3301
}
3302
3303
paned .sidebar.left, paned .sidebar.right, paned .sidebar.left:dir(rtl), paned .sidebar:dir(rtl), paned .sidebar:dir(ltr), paned .sidebar {
3304
border-style: none;
3305
}
3306
3307
stacksidebar row {
3308
padding: 10px 4px;
3309
}
3310
3311
stacksidebar row > label {
3312
padding-left: 6px;
3313
padding-right: 6px;
3314
}
3315
3316
/****************
3317
* File chooser *
3318
****************/
3319
placessidebar > viewport.frame {
3320
border-style: none;
3321
}
3322
3323
placessidebar list {
3324
padding: 1px 0 4px;
3325
}
3326
3327
placessidebar row {
3328
min-height: 32px;
3329
margin: -1px 0;
3330
padding: 0;
3331
}
3332
3333
placessidebar row > revealer {
3334
padding: 0 12px;
3335
}
3336
3337
placessidebar row:selected {
3338
color: #FFFFFF;
3339
}
3340
3341
placessidebar row:disabled {
3342
color: rgba(0, 0, 0, 0.38);
3343
}
3344
3345
placessidebar row image.sidebar-icon {
3346
color: rgba(0, 0, 0, 0.54);
3347
}
3348
3349
placessidebar row image.sidebar-icon:dir(ltr) {
3350
padding-right: 8px;
3351
}
3352
3353
placessidebar row image.sidebar-icon:dir(rtl) {
3354
padding-left: 8px;
3355
}
3356
3357
placessidebar row:selected image.sidebar-icon {
3358
color: rgba(255, 255, 255, 0.7);
3359
}
3360
3361
placessidebar row label.sidebar-label:dir(ltr) {
3362
padding-right: 2px;
3363
}
3364
3365
placessidebar row label.sidebar-label:dir(rtl) {
3366
padding-left: 2px;
3367
}
3368
3369
placessidebar row.sidebar-placeholder-row {
3370
min-height: 2px;
3371
padding: 0 8px;
3372
background-image: image(#FF4081);
3373
background-clip: content-box;
3374
}
3375
3376
placessidebar row.sidebar-new-bookmark-row {
3377
color: #FF4081;
3378
}
3379
3380
placessidebar row:drop(active):not(:disabled) {
3381
box-shadow: inset 0 0 0 2px #FF4081;
3382
}
3383
3384
placesview .server-list-button > image {
3385
-gtk-icon-transform: rotate(0turn);
3386
}
3387
3388
placesview .server-list-button:checked > image {
3389
-gtk-icon-transform: rotate(-0.5turn);
3390
}
3391
3392
placesview > actionbar > revealer > box > label {
3393
padding-left: 8px;
3394
padding-right: 8px;
3395
}
3396
3397
/*********
3398
* Paned *
3399
*********/
3400
paned > separator {
3401
min-width: 1px;
3402
min-height: 1px;
3403
-gtk-icon-source: none;
3404
border-style: none;
3405
background-color: transparent;
3406
background-image: image(rgba(0, 0, 0, 0.1));
3407
background-size: 1px 1px;
3408
background-clip: content-box;
3409
}
3410
3411
paned > separator.wide {
3412
min-width: 6px;
3413
min-height: 6px;
3414
background-color: #F5F5F5;
3415
background-image: image(rgba(0, 0, 0, 0.1)), image(rgba(0, 0, 0, 0.1));
3416
background-size: 1px 1px, 1px 1px;
3417
}
3418
3419
paned.horizontal > separator {
3420
background-repeat: repeat-y;
3421
}
3422
3423
paned.horizontal > separator:dir(ltr) {
3424
margin: 0 -8px 0 0;
3425
padding: 0 8px 0 0;
3426
background-position: left;
3427
}
3428
3429
paned.horizontal > separator:dir(rtl) {
3430
margin: 0 0 0 -8px;
3431
padding: 0 0 0 8px;
3432
background-position: right;
3433
}
3434
3435
paned.horizontal > separator.wide {
3436
margin: 0;
3437
padding: 0;
3438
background-repeat: repeat-y, repeat-y;
3439
background-position: left, right;
3440
}
3441
3442
paned.vertical > separator {
3443
margin: 0 0 -8px 0;
3444
padding: 0 0 8px 0;
3445
background-repeat: repeat-x;
3446
background-position: top;
3447
}
3448
3449
paned.vertical > separator.wide {
3450
margin: 0;
3451
padding: 0;
3452
background-repeat: repeat-x, repeat-x;
3453
background-position: bottom, top;
3454
}
3455
3456
/**************
3457
* GtkInfoBar *
3458
**************/
3459
infobar {
3460
border-style: none;
3461
}
3462
3463
infobar.info {
3464
background-color: #66BB6A;
3465
}
3466
3467
infobar.question {
3468
background-color: #42A5F5;
3469
}
3470
3471
infobar.warning {
3472
background-color: #FFA726;
3473
}
3474
3475
infobar.error {
3476
background-color: #EF5350;
3477
}
3478
3479
infobar.info > label, infobar.info, infobar.question > label, infobar.question, infobar.warning > label, infobar.warning, infobar.error > label, infobar.error {
3480
color: #FFFFFF;
3481
}
3482
3483
/************
3484
* Tooltips *
3485
************/
3486
tooltip {
3487
border-radius: 2px;
3488
box-shadow: none;
3489
}
3490
3491
tooltip.background {
3492
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
3493
background-color: rgba(255, 255, 255, 0.9);
3494
}
3495
3496
tooltip:not(.csd):not(.unity-csd) {
3497
border: 1px solid rgba(0, 0, 0, 0.1);
3498
border-radius: 3px;
3499
background-clip: padding-box;
3500
}
3501
3502
tooltip decoration {
3503
background-color: transparent;
3504
}
3505
3506
tooltip label {
3507
min-height: 20px;
3508
padding: 0 2px;
3509
}
3510
3511
/*****************
3512
* Color Chooser *
3513
*****************/
3514
colorswatch.top {
3515
border-top-left-radius: 2.5px;
3516
border-top-right-radius: 2.5px;
3517
}
3518
3519
colorswatch.top overlay {
3520
border-top-left-radius: 2px;
3521
border-top-right-radius: 2px;
3522
}
3523
3524
colorswatch.bottom {
3525
border-bottom-left-radius: 2.5px;
3526
border-bottom-right-radius: 2.5px;
3527
}
3528
3529
colorswatch.bottom overlay {
3530
border-bottom-left-radius: 2px;
3531
border-bottom-right-radius: 2px;
3532
}
3533
3534
colorswatch.left, colorswatch:first-child:not(.top) {
3535
border-top-left-radius: 2.5px;
3536
border-bottom-left-radius: 2.5px;
3537
}
3538
3539
colorswatch.left overlay, colorswatch:first-child:not(.top) overlay {
3540
border-top-left-radius: 2px;
3541
border-bottom-left-radius: 2px;
3542
}
3543
3544
colorswatch.right, colorswatch:last-child:not(.bottom) {
3545
border-top-right-radius: 2.5px;
3546
border-bottom-right-radius: 2.5px;
3547
}
3548
3549
colorswatch.right overlay, colorswatch:last-child:not(.bottom) overlay {
3550
border-top-right-radius: 2px;
3551
border-bottom-right-radius: 2px;
3552
}
3553
3554
colorswatch.dark overlay {
3555
color: #FFFFFF;
3556
}
3557
3558
colorswatch.light overlay {
3559
color: rgba(0, 0, 0, 0.87);
3560
}
3561
3562
colorswatch.dark {
3563
color: #FFFFFF;
3564
}
3565
3566
colorswatch.light {
3567
color: rgba(0, 0, 0, 0.87);
3568
}
3569
3570
colorswatch:drop(active) {
3571
box-shadow: none;
3572
}
3573
3574
colorswatch:drop(active).light overlay {
3575
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), 0 0 0 2px #FF4081;
3576
}
3577
3578
colorswatch:drop(active).dark overlay {
3579
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), 0 0 0 2px #FF4081;
3580
}
3581
3582
colorswatch overlay {
3583
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3584
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3585
}
3586
3587
colorswatch overlay:hover {
3588
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3589
}
3590
3591
colorswatch#add-color-button {
3592
border-radius: 2px 2px 0 0;
3593
color: #FFFFFF;
3594
}
3595
3596
colorswatch#add-color-button:only-child {
3597
border-radius: 2px;
3598
}
3599
3600
colorswatch#add-color-button overlay {
3601
background-image: linear-gradient(to right, #EF5350 25%, #FFA726 25%, #FFA726 50%, #66BB6A 50%, #66BB6A 75%, #42A5F5 75%);
3602
color: #FFFFFF;
3603
}
3604
3605
colorswatch:disabled {
3606
opacity: 0.5;
3607
}
3608
3609
colorswatch:disabled overlay {
3610
box-shadow: none;
3611
}
3612
3613
colorswatch#editor-color-sample {
3614
border-radius: 2.5px;
3615
}
3616
3617
colorswatch#editor-color-sample overlay {
3618
border-radius: 2px;
3619
}
3620
3621
colorchooser .popover.osd {
3622
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3623
border-radius: 2px;
3624
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4);
3625
background-color: #FFFFFF;
3626
}
3627
3628
colorchooser .popover.osd:backdrop {
3629
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.4);
3630
}
3631
3632
/********
3633
* Misc *
3634
********/
3635
.content-view {
3636
background-color: #F5F5F5;
3637
}
3638
3639
/**********************
3640
* Window Decorations *
3641
**********************/
3642
decoration {
3643
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3644
border-radius: 2px 2px 0 0;
3645
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent;
3646
margin: 8px;
3647
}
3648
3649
decoration:backdrop {
3650
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent;
3651
}
3652
3653
.maximized decoration,
3654
.fullscreen decoration,
3655
.tiled decoration {
3656
border-radius: 0;
3657
}
3658
3659
.popup decoration {
3660
box-shadow: none;
3661
}
3662
3663
.ssd decoration {
3664
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16);
3665
}
3666
3667
.csd.popup decoration {
3668
border-radius: 2px;
3669
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3670
}
3671
3672
tooltip.csd decoration {
3673
border-radius: 2px;
3674
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3675
}
3676
3677
messagedialog.csd decoration {
3678
border-radius: 2px;
3679
}
3680
3681
.solid-csd decoration {
3682
margin: 0;
3683
border-radius: 0;
3684
box-shadow: none;
3685
background-color: #455A64;
3686
}
3687
3688
.view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3689
entry selection, modelbutton.flat:selected,
3690
.menuitem.button.flat:selected, popover.background.menu button:checked,
3691
popover.background button.model:checked, row:selected, calendar:selected, text:selected, .budgie-menu button:checked {
3692
background-color: #42A5F5;
3693
}
3694
3695
row:selected label, label:selected, .view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3696
entry selection, modelbutton.flat:selected,
3697
.menuitem.button.flat:selected, popover.background.menu button:checked,
3698
popover.background button.model:checked, row:selected, calendar:selected, text:selected, .budgie-menu button:checked {
3699
color: #FFFFFF;
3700
}
3701
3702
row:selected label:disabled, label:disabled:selected, .view selection:disabled, .view:disabled:selected, flowbox flowboxchild:disabled:selected, label:disabled selection, spinbutton:not(.vertical) selection:disabled,
3703
entry selection:disabled, modelbutton.flat:disabled:selected,
3704
.menuitem.button.flat:disabled:selected, popover.background.menu button:disabled:checked,
3705
popover.background button.model:disabled:checked, row:disabled:selected, calendar:disabled:selected, text:disabled:selected, .budgie-menu button:disabled:checked {
3706
color: rgba(255, 255, 255, 0.5);
3707
}
3708
3709
.monospace {
3710
font-family: monospace;
3711
}
3712
3713
/**********************
3714
* Touch Copy & Paste *
3715
**********************/
3716
cursor-handle {
3717
border-radius: 9999px;
3718
background-color: #FF4081;
3719
background-image: none;
3720
}
3721
3722
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) {
3723
padding-left: 6px;
3724
border-top-right-radius: 0;
3725
}
3726
3727
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) {
3728
padding-right: 6px;
3729
border-top-left-radius: 0;
3730
}
3731
3732
cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) {
3733
-GtkWidget-text-handle-width: 24;
3734
-GtkWidget-text-handle-height: 30;
3735
-gtk-icon-source: -gtk-scaled(url("assets/scale-horz-marks-before-slider.png"), url("assets/scale-horz-marks-before-slider@2.png"));
3736
}
3737
3738
.context-menu {
3739
font: initial;
3740
}
3741
3742
.keycap {
3743
min-width: 12px;
3744
min-height: 26px;
3745
margin-top: 2px;
3746
padding-bottom: 2px;
3747
padding-left: 8px;
3748
padding-right: 8px;
3749
border: solid 1px rgba(0, 0, 0, 0.1);
3750
border-radius: 3px;
3751
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.1);
3752
background-color: #FFFFFF;
3753
color: rgba(0, 0, 0, 0.87);
3754
font-size: smaller;
3755
}
3756
3757
:not(decoration):not(window):drop(active) {
3758
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
3759
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 0 0 2px #FF4081;
3760
caret-color: #FF4081;
3761
}
3762
3763
stackswitcher button.text-button {
3764
min-width: 100px;
3765
}
3766
3767
stackswitcher button.circular,
3768
stackswitcher button.text-button.circular {
3769
min-width: 32px;
3770
min-height: 32px;
3771
padding: 0;
3772
}
3773
3774
/************
3775
* Nautilus *
3776
************/
3777
.nautilus-window,
3778
.nautilus-window notebook,
3779
.nautilus-window notebook > stack {
3780
background-color: #FFFFFF;
3781
}
3782
3783
.nautilus-desktop.nautilus-canvas-item:not(:selected), .caja-desktop.caja-canvas-item:not(:selected) {
3784
color: #FFFFFF;
3785
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3786
}
3787
3788
@keyframes needs_attention_keyframes {
3789
to {
3790
background-color: alpha(currentColor, 0.3);
3791
}
3792
}
3793
3794
.nautilus-operations-button-needs-attention {
3795
animation: needs_attention_keyframes 0.3s cubic-bezier(0.4, 0, 0.2, 1) 2 alternate;
3796
}
3797
3798
.nautilus-operations-button-needs-attention-multiple {
3799
animation: needs_attention_keyframes 0.3s cubic-bezier(0.4, 0, 0.2, 1) 4 alternate;
3800
}
3801
3802
.nautilus-window .floating-bar {
3803
min-height: 32px;
3804
padding: 0;
3805
border-style: solid solid none;
3806
border-width: 1px;
3807
border-color: rgba(0, 0, 0, 0.1);
3808
border-radius: 3px 3px 0 0;
3809
background-color: #FFFFFF;
3810
background-clip: padding-box;
3811
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), border-width 0;
3812
}
3813
3814
.nautilus-window .floating-bar.bottom.left {
3815
margin-right: 7px;
3816
border-left-style: none;
3817
border-top-left-radius: 0;
3818
}
3819
3820
.nautilus-window .floating-bar.bottom.right {
3821
margin-left: 7px;
3822
border-right-style: none;
3823
border-top-right-radius: 0;
3824
}
3825
3826
.nautilus-window .floating-bar button {
3827
margin: 6px;
3828
}
3829
3830
.disk-space-display.unknown {
3831
background-color: #FF6D00;
3832
}
3833
3834
.disk-space-display.used {
3835
background-color: #42A5F5;
3836
}
3837
3838
.disk-space-display.free {
3839
background-color: rgba(0, 0, 0, 0.12);
3840
}
3841
3842
.nautilus-window searchbar {
3843
border-top: 1px solid rgba(0, 0, 0, 0.1);
3844
}
3845
3846
.nautilus-window .searchbar-container {
3847
margin-top: -1px;
3848
}
3849
3850
.nautilus-window paned > separator {
3851
background-color: #F5F5F5;
3852
}
3853
3854
/*********
3855
* gedit *
3856
*********/
3857
.open-document-selector-name-label {
3858
font-weight: bold;
3859
}
3860
3861
.open-document-selector-path-label {
3862
color: rgba(0, 0, 0, 0.54);
3863
font-size: smaller;
3864
}
3865
3866
.open-document-selector-path-label:selected {
3867
color: rgba(255, 255, 255, 0.7);
3868
}
3869
3870
.gedit-document-panel {
3871
background-color: #FAFAFA;
3872
}
3873
3874
.gedit-document-panel row button.flat {
3875
margin-top: 8px;
3876
margin-bottom: 8px;
3877
}
3878
3879
.gedit-document-panel-group-row:not(:first-child) {
3880
border-top: 1px solid rgba(0, 0, 0, 0.1);
3881
}
3882
3883
.gedit-side-panel-paned statusbar {
3884
border-top: 1px solid rgba(0, 0, 0, 0.1);
3885
}
3886
3887
.gedit-search-slider {
3888
margin: 4px 4px 8px;
3889
}
3890
3891
.gedit-search-slider entry:dir(ltr), .gedit-search-slider entry:dir(rtl) {
3892
border-radius: 2px;
3893
}
3894
3895
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag, .gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
3896
all: unset;
3897
color: rgba(0, 0, 0, 0.38);
3898
}
3899
3900
.gedit-search-slider entry:dir(ltr) {
3901
margin-right: -58px;
3902
padding-right: 58px;
3903
}
3904
3905
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag {
3906
margin-left: 6px;
3907
}
3908
3909
.gedit-search-slider entry:dir(ltr) image.right {
3910
margin-right: 0;
3911
}
3912
3913
.gedit-search-slider entry:dir(rtl) {
3914
margin-left: -58px;
3915
padding-left: 58px;
3916
}
3917
3918
.gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
3919
margin-right: 6px;
3920
}
3921
3922
.gedit-search-slider entry:dir(rtl) image.left {
3923
margin-left: 0;
3924
}
3925
3926
.gedit-search-slider entry.error ~ button {
3927
color: rgba(255, 255, 255, 0.7);
3928
}
3929
3930
.gedit-search-slider entry.error ~ button:hover, .gedit-search-slider entry.error ~ button:active {
3931
color: #FFFFFF;
3932
}
3933
3934
.gedit-search-slider entry.error ~ button:disabled {
3935
color: rgba(255, 255, 255, 0.3);
3936
}
3937
3938
.gedit-search-slider button {
3939
border: solid 6px transparent;
3940
}
3941
3942
.gedit-search-slider button:last-child:dir(ltr), .gedit-search-slider button:not(:first-child):dir(rtl) {
3943
margin-left: -3px;
3944
}
3945
3946
.gedit-search-slider button:first-child:dir(rtl), .gedit-search-slider button:not(:last-child):dir(ltr) {
3947
margin-right: -3px;
3948
}
3949
3950
frame.gedit-map-frame > border:dir(ltr) {
3951
border-style: none none none solid;
3952
}
3953
3954
frame.gedit-map-frame > border:dir(rtl) {
3955
border-style: none solid none none;
3956
}
3957
3958
/**************
3959
* Tweak Tool *
3960
**************/
3961
.tweak-categories {
3962
background-image: image(#FAFAFA);
3963
}
3964
3965
.tweak {
3966
padding: 3px;
3967
}
3968
3969
.tweak.title:hover {
3970
box-shadow: none;
3971
}
3972
3973
.tweak-group-white,
3974
.tweak-white,
3975
.tweak-white:hover {
3976
background-image: image(#FFFFFF);
3977
}
3978
3979
.tweak-startup,
3980
.tweak-startup:hover {
3981
background-image: image(#FFFFFF);
3982
}
3983
3984
.tweak-group-startup {
3985
background-image: image(#FFFFFF);
3986
border: 1px solid rgba(0, 0, 0, 0.1);
3987
}
3988
3989
/***********
3990
* Builder *
3991
***********/
3992
workbench stack.titlebar {
3993
padding: 0;
3994
}
3995
3996
workbench:not(.tiled):not(.maximized):not(.fullscreen) stack.titlebar headerbar {
3997
border-radius: 2px 2px 0 0;
3998
}
3999
4000
perspectiveswitcher {
4001
background-color: #F5F5F5;
4002
}
4003
4004
perspectiveswitcher button:checked {
4005
color: #42A5F5;
4006
}
4007
4008
layouttabbar {
4009
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4010
background-color: #F5F5F5;
4011
}
4012
4013
layouttabbar > box > button {
4014
margin: 4px 0;
4015
}
4016
4017
layouttab {
4018
margin: 0 8px;
4019
border-style: none solid;
4020
border-width: 1px;
4021
border-color: rgba(0, 0, 0, 0.1);
4022
box-shadow: inset 0 -2px #42A5F5;
4023
background-color: #FFFFFF;
4024
}
4025
4026
layouttab separator.vertical {
4027
margin: 8px 4px;
4028
}
4029
4030
layouttab button.text-button, layouttab button.image-button, layouttab button {
4031
margin-top: 8px;
4032
margin-bottom: 8px;
4033
padding: 0 4px;
4034
}
4035
4036
layout {
4037
border: 1px solid rgba(0, 0, 0, 0.1);
4038
-PnlDockBin-handle-size: 1;
4039
}
4040
4041
entry.search-missing {
4042
background-color: #DD2C00;
4043
color: #FFFFFF;
4044
}
4045
4046
workbench treeview.image {
4047
color: rgba(0, 0, 0, 0.54);
4048
}
4049
4050
workbench treeview.image:selected {
4051
color: rgba(255, 255, 255, 0.7);
4052
}
4053
4054
dockbin {
4055
border: 1px solid rgba(0, 0, 0, 0.1);
4056
-PnlDockBin-handle-size: 1;
4057
}
4058
4059
dockpaned {
4060
border: 1px solid rgba(0, 0, 0, 0.1);
4061
}
4062
4063
eggsearchbar box.search-bar {
4064
padding: 0 8px;
4065
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4066
background-color: #F5F5F5;
4067
}
4068
4069
docktabstrip {
4070
padding: 0 8px;
4071
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4072
background-color: #F5F5F5;
4073
}
4074
4075
docktab {
4076
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
4077
min-height: 20px;
4078
min-width: 20px;
4079
margin-bottom: -1px;
4080
padding: 6px 6px;
4081
outline-offset: -6px;
4082
border-width: 1px;
4083
border-color: transparent;
4084
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 10%, transparent 0%);
4085
background-repeat: no-repeat;
4086
background-position: center;
4087
background-size: 0% 0%;
4088
color: rgba(0, 0, 0, 0.54);
4089
font-weight: 500;
4090
}
4091
4092
docktab:hover {
4093
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.26);
4094
color: rgba(0, 0, 0, 0.87);
4095
}
4096
4097
docktab:checked {
4098
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0.3s cubic-bezier(0, 0, 0.2, 1), background-image 0.8s cubic-bezier(0, 0, 0.2, 1);
4099
box-shadow: inset 0 -2px #42A5F5;
4100
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
4101
background-size: 1000% 1000%;
4102
color: rgba(0, 0, 0, 0.87);
4103
}
4104
4105
dockoverlayedge {
4106
background-color: #F5F5F5;
4107
}
4108
4109
dockoverlayedge docktabstrip {
4110
padding: 0;
4111
border: none;
4112
}
4113
4114
dockoverlayedge.left-edge docktab:hover {
4115
box-shadow: inset -2px 0 rgba(0, 0, 0, 0.26);
4116
}
4117
4118
dockoverlayedge.left-edge docktab:checked {
4119
box-shadow: inset -2px 0 #42A5F5;
4120
}
4121
4122
dockoverlayedge.right-edge docktab:hover {
4123
box-shadow: inset 2px 0 rgba(0, 0, 0, 0.26);
4124
}
4125
4126
dockoverlayedge.right-edge docktab:checked {
4127
box-shadow: inset 2px 0 #42A5F5;
4128
}
4129
4130
pillbox {
4131
background-color: #F5F5F5;
4132
border-radius: 2px;
4133
}
4134
4135
buildperspective row {
4136
padding: 10px;
4137
}
4138
4139
layoutpane entry.search {
4140
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.1);
4141
background-color: #FFFFFF;
4142
}
4143
4144
editortweak entry.search {
4145
margin-bottom: -1px;
4146
box-shadow: none;
4147
}
4148
4149
frame.gb-search-frame {
4150
border-bottom-right-radius: 5px;
4151
}
4152
4153
.gb-search-entry-occurrences-tag {
4154
box-shadow: none;
4155
background-color: transparent;
4156
}
4157
4158
docktabstrip {
4159
min-height: 39px;
4160
}
4161
4162
workbench preferences preferencesgroup list entry {
4163
padding-top: 8px;
4164
padding-bottom: 8px;
4165
}
4166
4167
/**********
4168
* Photos *
4169
**********/
4170
GdMainIconView.content-view {
4171
-GdMainIconView-icon-size: 48;
4172
}
4173
4174
.documents-counter {
4175
margin: 8px;
4176
border-radius: 9999px;
4177
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
4178
background-color: #FF4081;
4179
color: #FFFFFF;
4180
font-weight: bold;
4181
}
4182
4183
.documents-scrolledwin.frame {
4184
border-style: none;
4185
}
4186
4187
.photos-fade-in {
4188
opacity: 1;
4189
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
4190
}
4191
4192
.photos-fade-out {
4193
opacity: 0;
4194
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
4195
}
4196
4197
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) {
4198
border-style: none none none solid;
4199
}
4200
4201
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(rtl) {
4202
border-style: none solid none none;
4203
}
4204
4205
/*********
4206
* Music *
4207
*********/
4208
.side-panel:dir(ltr) {
4209
border-style: solid;
4210
border-color: rgba(0, 0, 0, 0.1);
4211
}
4212
4213
.side-panel:dir(rtl) {
4214
border-style: solid;
4215
border-color: rgba(0, 0, 0, 0.1);
4216
}
4217
4218
.side-panel .view {
4219
background-image: image(#FAFAFA);
4220
}
4221
4222
.side-panel .view:hover {
4223
background-image: image(rgba(240, 240, 240, 0.9935));
4224
}
4225
4226
.side-panel .view:selected {
4227
background-image: image(#42A5F5);
4228
}
4229
4230
.side-panel .view:selected:hover {
4231
background-image: image(#4baaf6);
4232
}
4233
4234
.songs-list:hover {
4235
background-image: image(alpha(currentColor, 0.05));
4236
}
4237
4238
frame.documents-dropdown {
4239
margin: 8px;
4240
}
4241
4242
frame.documents-dropdown > border {
4243
border: none;
4244
}
4245
4246
box.vertical:not(.titlebar) > revealer > toolbar.search-bar {
4247
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4248
}
4249
4250
box.vertical:not(.titlebar) > revealer > toolbar.search-bar button > widget {
4251
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4252
}
4253
4254
/*********
4255
* To Do *
4256
*********/
4257
task-row {
4258
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
4259
margin: 0 -4px;
4260
}
4261
4262
task-row:hover {
4263
transition: none;
4264
}
4265
4266
task-row label {
4267
margin: 0 8px;
4268
}
4269
4270
task-row image {
4271
margin: 0 4px;
4272
}
4273
4274
task-list-view > box > revealer > box > button {
4275
min-height: 32px;
4276
margin: -4px;
4277
padding: 0 12px;
4278
}
4279
4280
task-list-view > box > revealer > box > button label {
4281
margin: 0 8px;
4282
}
4283
4284
task-list-view > box > revealer > box > button image {
4285
margin: 0 4px;
4286
}
4287
4288
/*******
4289
* eog *
4290
*******/
4291
#eog-thumb-nav scrolledwindow {
4292
border-top: none;
4293
}
4294
4295
#eog-thumb-nav button {
4296
-gtk-outline-radius: 2px;
4297
}
4298
4299
/*************
4300
* Evolution *
4301
*************/
4302
frame.taskbar > border {
4303
border-style: solid none none;
4304
}
4305
4306
box.vertical > paned.horizontal notebook widget .frame {
4307
border-style: none;
4308
}
4309
4310
/********
4311
* gitg *
4312
********/
4313
frame.commit-frame > border {
4314
border-style: solid none none;
4315
}
4316
4317
/**************
4318
* Characters *
4319
**************/
4320
box.dialog-vbox scrolledwindow.related {
4321
border: 1px solid rgba(0, 0, 0, 0.1);
4322
}
4323
4324
list.categories {
4325
background-image: image(#FAFAFA);
4326
}
4327
4328
/*********
4329
* Boxes *
4330
*********/
4331
.transparent-bg + stack overlay > label {
4332
min-height: 24px;
4333
padding: 0 4px;
4334
border-radius: 2px;
4335
background-color: rgba(0, 0, 0, 0.3);
4336
color: #FFFFFF;
4337
}
4338
4339
/**************
4340
* Calculator *
4341
**************/
4342
button.title label {
4343
min-height: 32px;
4344
}
4345
4346
/*********
4347
* Geary *
4348
*********/
4349
.geary-titlebar-left:dir(ltr) {
4350
margin-right: 5px;
4351
padding-right: 0;
4352
}
4353
4354
.geary-titlebar-left:dir(rtl) {
4355
margin-left: 5px;
4356
padding-left: 0;
4357
}
4358
4359
.geary-titlebar-left > separator {
4360
background-color: rgba(0, 0, 0, 0.05);
4361
}
4362
4363
.geary-titlebar-right:dir(ltr) {
4364
margin-left: -5px;
4365
}
4366
4367
.geary-titlebar-right:dir(rtl) {
4368
margin-right: -5px;
4369
}
4370
4371
/*********
4372
* Tilix *
4373
*********/
4374
overlay > revealer.left > scrolledwindow.frame,
4375
overlay > revealer.right > scrolledwindow.frame {
4376
border-style: none;
4377
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22);
4378
}
4379
4380
overlay > revealer.left > scrolledwindow.frame {
4381
margin-right: 32px;
4382
}
4383
4384
overlay > revealer.right > scrolledwindow.frame {
4385
margin-left: 32px;
4386
}
4387
4388
.terminix-session-sidebar,
4389
.tilix-session-sidebar {
4390
background-image: image(#FAFAFA);
4391
}
4392
4393
button.image-button.session-new-button {
4394
min-width: 28px;
4395
}
4396
4397
/***********
4398
* Eclipse *
4399
***********/
4400
window.background > box.vertical > scrolledwindow > widget toolbar {
4401
padding: 2px;
4402
}
4403
4404
window.background > box.vertical > scrolledwindow > widget toolbar separator,
4405
window.background > box.vertical > scrolledwindow > widget toolbar button {
4406
margin: 2px;
4407
}
4408
4409
window.background > box.vertical > scrolledwindow > widget toolbar button {
4410
border-radius: 2px;
4411
}
4412
4413
/***********
4414
* Firefox *
4415
***********/
4416
window.background:not(.csd) > widget > separator {
4417
color: rgba(0, 0, 0, 0.2);
4418
}
4419
4420
window.background:not(.csd) > widget > scrollbar {
4421
background-clip: border-box;
4422
}
4423
4424
window.background:not(.csd) > widget > scrollbar,
4425
window.background:not(.csd) > widget > frame > border {
4426
border-color: rgba(0, 0, 0, 0.2);
4427
}
4428
4429
window.background:not(.csd) > widget > entry,
4430
window.background:not(.csd) > widget > button > button {
4431
border: 1px solid rgba(0, 0, 0, 0.2);
4432
border-radius: 3px;
4433
box-shadow: none;
4434
}
4435
4436
window.background:not(.csd) > widget > entry {
4437
min-height: 30px;
4438
}
4439
4440
window.background:not(.csd) > widget > entry:focus {
4441
border-color: #42A5F5;
4442
}
4443
4444
window.background:not(.csd) > widget > button > button {
4445
padding: 4px 8px;
4446
background-size: auto;
4447
}
4448
4449
window.background:not(.csd) > widget > button > button:hover {
4450
background-image: image(alpha(currentColor, 0.05));
4451
}
4452
4453
window.background:not(.csd) > widget > button > button:active {
4454
background-image: image(alpha(currentColor, 0.1));
4455
}
4456
4457
window.background:not(.csd) > window > menu,
4458
window.background:not(.csd) > menu > menu {
4459
border: none;
4460
}
4461
4462
window.background:not(.csd) > widget > menubar {
4463
color: rgba(255, 255, 255, 0.7);
4464
}
4465
4466
window.background:not(.csd) > widget > menubar:hover {
4467
color: #FFFFFF;
4468
}
4469
4470
window.background:not(.csd) > widget > menubar:disabled {
4471
color: rgba(255, 255, 255, 0.3);
4472
}
4473
4474
window.background:not(.csd) > widget > frame {
4475
color: rgba(0, 0, 0, 0.2);
4476
}
4477
4478
window.background:not(.csd) > widget > checkbutton > check,
4479
window.background:not(.csd) > widget > radiobutton > radio {
4480
margin: 0;
4481
padding: 0;
4482
}
4483
4484
window.background:not(.csd) > window.background > menu > separator {
4485
color: rgba(0, 0, 0, 0.1);
4486
}
4487
4488
/***********
4489
* Synapse *
4490
***********/
4491
box.vertical > widget > widget:selected {
4492
background-color: #42A5F5;
4493
}
4494
4495
/*********
4496
* Unity *
4497
*********/
4498
UnityDecoration {
4499
-UnityDecoration-extents: 28px 0 0 0;
4500
-UnityDecoration-input-extents: 8px;
4501
-UnityDecoration-shadow-offset-x: 0;
4502
-UnityDecoration-shadow-offset-y: 3px;
4503
-UnityDecoration-active-shadow-color: rgba(0, 0, 0, 0.48);
4504
-UnityDecoration-active-shadow-radius: 18px;
4505
-UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32);
4506
-UnityDecoration-inactive-shadow-radius: 6px;
4507
-UnityDecoration-glow-size: 8px;
4508
-UnityDecoration-glow-color: #42A5F5;
4509
-UnityDecoration-title-indent: 4px;
4510
-UnityDecoration-title-fade: 32px;
4511
-UnityDecoration-title-alignment: 0.0;
4512
}
4513
4514
UnityDecoration .top {
4515
padding: 0 2px;
4516
border-style: none;
4517
border-radius: 2px 2px 0 0;
4518
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
4519
background-color: #37474F;
4520
color: #FFFFFF;
4521
}
4522
4523
UnityDecoration .top:backdrop {
4524
color: rgba(255, 255, 255, 0.7);
4525
}
4526
4527
UnityDecoration .menuitem {
4528
color: rgba(255, 255, 255, 0.7);
4529
}
4530
4531
UnityDecoration .menuitem:hover {
4532
box-shadow: inset 0 -2px currentColor;
4533
background-color: transparent;
4534
color: #FFFFFF;
4535
}
4536
4537
.background:not(.csd) headerbar:not(.titlebar) {
4538
border-radius: 0;
4539
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
4540
}
4541
4542
.background:not(.csd) headerbar:not(.titlebar).inline-toolbar {
4543
border-style: none;
4544
}
4545
4546
UnityPanelWidget,
4547
.unity-panel {
4548
background-color: #263238;
4549
color: #FFFFFF;
4550
}
4551
4552
UnityPanelWidget:backdrop,
4553
.unity-panel:backdrop {
4554
color: rgba(255, 255, 255, 0.7);
4555
}
4556
4557
.unity-panel.menuitem,
4558
.unity-panel .menuitem {
4559
color: rgba(255, 255, 255, 0.7);
4560
}
4561
4562
.unity-panel.menubar.menuitem:hover,
4563
.unity-panel.menubar .menuitem *:hover {
4564
box-shadow: inset 0 -2px currentColor;
4565
background-color: transparent;
4566
color: #FFFFFF;
4567
}
4568
4569
.menu IdoPlaybackMenuItem.menuitem:active {
4570
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
4571
animation: spin 1s linear infinite;
4572
color: #42A5F5;
4573
}
4574
4575
/**************
4576
* Mate-Panel *
4577
**************/
4578
.mate-panel-menu-bar menubar,
4579
#PanelApplet-window-menu-applet-button {
4580
background-color: transparent;
4581
}
4582
4583
#PanelPlug,
4584
PanelToplevel.background {
4585
background-color: #263238;
4586
color: #FFFFFF;
4587
font-weight: 500;
4588
}
4589
4590
PanelToplevel > grid > button, .mate-panel-menu-bar #PanelApplet button {
4591
color: rgba(255, 255, 255, 0.7);
4592
}
4593
4594
PanelToplevel > grid > button:hover, .mate-panel-menu-bar #PanelApplet button:hover, PanelToplevel > grid > button:active, .mate-panel-menu-bar #PanelApplet button:active {
4595
color: #FFFFFF;
4596
}
4597
4598
PanelToplevel > grid > button:disabled, .mate-panel-menu-bar #PanelApplet button:disabled {
4599
color: rgba(255, 255, 255, 0.3);
4600
}
4601
4602
PanelToplevel > grid > button:checked, .mate-panel-menu-bar #PanelApplet button:checked {
4603
background-color: rgba(255, 255, 255, 0.3);
4604
color: #FFFFFF;
4605
}
4606
4607
PanelToplevel > grid > button:checked:disabled, .mate-panel-menu-bar #PanelApplet button:checked:disabled {
4608
background-color: rgba(255, 255, 255, 0.12);
4609
color: rgba(255, 255, 255, 0.5);
4610
}
4611
4612
PanelToplevel > grid > button {
4613
padding: 0 4px;
4614
border-radius: 0;
4615
}
4616
4617
PanelWidget button, PanelWidget button:hover, PanelWidget button:active {
4618
color: rgba(255, 255, 255, 0.7);
4619
}
4620
4621
PanelSeparator {
4622
color: rgba(255, 255, 255, 0.12);
4623
}
4624
4625
MatePanelAppletFrameDBus {
4626
border-style: solid;
4627
border-width: 0 1px;
4628
border-color: rgba(255, 255, 255, 0.12);
4629
}
4630
4631
.mate-panel-menu-bar menubar menuitem {
4632
padding: 4px;
4633
}
4634
4635
.mate-panel-menu-bar menubar menu menuitem {
4636
padding: 6px;
4637
}
4638
4639
.mate-panel-menu-bar #PanelApplet button {
4640
-GtkWidget-window-dragging: true;
4641
padding: 4px;
4642
border-radius: 0;
4643
}
4644
4645
PanelApplet.wnck-applet .wnck-pager {
4646
background-color: transparent;
4647
color: #40C4FF;
4648
}
4649
4650
PanelApplet.wnck-applet .wnck-pager:hover {
4651
background-color: rgba(255, 255, 255, 0.12);
4652
}
4653
4654
PanelApplet.wnck-applet .wnck-pager:active {
4655
background-color: rgba(255, 255, 255, 0.3);
4656
}
4657
4658
PanelApplet.wnck-applet .wnck-pager:selected {
4659
background-color: #42A5F5;
4660
}
4661
4662
#MatePanelPopupWindow {
4663
border: 1px solid rgba(0, 0, 0, 0.1);
4664
border-radius: 3px;
4665
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
4666
}
4667
4668
#MatePanelPopupWindow frame > border {
4669
border-style: none;
4670
}
4671
4672
#MatePanelPopupWindow ClockMap {
4673
border: 1px solid rgba(0, 0, 0, 0.1);
4674
}
4675
4676
na-tray-applet {
4677
-NaTrayApplet-icon-padding: 3px;
4678
-NaTrayApplet-icon-size: 16;
4679
}
4680
4681
.mate-panel-menu-bar {
4682
-PanelMenuBar-icon-visible: true;
4683
}
4684
4685
.mate-panel-applet-slider {
4686
background-color: transparent;
4687
}
4688
4689
.mate-panel-applet-slider frame {
4690
border: 1px solid rgba(0, 0, 0, 0.1);
4691
border-radius: 3px;
4692
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
4693
background-color: #F5F5F5;
4694
}
4695
4696
.mate-panel-applet-slider frame frame {
4697
all: unset;
4698
}
4699
4700
.mate-panel-applet-slider frame > border {
4701
border-style: none;
4702
}
4703
4704
/*********************
4705
* CAJA File manager *
4706
*********************/
4707
.caja-navigation-window button.toggle.image-button {
4708
border-radius: 2px;
4709
}
4710
4711
.caja-pathbar button {
4712
margin: 0 -1px 0 -2px;
4713
}
4714
4715
.caja-pathbar button > widget {
4716
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4717
-GtkArrow-arrow-scaling: 1;
4718
}
4719
4720
.caja-side-pane notebook viewport.frame,
4721
.caja-side-pane notebook widget .vertical {
4722
background-color: #FFFFFF;
4723
}
4724
4725
.caja-side-pane notebook,
4726
.caja-notebook {
4727
border-top: 1px solid rgba(0, 0, 0, 0.1);
4728
}
4729
4730
.caja-side-pane notebook .frame,
4731
.caja-notebook .frame {
4732
border-style: none;
4733
}
4734
4735
.caja-navigation-window statusbar {
4736
margin: 0 -10px;
4737
padding: 0 4px;
4738
border-top: 1px solid rgba(0, 0, 0, 0.1);
4739
}
4740
4741
.caja-notebook frame > border {
4742
border-style: none;
4743
}
4744
4745
#caja-extra-view-widget {
4746
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4747
background-color: #F5F5F5;
4748
}
4749
4750
#caja-extra-view-widget > box > box > label {
4751
font-weight: bold;
4752
}
4753
4754
/*********
4755
* Pluma *
4756
*********/
4757
.pluma-window statusbar {
4758
margin: 0 -10px;
4759
padding: 0 4px;
4760
border-top: 1px solid rgba(0, 0, 0, 0.1);
4761
}
4762
4763
.pluma-window statusbar frame > border {
4764
border-style: none;
4765
}
4766
4767
.pluma-window statusbar frame button.flat {
4768
padding: 0 4px;
4769
border-radius: 0;
4770
}
4771
4772
.pluma-window statusbar frame button.flat widget {
4773
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4774
-GtkArrow-arrow-scaling: 1;
4775
}
4776
4777
.pluma-print-preview toolbar {
4778
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4779
}
4780
4781
.pluma-window paned.horizontal box.vertical box.horizontal button.flat {
4782
margin: 1px;
4783
}
4784
4785
.pluma-window paned.horizontal box.vertical .frame {
4786
border-style: none;
4787
}
4788
4789
.pluma-window paned.horizontal box.vertical notebook.frame {
4790
margin-top: -1px;
4791
border-top: 1px solid rgba(0, 0, 0, 0.1);
4792
}
4793
4794
.pluma-window paned.horizontal box.vertical notebook.frame box.vertical toolbar.horizontal {
4795
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4796
}
4797
4798
/*********
4799
* Atril *
4800
*********/
4801
.atril-window paned.horizontal box.vertical .frame {
4802
border-style: none;
4803
}
4804
4805
.atril-window paned.horizontal box.vertical notebook .frame {
4806
border-top: 1px solid rgba(0, 0, 0, 0.1);
4807
}
4808
4809
/* mate-screensaver lock dialog */
4810
.lock-dialog {
4811
border-radius: 2px;
4812
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), inset 0 1px rgba(255, 255, 255, 0.4);
4813
}
4814
4815
.lock-dialog frame > border {
4816
border-style: none;
4817
}
4818
4819
/******************
4820
* Budgie Desktop *
4821
******************/
4822
.budgie-container {
4823
background-color: transparent;
4824
}
4825
4826
.budgie-menu.background {
4827
padding: 0;
4828
background-color: #FFFFFF;
4829
}
4830
4831
.budgie-menu scrollbar,
4832
.budgie-menu entry.search {
4833
background-color: transparent;
4834
}
4835
4836
.budgie-menu entry.search {
4837
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4838
border-radius: 0;
4839
box-shadow: none;
4840
font-size: 120%;
4841
}
4842
4843
.budgie-menu .categories:dir(ltr) {
4844
border-bottom-left-radius: 2px;
4845
}
4846
4847
.budgie-menu .categories:dir(rtl) {
4848
border-bottom-right-radius: 2px;
4849
}
4850
4851
.budgie-menu button {
4852
min-height: 32px;
4853
padding: 0 8px;
4854
border-radius: 0;
4855
color: rgba(0, 0, 0, 0.87);
4856
font-weight: normal;
4857
}
4858
4859
.budgie-menu button:disabled {
4860
color: rgba(0, 0, 0, 0.38);
4861
}
4862
4863
.budgie-menu button:checked:disabled {
4864
background-color: #42A5F5;
4865
}
4866
4867
.budgie-menu row {
4868
padding: 0;
4869
}
4870
4871
.budgie-menu row:hover {
4872
box-shadow: none;
4873
}
4874
4875
button.budgie-menu-launcher {
4876
padding: 0 2px;
4877
}
4878
4879
popover.background.user-menu {
4880
padding: 8px;
4881
}
4882
4883
popover.background.user-menu .content-box {
4884
background-color: transparent;
4885
}
4886
4887
popover.background.user-menu separator {
4888
margin: 4px 0;
4889
}
4890
4891
popover.background.user-menu row {
4892
padding: 0;
4893
box-shadow: none;
4894
background-image: none;
4895
}
4896
4897
button.raven-trigger {
4898
padding: 0 4px;
4899
}
4900
4901
popover.background.places-menu {
4902
padding: 8px;
4903
}
4904
4905
popover.background.places-menu .name-button.text-button {
4906
padding-left: 8px;
4907
padding-right: 8px;
4908
}
4909
4910
popover.background.places-menu .name-button.text-button image:dir(ltr) {
4911
margin-right: 3px;
4912
}
4913
4914
popover.background.places-menu .name-button.text-button image:dir(rtl) {
4915
margin-left: 3px;
4916
}
4917
4918
popover.background.places-menu .places-section-header > image:dir(ltr) {
4919
margin: 0 -2px 0 5px;
4920
}
4921
4922
popover.background.places-menu .places-section-header > image:dir(rtl) {
4923
margin: 0 5px 0 -2px;
4924
}
4925
4926
popover.background.places-menu .places-list {
4927
margin-top: 4px;
4928
padding-top: 4px;
4929
border-top: 1px solid rgba(0, 0, 0, 0.1);
4930
background-color: transparent;
4931
}
4932
4933
popover.background.places-menu row {
4934
padding: 0;
4935
box-shadow: none;
4936
background-image: none;
4937
}
4938
4939
.budgie-panel {
4940
background-color: #263238;
4941
color: rgba(255, 255, 255, 0.7);
4942
font-weight: 500;
4943
}
4944
4945
.budgie-panel button {
4946
border-radius: 0;
4947
}
4948
4949
.budgie-panel separator {
4950
background-color: rgba(255, 255, 255, 0.3);
4951
}
4952
4953
.budgie-panel .alert {
4954
color: #FF5252;
4955
}
4956
4957
.budgie-panel #tasklist-button {
4958
padding: 0 4px;
4959
}
4960
4961
.budgie-panel #tasklist-button:checked {
4962
background-color: rgba(255, 255, 255, 0.12);
4963
}
4964
4965
.budgie-panel button.flat.launcher {
4966
padding: 0;
4967
}
4968
4969
.budgie-panel button.flat.launcher:checked {
4970
background-color: rgba(255, 255, 255, 0.12);
4971
}
4972
4973
.budgie-panel button.flat.launcher:not(:checked) {
4974
color: rgba(255, 255, 255, 0.5);
4975
}
4976
4977
.budgie-panel button.flat.launcher:not(:checked):hover, .budgie-panel button.flat.launcher:not(:checked):active {
4978
color: rgba(255, 255, 255, 0.7);
4979
}
4980
4981
.budgie-panel button.flat.launcher:not(:checked):disabled {
4982
color: rgba(255, 255, 255, 0.3);
4983
}
4984
4985
.top .budgie-panel #tasklist-button, .budgie-panel .top #tasklist-button, .top .budgie-panel button.flat.launcher, .budgie-panel .top button.flat.launcher {
4986
border-image: radial-gradient(circle closest-corner at center calc(1px), currentColor 0%, transparent 0%) 0 0 0 0/0 0 0 0;
4987
}
4988
4989
.top .budgie-panel #tasklist-button:checked, .budgie-panel .top #tasklist-button:checked, .top .budgie-panel button.flat.launcher:checked, .budgie-panel .top button.flat.launcher:checked, .top .budgie-panel .unpinned button.flat.launcher, .budgie-panel .unpinned .top button.flat.launcher, .top
4990
.budgie-panel .pinned button.flat.launcher.running,
4991
.budgie-panel .pinned .top button.flat.launcher.running {
4992
border-image: radial-gradient(circle closest-corner at center calc(1px), currentColor 100%, transparent 0%) 2 0 0 0/2px 0 0 0;
4993
}
4994
4995
.bottom .budgie-panel #tasklist-button, .budgie-panel .bottom #tasklist-button, .bottom .budgie-panel button.flat.launcher, .budgie-panel .bottom button.flat.launcher {
4996
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0 0/0 0 0 0;
4997
}
4998
4999
.bottom .budgie-panel #tasklist-button:checked, .budgie-panel .bottom #tasklist-button:checked, .bottom .budgie-panel button.flat.launcher:checked, .budgie-panel .bottom button.flat.launcher:checked, .bottom .budgie-panel .unpinned button.flat.launcher, .budgie-panel .unpinned .bottom button.flat.launcher, .bottom
5000
.budgie-panel .pinned button.flat.launcher.running,
5001
.budgie-panel .pinned .bottom button.flat.launcher.running {
5002
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2 0/0 0 2px 0;
5003
}
5004
5005
.left .budgie-panel #tasklist-button, .budgie-panel .left #tasklist-button, .left .budgie-panel button.flat.launcher, .budgie-panel .left button.flat.launcher {
5006
border-image: radial-gradient(circle closest-corner at calc(1px) center, currentColor 0%, transparent 0%) 0 0 0 0/0 0 0 0;
5007
}
5008
5009
.left .budgie-panel #tasklist-button:checked, .budgie-panel .left #tasklist-button:checked, .left .budgie-panel button.flat.launcher:checked, .budgie-panel .left button.flat.launcher:checked, .left .budgie-panel .unpinned button.flat.launcher, .budgie-panel .unpinned .left button.flat.launcher, .left
5010
.budgie-panel .pinned button.flat.launcher.running,
5011
.budgie-panel .pinned .left button.flat.launcher.running {
5012
border-image: radial-gradient(circle closest-corner at calc(1px) center, currentColor 100%, transparent 0%) 0 2 0 0/0 2px 0 0;
5013
}
5014
5015
.right .budgie-panel #tasklist-button, .budgie-panel .right #tasklist-button, .right .budgie-panel button.flat.launcher, .budgie-panel .right button.flat.launcher {
5016
border-image: radial-gradient(circle closest-corner at calc(100% - 1px) center, currentColor 0%, transparent 0%) 0 0 0 0/0 0 0 0;
5017
}
5018
5019
.right .budgie-panel #tasklist-button:checked, .budgie-panel .right #tasklist-button:checked, .right .budgie-panel button.flat.launcher:checked, .budgie-panel .right button.flat.launcher:checked, .right .budgie-panel .unpinned button.flat.launcher, .budgie-panel .unpinned .right button.flat.launcher, .right
5020
.budgie-panel .pinned button.flat.launcher.running,
5021
.budgie-panel .pinned .right button.flat.launcher.running {
5022
border-image: radial-gradient(circle closest-corner at calc(100% - 1px) center, currentColor 100%, transparent 0%) 0 0 0 2/0 0 0 2px;
5023
}
5024
5025
frame.raven-frame > border {
5026
border-style: none;
5027
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22);
5028
}
5029
5030
.top frame.raven-frame > border {
5031
margin-bottom: 32px;
5032
}
5033
5034
.bottom frame.raven-frame > border {
5035
margin-top: 32px;
5036
}
5037
5038
.left frame.raven-frame > border {
5039
margin-right: 32px;
5040
}
5041
5042
.right frame.raven-frame > border {
5043
margin-left: 32px;
5044
}
5045
5046
.raven {
5047
background-color: #FAFAFA;
5048
}
5049
5050
.raven > stack {
5051
margin-bottom: -10px;
5052
}
5053
5054
.raven stackswitcher.linked > button {
5055
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FFA726 0%, transparent 0%) 0 0 0/0 0 0px;
5056
border-radius: 0;
5057
}
5058
5059
.raven stackswitcher.linked > button:checked {
5060
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FFA726 100%, transparent 0%) 0 0 2/0 0 2px;
5061
background-color: transparent;
5062
}
5063
5064
.raven .raven-header {
5065
min-height: 32px;
5066
padding: 3px;
5067
}
5068
5069
.raven .raven-header:not(.top) {
5070
margin-top: -6px;
5071
}
5072
5073
.raven .raven-header.top {
5074
padding: 2px 0;
5075
background-color: #42A5F5;
5076
color: #FFFFFF;
5077
}
5078
5079
.raven .raven-header.top stackswitcher button {
5080
margin: -6px 0;
5081
min-height: 32px;
5082
}
5083
5084
.raven .raven-header.top button.image-button:dir(ltr) {
5085
margin-right: 2px;
5086
}
5087
5088
.raven .raven-header.top button.image-button:dir(rtl) {
5089
margin-left: 2px;
5090
}
5091
5092
.raven .raven-header.top > image {
5093
margin: 0 8px;
5094
}
5095
5096
.raven .raven-header.top > label {
5097
margin: 0 -8px;
5098
font-weight: bold;
5099
}
5100
5101
.raven .raven-header.bottom {
5102
border-top: 1px solid rgba(0, 0, 0, 0.1);
5103
}
5104
5105
.raven viewport.frame .raven-header {
5106
margin-top: -8px;
5107
}
5108
5109
.raven .raven-background {
5110
border-style: solid none;
5111
border-width: 1px;
5112
border-color: rgba(0, 0, 0, 0.1);
5113
background-color: #FFFFFF;
5114
}
5115
5116
.raven .raven-background.frame {
5117
border-style: solid none;
5118
}
5119
5120
.raven .raven-background > overlay > widget > image {
5121
color: rgba(0, 0, 0, 0.12);
5122
}
5123
5124
.raven .raven-background grid > label:first-child {
5125
min-height: 32px;
5126
}
5127
5128
.raven scrolledwindow.raven-background {
5129
border-bottom-style: none;
5130
}
5131
5132
.raven .raven-header.top + .raven-background {
5133
border-style: none;
5134
background-color: #42A5F5;
5135
color: #FFFFFF;
5136
}
5137
5138
.raven .raven-header.top + .raven-background stackswitcher button {
5139
margin: -4px 0;
5140
}
5141
5142
.raven .powerstrip button {
5143
margin: 2px 0 1px;
5144
padding: 10px;
5145
}
5146
5147
.raven .option-subtitle {
5148
font-size: smaller;
5149
}
5150
5151
calendar.raven-calendar {
5152
border-style: none;
5153
background-color: transparent;
5154
}
5155
5156
calendar.raven-calendar:selected {
5157
border-radius: 2px;
5158
background-color: #42A5F5;
5159
}
5160
5161
.raven-mpris {
5162
background-color: rgba(0, 0, 0, 0.6);
5163
color: #FFFFFF;
5164
}
5165
5166
.raven-mpris label {
5167
min-height: 24px;
5168
}
5169
5170
.raven-mpris button.image-button {
5171
padding: 10px;
5172
}
5173
5174
.budgie-notification-window, .budgie-osd-window, .budgie-switcher-window {
5175
background-color: transparent;
5176
}
5177
5178
.budgie-notification .notification-title, .budgie-switcher .notification-title {
5179
font-size: 120%;
5180
}
5181
5182
.budgie-osd .budgie-osd-text {
5183
font-size: 120%;
5184
}
5185
5186
.drop-shadow {
5187
margin: 5px 9px;
5188
padding: 3px;
5189
border-radius: 2px;
5190
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4);
5191
background-color: #FAFAFA;
5192
}
5193
5194
.drop-shadow .linked > button {
5195
border-radius: 2px;
5196
}
5197
5198
.budgie-session-dialog, .budgie-polkit-dialog, .budgie-run-dialog {
5199
border-radius: 2px;
5200
background-color: #FAFAFA;
5201
}
5202
5203
.budgie-session-dialog decoration, .budgie-polkit-dialog decoration, .budgie-run-dialog decoration {
5204
border-radius: 2px;
5205
}
5206
5207
.budgie-session-dialog label:not(:last-child),
5208
.budgie-session-dialog .dialog-title {
5209
font-size: 120%;
5210
}
5211
5212
.budgie-session-dialog .linked.horizontal > button {
5213
padding: 8px 16px;
5214
border-top: 1px solid rgba(0, 0, 0, 0.1);
5215
border-radius: 0;
5216
}
5217
5218
.budgie-session-dialog .linked.horizontal > button:first-child {
5219
border-bottom-left-radius: 2px;
5220
}
5221
5222
.budgie-session-dialog .linked.horizontal > button:last-child {
5223
border-bottom-right-radius: 2px;
5224
}
5225
5226
.budgie-polkit-dialog .message {
5227
color: rgba(0, 0, 0, 0.38);
5228
}
5229
5230
.budgie-polkit-dialog .failure {
5231
color: #FF5252;
5232
}
5233
5234
.budgie-run-dialog {
5235
background-color: #FFFFFF;
5236
}
5237
5238
.budgie-run-dialog entry.search {
5239
font-size: 120%;
5240
padding: 6px 14px;
5241
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
5242
background-color: transparent;
5243
}
5244
5245
.budgie-run-dialog list .dim-label, .budgie-run-dialog list label.separator, .budgie-run-dialog list .titlebar:not(headerbar) .subtitle, .titlebar:not(headerbar) .budgie-run-dialog list .subtitle, .budgie-run-dialog list
5246
headerbar .subtitle,
5247
headerbar .budgie-run-dialog list .subtitle, .budgie-run-dialog list .budgie-notification .notification-body, .budgie-notification .budgie-run-dialog list .notification-body, .budgie-run-dialog list .budgie-switcher .notification-body, .budgie-switcher .budgie-run-dialog list .notification-body {
5248
opacity: 1;
5249
}
5250
5251
.budgie-run-dialog scrolledwindow {
5252
border-top: 1px solid rgba(0, 0, 0, 0.1);
5253
}
5254
5255
/************************
5256
* LightDM GTK+ Greeter *
5257
************************/
5258
#panel_window {
5259
background-color: rgba(0, 0, 0, 0.3);
5260
color: #FFFFFF;
5261
}
5262
5263
#panel_window menubar,
5264
#panel_window separator {
5265
background-color: transparent;
5266
}
5267
5268
#panel_window separator {
5269
padding: 0 4px;
5270
}
5271
5272
#panel_window separator:first-child {
5273
padding: 0 8px;
5274
}
5275
5276
#panel_window menubar > menuitem {
5277
color: rgba(255, 255, 255, 0.7);
5278
}
5279
5280
#panel_window menubar > menuitem:hover {
5281
color: #FFFFFF;
5282
}
5283
5284
#panel_window menubar > menuitem:disabled label {
5285
color: rgba(255, 255, 255, 0.3);
5286
}
5287
5288
#login_window,
5289
#shutdown_dialog,
5290
#restart_dialog {
5291
margin: 8px;
5292
border-radius: 2px;
5293
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 1px rgba(255, 255, 255, 0.4);
5294
background-color: #FAFAFA;
5295
}
5296
5297
#content_frame {
5298
padding-bottom: 20px;
5299
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
5300
}
5301
5302
#buttonbox_frame {
5303
padding-top: 24px;
5304
}
5305
5306
#buttonbox_frame button {
5307
margin: -16px;
5308
}
5309
5310
#greeter_infobar {
5311
margin-top: -1px;
5312
}
5313
5314
/* GTK NAMED COLORS
5315
----------------
5316
use responsibly! */
5317
/*
5318
widget text/foreground color */
5319
@define-color theme_fg_color rgba(0, 0, 0, 0.87);
5320
/*
5321
text color for entries, views and content in general */
5322
@define-color theme_text_color rgba(0, 0, 0, 0.87);
5323
/*
5324
widget base background color */
5325
@define-color theme_bg_color #F5F5F5;
5326
/*
5327
text widgets and the like base background color */
5328
@define-color theme_base_color #FFFFFF;
5329
/*
5330
base background color of selections */
5331
@define-color theme_selected_bg_color #42A5F5;
5332
/*
5333
text/foreground color of selections */
5334
@define-color theme_selected_fg_color #FFFFFF;
5335
/*
5336
base background color of insensitive widgets */
5337
@define-color insensitive_bg_color #F5F5F5;
5338
/*
5339
text foreground color of insensitive widgets */
5340
@define-color insensitive_fg_color rgba(0, 0, 0, 0.38);
5341
/*
5342
insensitive text widgets and the like base background color */
5343
@define-color insensitive_base_color #FAFAFA;
5344
/*
5345
widget text/foreground color on backdrop windows */
5346
@define-color theme_unfocused_fg_color rgba(0, 0, 0, 0.87);
5347
/*
5348
text color for entries, views and content in general on backdrop windows */
5349
@define-color theme_unfocused_text_color rgba(0, 0, 0, 0.87);
5350
/*
5351
widget base background color on backdrop windows */
5352
@define-color theme_unfocused_bg_color #F5F5F5;
5353
/*
5354
text widgets and the like base background color on backdrop windows */
5355
@define-color theme_unfocused_base_color #FFFFFF;
5356
/*
5357
base background color of selections on backdrop windows */
5358
@define-color theme_unfocused_selected_bg_color #42A5F5;
5359
/*
5360
text/foreground color of selections on backdrop windows */
5361
@define-color theme_unfocused_selected_fg_color #FFFFFF;
5362
/*
5363
insensitive color on backdrop windows */
5364
@define-color unfocused_insensitive_color rgba(0, 0, 0, 0.38);
5365
/*
5366
widgets main borders color */
5367
@define-color borders rgba(0, 0, 0, 0.1);
5368
/*
5369
widgets main borders color on backdrop windows */
5370
@define-color unfocused_borders rgba(0, 0, 0, 0.1);
5371
/*
5372
these are pretty self explicative */
5373
@define-color warning_color #FF6D00;
5374
@define-color error_color #DD2C00;
5375
@define-color success_color #00C853;
5376
/*
5377
FIXME this is really an API */
5378
@define-color content_view_bg #FFFFFF;
5379
@define-color placeholder_text_color #757575;
5380