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 • 149.76 kiB
ASCII text, with very long lines (671)
        
            
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 270ms cubic-bezier(0, 0, 0.2, 1), box-shadow 180ms 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 270ms 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 270ms cubic-bezier(0, 0, 0.2, 1), box-shadow 180ms 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 270ms 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 270ms cubic-bezier(0, 0, 0.2, 1), box-shadow 180ms 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 270ms 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 270ms cubic-bezier(0, 0, 0.2, 1), box-shadow 180ms cubic-bezier(0, 0, 0.2, 1), background-size 450ms cubic-bezier(0, 0, 0.2, 1), background-image 900ms 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 270ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
535
animation: ripple_effect 270ms 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, #mate-menu button, .budgie-settings-window buttonbox.inline-toolbar 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 button, .budgie-panel 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 270ms cubic-bezier(0, 0, 0.2, 1), background-size 450ms cubic-bezier(0, 0, 0.2, 1), background-image 900ms 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, #mate-menu button:hover, .budgie-settings-window buttonbox.inline-toolbar 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 button:hover, .budgie-panel 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, #mate-menu button:active, .budgie-settings-window buttonbox.inline-toolbar 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 button:active, .budgie-panel 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 270ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
597
animation: ripple_effect 270ms 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, #mate-menu button:disabled, .budgie-settings-window buttonbox.inline-toolbar 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 button:disabled, .budgie-panel 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 button:checked, .budgie-panel 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 button:checked:disabled, .budgie-panel 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, .mate-panel-menu-bar button, .budgie-panel 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, .mate-panel-menu-bar button:hover, .budgie-panel 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, .mate-panel-menu-bar button:active, .budgie-panel 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, .mate-panel-menu-bar button:disabled, .budgie-panel 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, .mate-panel-menu-bar button:checked, .budgie-panel 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, .mate-panel-menu-bar button:checked:disabled, .budgie-panel 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 270ms 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 270ms 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
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12);
1136
color: rgba(0, 0, 0, 0.38);
1137
}
1138
1139
/************
1140
* Toolbars *
1141
************/
1142
toolbar {
1143
-GtkWidget-window-dragging: true;
1144
padding: 2px;
1145
background-color: #F5F5F5;
1146
}
1147
1148
.osd toolbar {
1149
background-color: transparent;
1150
}
1151
1152
toolbar.osd, .app-notification, frame.documents-dropdown {
1153
transition: box-shadow 180ms cubic-bezier(0, 0, 0.2, 1);
1154
padding: 6px;
1155
border-radius: 2px;
1156
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);
1157
background-color: #FFFFFF;
1158
}
1159
1160
toolbar.osd:backdrop, .app-notification:backdrop, frame.documents-dropdown:backdrop {
1161
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);
1162
}
1163
1164
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 {
1165
border-radius: 0;
1166
}
1167
1168
toolbar.horizontal > separator {
1169
margin: 2px;
1170
}
1171
1172
toolbar.vertical > separator {
1173
margin: 2px;
1174
}
1175
1176
toolbar:not(.inline-toolbar):not(.osd) scale,
1177
toolbar:not(.inline-toolbar):not(.osd) entry,
1178
toolbar:not(.inline-toolbar):not(.osd) spinbutton,
1179
toolbar:not(.inline-toolbar):not(.osd) button {
1180
margin: 2px;
1181
}
1182
1183
toolbar:not(.inline-toolbar):not(.osd) .linked entry:not(:first-child),
1184
toolbar:not(.inline-toolbar):not(.osd) .linked spinbutton:not(:first-child),
1185
toolbar:not(.inline-toolbar):not(.osd) .linked button:not(:first-child) {
1186
margin-left: 0;
1187
}
1188
1189
toolbar:not(.inline-toolbar):not(.osd) .linked entry:not(:last-child),
1190
toolbar:not(.inline-toolbar):not(.osd) .linked spinbutton:not(:last-child),
1191
toolbar:not(.inline-toolbar):not(.osd) .linked button:not(:last-child) {
1192
margin-right: 0;
1193
}
1194
1195
toolbar:not(.inline-toolbar):not(.osd) spinbutton entry,
1196
toolbar:not(.inline-toolbar):not(.osd) spinbutton button {
1197
margin: 0;
1198
}
1199
1200
toolbar:not(.inline-toolbar):not(.osd) switch {
1201
margin: 8px 2px;
1202
}
1203
1204
.inline-toolbar {
1205
padding: 6px;
1206
border-style: solid;
1207
border-width: 0 1px 1px;
1208
border-color: rgba(0, 0, 0, 0.12);
1209
background-color: #FAFAFA;
1210
}
1211
1212
searchbar,
1213
.location-bar {
1214
padding: 6px;
1215
border-style: solid;
1216
border-width: 0 0 1px;
1217
border-color: rgba(0, 0, 0, 0.12);
1218
background-color: #F5F5F5;
1219
background-clip: border-box;
1220
}
1221
1222
/***************
1223
* Header bars *
1224
***************/
1225
.titlebar:not(headerbar),
1226
headerbar {
1227
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1), color 270ms cubic-bezier(0, 0, 0.2, 1);
1228
min-height: 44px;
1229
padding: 0 6px;
1230
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.1);
1231
background-color: #455A64;
1232
color: #FFFFFF;
1233
}
1234
1235
.titlebar:disabled:not(headerbar) :not(button) > label,
1236
headerbar:disabled :not(button) > label {
1237
color: rgba(255, 255, 255, 0.5);
1238
}
1239
1240
.titlebar:backdrop:not(headerbar),
1241
headerbar:backdrop {
1242
color: rgba(255, 255, 255, 0.7);
1243
}
1244
1245
.titlebar:backdrop:disabled:not(headerbar) :not(button) > label,
1246
headerbar:backdrop:disabled :not(button) > label {
1247
color: rgba(255, 255, 255, 0.3);
1248
}
1249
1250
.titlebar:not(headerbar) .title,
1251
headerbar .title {
1252
padding: 0 12px;
1253
font-weight: bold;
1254
}
1255
1256
.titlebar:not(headerbar) .subtitle,
1257
headerbar .subtitle {
1258
padding: 0 12px;
1259
font-size: smaller;
1260
}
1261
1262
.titlebar:not(headerbar) .linked:not(.vertical) > entry:not(.flat),
1263
headerbar .linked:not(.vertical) > entry:not(.flat) {
1264
border-radius: 2px;
1265
}
1266
1267
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
1268
headerbar button:not(.suggested-action):not(.destructive-action) {
1269
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px;
1270
color: rgba(255, 255, 255, 0.7);
1271
}
1272
1273
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):hover, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):active,
1274
headerbar button:not(.suggested-action):not(.destructive-action):hover,
1275
headerbar button:not(.suggested-action):not(.destructive-action):active {
1276
color: #FFFFFF;
1277
}
1278
1279
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled,
1280
headerbar button:not(.suggested-action):not(.destructive-action):disabled {
1281
color: rgba(255, 255, 255, 0.3);
1282
}
1283
1284
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1285
headerbar button:not(.suggested-action):not(.destructive-action):checked {
1286
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
1287
color: #FFFFFF;
1288
}
1289
1290
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1291
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled {
1292
color: rgba(255, 255, 255, 0.5);
1293
}
1294
1295
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1296
headerbar button:not(.suggested-action):not(.destructive-action):checked,
1297
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled {
1298
background-color: transparent;
1299
}
1300
1301
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop,
1302
headerbar button:not(.suggested-action):not(.destructive-action):backdrop {
1303
color: rgba(255, 255, 255, 0.5);
1304
}
1305
1306
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:hover, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:active,
1307
headerbar button:not(.suggested-action):not(.destructive-action):backdrop:hover,
1308
headerbar button:not(.suggested-action):not(.destructive-action):backdrop:active {
1309
color: rgba(255, 255, 255, 0.7);
1310
}
1311
1312
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:disabled,
1313
headerbar button:not(.suggested-action):not(.destructive-action):backdrop:disabled {
1314
color: rgba(255, 255, 255, 0.3);
1315
}
1316
1317
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked,
1318
headerbar button:not(.suggested-action):not(.destructive-action):backdrop:checked {
1319
color: rgba(255, 255, 255, 0.7);
1320
}
1321
1322
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled,
1323
headerbar button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled {
1324
color: rgba(255, 255, 255, 0.3);
1325
}
1326
1327
.titlebar:not(headerbar) button.suggested-action:disabled, .titlebar:not(headerbar) button.destructive-action:disabled,
1328
headerbar button.suggested-action:disabled,
1329
headerbar button.destructive-action:disabled {
1330
background-color: rgba(255, 255, 255, 0.12);
1331
color: rgba(255, 255, 255, 0.5);
1332
}
1333
1334
.selection-mode.titlebar:not(headerbar),
1335
headerbar.selection-mode {
1336
transition: background-color 0.00001s 270ms, color 270ms cubic-bezier(0, 0, 0.2, 1);
1337
animation: header_ripple_effect 270ms cubic-bezier(0, 0, 0.2, 1);
1338
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);
1339
background-color: #42A5F5;
1340
color: #FFFFFF;
1341
}
1342
1343
.selection-mode.titlebar:backdrop:not(headerbar),
1344
headerbar.selection-mode:backdrop {
1345
color: rgba(255, 255, 255, 0.7);
1346
}
1347
1348
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
1349
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action) {
1350
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px;
1351
color: #FFFFFF;
1352
}
1353
1354
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled,
1355
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled {
1356
color: rgba(255, 255, 255, 0.5);
1357
}
1358
1359
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1360
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked {
1361
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
1362
color: #FFFFFF;
1363
}
1364
1365
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1366
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled {
1367
color: rgba(255, 255, 255, 0.5);
1368
}
1369
1370
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop,
1371
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):backdrop {
1372
color: rgba(255, 255, 255, 0.7);
1373
}
1374
1375
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:disabled,
1376
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):backdrop:disabled {
1377
color: rgba(255, 255, 255, 0.3);
1378
}
1379
1380
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked,
1381
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):backdrop:checked {
1382
color: rgba(255, 255, 255, 0.7);
1383
}
1384
1385
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled,
1386
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):backdrop:checked:disabled {
1387
color: rgba(255, 255, 255, 0.3);
1388
}
1389
1390
.selection-mode.titlebar:not(headerbar) .selection-menu,
1391
headerbar.selection-mode .selection-menu {
1392
padding-left: 16px;
1393
padding-right: 16px;
1394
}
1395
1396
.selection-mode.titlebar:not(headerbar) .selection-menu arrow,
1397
headerbar.selection-mode .selection-menu arrow {
1398
-GtkArrow-arrow-scaling: 1;
1399
}
1400
1401
.selection-mode.titlebar:not(headerbar) .selection-menu .arrow,
1402
headerbar.selection-mode .selection-menu .arrow {
1403
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1404
}
1405
1406
.tiled .titlebar:not(headerbar),
1407
.tiled-top .titlebar:not(headerbar),
1408
.tiled-right .titlebar:not(headerbar),
1409
.tiled-bottom .titlebar:not(headerbar),
1410
.tiled-left .titlebar:not(headerbar),
1411
.maximized .titlebar:not(headerbar),
1412
.fullscreen .titlebar:not(headerbar), .tiled
1413
headerbar,
1414
.tiled-top
1415
headerbar,
1416
.tiled-right
1417
headerbar,
1418
.tiled-bottom
1419
headerbar,
1420
.tiled-left
1421
headerbar,
1422
.maximized
1423
headerbar,
1424
.fullscreen
1425
headerbar {
1426
border-radius: 0;
1427
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1428
}
1429
1430
.default-decoration.titlebar:not(headerbar),
1431
headerbar.default-decoration {
1432
min-height: 20px;
1433
padding: 6px;
1434
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
1435
}
1436
1437
.tiled .default-decoration.titlebar:not(headerbar),
1438
.maximized .default-decoration.titlebar:not(headerbar),
1439
.fullscreen .default-decoration.titlebar:not(headerbar), .tiled
1440
headerbar.default-decoration,
1441
.maximized
1442
headerbar.default-decoration,
1443
.fullscreen
1444
headerbar.default-decoration {
1445
box-shadow: none;
1446
}
1447
1448
.default-decoration.titlebar:not(headerbar) button.titlebutton,
1449
headerbar.default-decoration button.titlebutton {
1450
min-height: 20px;
1451
min-width: 20px;
1452
margin: 0;
1453
padding: 0;
1454
}
1455
1456
.background:not(.csd) .default-decoration.titlebar:not(headerbar) button.titlebutton:active, .background:not(.csd)
1457
headerbar.default-decoration button.titlebutton:active {
1458
background-size: 1000% 1000%;
1459
}
1460
1461
headerbar entry,
1462
headerbar spinbutton,
1463
headerbar button {
1464
margin-top: 6px;
1465
margin-bottom: 6px;
1466
}
1467
1468
headerbar switch {
1469
margin-top: 12px;
1470
margin-bottom: 12px;
1471
}
1472
1473
headerbar spinbutton button {
1474
margin-top: 0;
1475
margin-bottom: 0;
1476
}
1477
1478
.background .titlebar {
1479
border-top-left-radius: 2px;
1480
border-top-right-radius: 2px;
1481
}
1482
1483
.background.tiled .titlebar,
1484
.background.tiled-top .titlebar,
1485
.background.tiled-right .titlebar,
1486
.background.tiled-bottom .titlebar,
1487
.background.tiled-left .titlebar,
1488
.background.maximized .titlebar,
1489
.background.solid-csd .titlebar {
1490
border-top-left-radius: 0;
1491
border-top-right-radius: 0;
1492
}
1493
1494
window separator:first-child + headerbar,
1495
window headerbar:first-child {
1496
border-top-left-radius: 2px;
1497
}
1498
1499
window headerbar:last-child {
1500
border-top-right-radius: 2px;
1501
}
1502
1503
window stack headerbar:first-child, window stack headerbar:last-child {
1504
border-top-left-radius: 2px;
1505
border-top-right-radius: 2px;
1506
}
1507
1508
window.tiled headerbar, window.tiled headerbar:first-child, window.tiled headerbar:last-child, window.tiled headerbar:only-child,
1509
window.tiled-top headerbar,
1510
window.tiled-top headerbar:first-child,
1511
window.tiled-top headerbar:last-child,
1512
window.tiled-top headerbar:only-child,
1513
window.tiled-right headerbar,
1514
window.tiled-right headerbar:first-child,
1515
window.tiled-right headerbar:last-child,
1516
window.tiled-right headerbar:only-child,
1517
window.tiled-bottom headerbar,
1518
window.tiled-bottom headerbar:first-child,
1519
window.tiled-bottom headerbar:last-child,
1520
window.tiled-bottom headerbar:only-child,
1521
window.tiled-left headerbar,
1522
window.tiled-left headerbar:first-child,
1523
window.tiled-left headerbar:last-child,
1524
window.tiled-left headerbar:only-child,
1525
window.maximized headerbar,
1526
window.maximized headerbar:first-child,
1527
window.maximized headerbar:last-child,
1528
window.maximized headerbar:only-child,
1529
window.fullscreen headerbar,
1530
window.fullscreen headerbar:first-child,
1531
window.fullscreen headerbar:last-child,
1532
window.fullscreen headerbar:only-child,
1533
window.solid-csd headerbar,
1534
window.solid-csd headerbar:first-child,
1535
window.solid-csd headerbar:last-child,
1536
window.solid-csd headerbar:only-child {
1537
border-top-left-radius: 0;
1538
border-top-right-radius: 0;
1539
}
1540
1541
window.csd > .titlebar:not(headerbar) {
1542
padding: 0;
1543
background-color: transparent;
1544
background-image: none;
1545
border-style: none;
1546
box-shadow: none;
1547
}
1548
1549
.titlebar:not(headerbar) > separator {
1550
background-color: #455A64;
1551
background-image: image(rgba(0, 0, 0, 0.12));
1552
}
1553
1554
/************
1555
* Pathbars *
1556
************/
1557
.caja-pathbar button,
1558
.path-bar button {
1559
padding-left: 4px;
1560
padding-right: 4px;
1561
}
1562
1563
.caja-pathbar button label:not(:only-child):first-child,
1564
.path-bar button label:not(:only-child):first-child {
1565
margin-left: 4px;
1566
}
1567
1568
.caja-pathbar button label:not(:only-child):last-child,
1569
.path-bar button label:not(:only-child):last-child {
1570
margin-right: 4px;
1571
}
1572
1573
.caja-pathbar button.slider-button,
1574
.path-bar button.slider-button {
1575
padding-left: 4px;
1576
padding-right: 4px;
1577
}
1578
1579
:not(headerbar) .caja-pathbar button, .caja-pathbar :not(headerbar) button, :not(headerbar)
1580
.path-bar button {
1581
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1582
border-radius: 2px;
1583
}
1584
1585
:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar)
1586
.path-bar button:checked {
1587
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1588
}
1589
1590
: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)
1591
.path-bar button:checked, :not(headerbar)
1592
.path-bar button:checked:disabled {
1593
background-color: transparent;
1594
}
1595
1596
/**************
1597
* Tree Views *
1598
**************/
1599
treeview.view {
1600
border-left-color: rgba(0, 0, 0, 0.26);
1601
border-top-color: rgba(0, 0, 0, 0.12);
1602
}
1603
1604
* {
1605
-GtkTreeView-horizontal-separator: 4;
1606
-GtkTreeView-grid-line-width: 1;
1607
-GtkTreeView-grid-line-pattern: '';
1608
-GtkTreeView-tree-line-width: 1;
1609
-GtkTreeView-tree-line-pattern: '';
1610
-GtkTreeView-expander-size: 16;
1611
}
1612
1613
treeview.view:selected {
1614
border-left-color: rgba(255, 255, 255, 0.3);
1615
}
1616
1617
treeview.view:hover, treeview.view:active, treeview.view:selected {
1618
border-radius: 0;
1619
}
1620
1621
treeview.view.separator {
1622
min-height: 5px;
1623
color: rgba(0, 0, 0, 0.12);
1624
}
1625
1626
treeview.view:drop(active) {
1627
border-style: solid none;
1628
border-width: 1px;
1629
border-color: #FF4081;
1630
}
1631
1632
treeview.view:drop(active).after {
1633
border-top-style: none;
1634
}
1635
1636
treeview.view:drop(active).before {
1637
border-bottom-style: none;
1638
}
1639
1640
treeview.view.expander {
1641
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1642
-gtk-icon-transform: rotate(-90deg);
1643
color: rgba(0, 0, 0, 0.54);
1644
}
1645
1646
treeview.view.expander:dir(rtl) {
1647
-gtk-icon-transform: rotate(90deg);
1648
}
1649
1650
treeview.view.expander:checked {
1651
-gtk-icon-transform: unset;
1652
}
1653
1654
treeview.view.expander:hover, treeview.view.expander:active {
1655
color: rgba(0, 0, 0, 0.87);
1656
}
1657
1658
treeview.view.expander:disabled {
1659
color: rgba(0, 0, 0, 0.26);
1660
}
1661
1662
treeview.view.expander:selected {
1663
color: rgba(255, 255, 255, 0.7);
1664
}
1665
1666
treeview.view.expander:selected:hover, treeview.view.expander:selected:active {
1667
color: #FFFFFF;
1668
}
1669
1670
treeview.view.expander:selected:disabled {
1671
color: rgba(255, 255, 255, 0.3);
1672
}
1673
1674
treeview.view.progressbar {
1675
border-bottom: 4px solid #42A5F5;
1676
box-shadow: none;
1677
background-color: transparent;
1678
}
1679
1680
treeview.view.progressbar:selected {
1681
border-bottom-color: #FFFFFF;
1682
}
1683
1684
treeview.view.trough {
1685
border-bottom: 4px solid rgba(66, 165, 245, 0.3);
1686
box-shadow: none;
1687
background-color: transparent;
1688
}
1689
1690
treeview.view.trough:selected {
1691
border-bottom-color: rgba(255, 255, 255, 0.3);
1692
}
1693
1694
treeview.view header button {
1695
padding: 2px 6px;
1696
border-style: none solid solid none;
1697
border-width: 1px;
1698
border-color: rgba(0, 0, 0, 0.12);
1699
border-radius: 0;
1700
background-clip: border-box;
1701
}
1702
1703
treeview.view header button, treeview.view header button:hover, treeview.view header button:active {
1704
box-shadow: none;
1705
}
1706
1707
treeview.view header button, treeview.view header button:disabled {
1708
background-color: #FFFFFF;
1709
}
1710
1711
treeview.view header button:last-child {
1712
border-right-style: none;
1713
}
1714
1715
treeview.view button.dnd,
1716
treeview.view header.button.dnd {
1717
padding: 2px 6px;
1718
border-style: none solid solid;
1719
border-width: 1px;
1720
border-color: rgba(0, 0, 0, 0.12);
1721
border-radius: 0;
1722
box-shadow: none;
1723
background-color: #FFFFFF;
1724
background-clip: border-box;
1725
color: #42A5F5;
1726
}
1727
1728
treeview.view acceleditor > label {
1729
background-color: #42A5F5;
1730
}
1731
1732
/*********
1733
* Menus *
1734
*********/
1735
menubar,
1736
.menubar {
1737
-GtkWidget-window-dragging: true;
1738
padding: 0;
1739
background-color: #455A64;
1740
}
1741
1742
menubar > menuitem,
1743
.menubar > menuitem {
1744
transition: all 180ms cubic-bezier(0, 0, 0.2, 1);
1745
min-height: 20px;
1746
padding: 4px 8px;
1747
color: rgba(255, 255, 255, 0.7);
1748
}
1749
1750
menubar > menuitem:hover,
1751
.menubar > menuitem:hover {
1752
transition: none;
1753
background-color: rgba(255, 255, 255, 0.12);
1754
color: #FFFFFF;
1755
}
1756
1757
menubar > menuitem:disabled,
1758
.menubar > menuitem:disabled {
1759
color: rgba(255, 255, 255, 0.3);
1760
}
1761
1762
menubar > menuitem label:disabled,
1763
.menubar > menuitem label:disabled {
1764
color: inherit;
1765
}
1766
1767
.csd.popup {
1768
background-color: transparent;
1769
}
1770
1771
menu,
1772
.menu,
1773
.context-menu {
1774
margin: 4px 0;
1775
padding: 4px 0;
1776
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
1777
background-color: #FFFFFF;
1778
border: 1px solid rgba(0, 0, 0, 0.12);
1779
}
1780
1781
.csd menu, .csd
1782
.menu, .csd
1783
.context-menu {
1784
border: none;
1785
border-radius: 2px;
1786
}
1787
1788
menu menuitem,
1789
.menu menuitem,
1790
.context-menu menuitem {
1791
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1);
1792
min-height: 20px;
1793
min-width: 40px;
1794
padding: 4px 8px;
1795
font: initial;
1796
text-shadow: none;
1797
}
1798
1799
menu menuitem:hover,
1800
.menu menuitem:hover,
1801
.context-menu menuitem:hover {
1802
transition: none;
1803
background-color: rgba(0, 0, 0, 0.12);
1804
}
1805
1806
menu menuitem:disabled,
1807
.menu menuitem:disabled,
1808
.context-menu menuitem:disabled {
1809
color: rgba(0, 0, 0, 0.38);
1810
}
1811
1812
menu menuitem arrow,
1813
.menu menuitem arrow,
1814
.context-menu menuitem arrow {
1815
min-height: 16px;
1816
min-width: 16px;
1817
}
1818
1819
menu menuitem arrow:dir(ltr),
1820
.menu menuitem arrow:dir(ltr),
1821
.context-menu menuitem arrow:dir(ltr) {
1822
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1823
margin-left: 8px;
1824
}
1825
1826
menu menuitem arrow:dir(rtl),
1827
.menu menuitem arrow:dir(rtl),
1828
.context-menu menuitem arrow:dir(rtl) {
1829
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl");
1830
margin-right: 8px;
1831
}
1832
1833
menu menuitem label:dir(rtl), menu menuitem label:dir(ltr),
1834
.menu menuitem label:dir(rtl),
1835
.menu menuitem label:dir(ltr),
1836
.context-menu menuitem label:dir(rtl),
1837
.context-menu menuitem label:dir(ltr) {
1838
color: inherit;
1839
}
1840
1841
menu > arrow,
1842
.menu > arrow,
1843
.context-menu > arrow {
1844
min-height: 16px;
1845
min-width: 16px;
1846
padding: 4px;
1847
background-color: #FFFFFF;
1848
color: rgba(0, 0, 0, 0.54);
1849
}
1850
1851
menu > arrow.top,
1852
.menu > arrow.top,
1853
.context-menu > arrow.top {
1854
margin-top: -4px;
1855
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
1856
border-radius: 2px 2px 0 0;
1857
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
1858
}
1859
1860
menu > arrow.bottom,
1861
.menu > arrow.bottom,
1862
.context-menu > arrow.bottom {
1863
margin-bottom: -12px;
1864
border-top: 1px solid rgba(0, 0, 0, 0.12);
1865
border-radius: 0 0 2px 2px;
1866
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1867
}
1868
1869
menu > arrow:hover,
1870
.menu > arrow:hover,
1871
.context-menu > arrow:hover {
1872
background-image: image(rgba(0, 0, 0, 0.12));
1873
color: rgba(0, 0, 0, 0.87);
1874
}
1875
1876
menu > arrow:disabled,
1877
.menu > arrow:disabled,
1878
.context-menu > arrow:disabled {
1879
border-color: transparent;
1880
background-color: transparent;
1881
color: transparent;
1882
}
1883
1884
menu separator,
1885
.menu separator,
1886
.context-menu separator {
1887
margin: 4px 0;
1888
}
1889
1890
menuitem accelerator {
1891
color: rgba(0, 0, 0, 0.54);
1892
}
1893
1894
.popup:not(.csd) menu menuitem {
1895
color: #212121;
1896
}
1897
1898
.popup:not(.csd) menu menuitem:hover {
1899
background-color: #E0E0E0;
1900
}
1901
1902
.popup:not(.csd) menu menuitem:disabled {
1903
color: #9E9E9E;
1904
}
1905
1906
.popup:not(.csd) menu accelerator {
1907
color: #757575;
1908
}
1909
1910
/************
1911
* Popovers *
1912
************/
1913
popover.background {
1914
transition: box-shadow 180ms cubic-bezier(0, 0, 0.2, 1);
1915
padding: 2px;
1916
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
1917
background-color: #FAFAFA;
1918
}
1919
1920
popover.background:backdrop {
1921
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1922
}
1923
1924
popover.background, .csd popover.background {
1925
border-style: solid;
1926
border-width: 1px;
1927
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3);
1928
border-radius: 3px;
1929
}
1930
1931
popover.background > stack {
1932
margin: -4px;
1933
}
1934
1935
popover.background > toolbar {
1936
margin: -2px;
1937
}
1938
1939
popover.background > list,
1940
popover.background > .view,
1941
popover.background > toolbar {
1942
border-style: none;
1943
box-shadow: none;
1944
background-color: transparent;
1945
}
1946
1947
popover.background.menu button,
1948
popover.background button.model {
1949
min-height: 32px;
1950
padding: 0 8px;
1951
border-radius: 2px;
1952
}
1953
1954
popover.background separator {
1955
margin: 4px 0;
1956
}
1957
1958
popover.background list separator {
1959
margin: 0;
1960
}
1961
1962
/*************
1963
* Notebooks *
1964
*************/
1965
notebook > header {
1966
border-width: 1px;
1967
border-color: rgba(0, 0, 0, 0.12);
1968
background-color: #F5F5F5;
1969
background-clip: border-box;
1970
}
1971
1972
notebook > header.top {
1973
border-bottom-style: solid;
1974
}
1975
1976
notebook > header.top > tabs {
1977
margin-bottom: -1px;
1978
}
1979
1980
notebook > header.top > tabs > tab:hover {
1981
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.26);
1982
}
1983
1984
notebook > header.top > tabs > tab:checked {
1985
box-shadow: inset 0 -2px #42A5F5;
1986
}
1987
1988
notebook > header.bottom {
1989
border-top-style: solid;
1990
}
1991
1992
notebook > header.bottom > tabs {
1993
margin-top: -1px;
1994
}
1995
1996
notebook > header.bottom > tabs > tab:hover {
1997
box-shadow: inset 0 2px rgba(0, 0, 0, 0.26);
1998
}
1999
2000
notebook > header.bottom > tabs > tab:checked {
2001
box-shadow: inset 0 2px #42A5F5;
2002
}
2003
2004
notebook > header.left {
2005
border-right-style: solid;
2006
}
2007
2008
notebook > header.left > tabs {
2009
margin-right: -1px;
2010
}
2011
2012
notebook > header.left > tabs > tab:hover {
2013
box-shadow: inset -2px 0 rgba(0, 0, 0, 0.26);
2014
}
2015
2016
notebook > header.left > tabs > tab:checked {
2017
box-shadow: inset -2px 0 #42A5F5;
2018
}
2019
2020
notebook > header.right {
2021
border-left-style: solid;
2022
}
2023
2024
notebook > header.right > tabs {
2025
margin-left: -1px;
2026
}
2027
2028
notebook > header.right > tabs > tab:hover {
2029
box-shadow: inset 2px 0 rgba(0, 0, 0, 0.26);
2030
}
2031
2032
notebook > header.right > tabs > tab:checked {
2033
box-shadow: inset 2px 0 #42A5F5;
2034
}
2035
2036
notebook > header.top > tabs > arrow {
2037
border-top-style: none;
2038
}
2039
2040
notebook > header.bottom > tabs > arrow {
2041
border-bottom-style: none;
2042
}
2043
2044
notebook > header.top > tabs > arrow, notebook > header.bottom > tabs > arrow {
2045
padding-left: 4px;
2046
padding-right: 4px;
2047
}
2048
2049
notebook > header.top > tabs > arrow.down, notebook > header.bottom > tabs > arrow.down {
2050
margin-left: -8px;
2051
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
2052
}
2053
2054
notebook > header.top > tabs > arrow.up, notebook > header.bottom > tabs > arrow.up {
2055
margin-right: -8px;
2056
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
2057
}
2058
2059
notebook > header.left > tabs > arrow {
2060
border-left-style: none;
2061
}
2062
2063
notebook > header.right > tabs > arrow {
2064
border-right-style: none;
2065
}
2066
2067
notebook > header.left > tabs > arrow, notebook > header.right > tabs > arrow {
2068
padding-top: 4px;
2069
padding-bottom: 4px;
2070
}
2071
2072
notebook > header.left > tabs > arrow.down, notebook > header.right > tabs > arrow.down {
2073
margin-top: -8px;
2074
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
2075
}
2076
2077
notebook > header.left > tabs > arrow.up, notebook > header.right > tabs > arrow.up {
2078
margin-bottom: -8px;
2079
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
2080
}
2081
2082
notebook > header > tabs > arrow {
2083
min-height: 16px;
2084
min-width: 16px;
2085
border-radius: 0;
2086
}
2087
2088
notebook > header tab {
2089
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
2090
min-height: 20px;
2091
min-width: 20px;
2092
padding: 6px 12px;
2093
outline-offset: -6px;
2094
border-width: 1px;
2095
border-color: transparent;
2096
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 10%, transparent 0%);
2097
background-repeat: no-repeat;
2098
background-position: center;
2099
background-size: 0% 0%;
2100
color: rgba(0, 0, 0, 0.54);
2101
font-weight: 500;
2102
}
2103
2104
notebook > header tab:hover {
2105
color: rgba(0, 0, 0, 0.87);
2106
}
2107
2108
notebook > header tab:hover.reorderable-page {
2109
border-color: rgba(0, 0, 0, 0.12);
2110
background-color: #FAFAFA;
2111
}
2112
2113
notebook > header tab:disabled {
2114
color: rgba(0, 0, 0, 0.26);
2115
}
2116
2117
notebook > header tab:checked {
2118
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), background-size 270ms cubic-bezier(0, 0, 0.2, 1), background-image 720ms cubic-bezier(0, 0, 0.2, 1);
2119
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
2120
background-size: 1000% 1000%;
2121
color: rgba(0, 0, 0, 0.87);
2122
}
2123
2124
notebook > header tab:checked:disabled {
2125
color: rgba(0, 0, 0, 0.38);
2126
}
2127
2128
notebook > header tab:checked.reorderable-page {
2129
border-color: rgba(0, 0, 0, 0.12);
2130
background-color: #FFFFFF;
2131
}
2132
2133
notebook > header tab button.flat:last-child {
2134
margin-left: 6px;
2135
margin-right: -6px;
2136
}
2137
2138
notebook > header tab button.flat:first-child {
2139
margin-left: -6px;
2140
margin-right: 6px;
2141
}
2142
2143
notebook > header.top tabs, notebook > header.bottom tabs {
2144
padding-left: 8px;
2145
padding-right: 8px;
2146
}
2147
2148
notebook > header.top tabs:not(:only-child):first-child, notebook > header.bottom tabs:not(:only-child):first-child {
2149
margin-left: 0;
2150
}
2151
2152
notebook > header.top tabs:not(:only-child):last-child, notebook > header.bottom tabs:not(:only-child):last-child {
2153
margin-right: 0;
2154
}
2155
2156
notebook > header.top tabs tab.reorderable-page, notebook > header.bottom tabs tab.reorderable-page {
2157
margin: 0 -1px;
2158
border-style: none solid;
2159
}
2160
2161
notebook > header.left tabs, notebook > header.right tabs {
2162
padding-top: 8px;
2163
padding-bottom: 8px;
2164
}
2165
2166
notebook > header.left tabs:not(:only-child):first-child, notebook > header.right tabs:not(:only-child):first-child {
2167
margin-top: 0;
2168
}
2169
2170
notebook > header.left tabs:not(:only-child):last-child, notebook > header.right tabs:not(:only-child):last-child {
2171
margin-bottom: 0;
2172
}
2173
2174
notebook > header.left tabs tab.reorderable-page, notebook > header.right tabs tab.reorderable-page {
2175
margin: -1px 0;
2176
border-style: solid none;
2177
}
2178
2179
notebook > stack:not(:only-child) {
2180
background-color: #FFFFFF;
2181
}
2182
2183
/**************
2184
* Scrollbars *
2185
**************/
2186
scrollbar {
2187
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
2188
background-color: #FFFFFF;
2189
background-clip: padding-box;
2190
}
2191
2192
* {
2193
-GtkScrollbar-has-backward-stepper: false;
2194
-GtkScrollbar-has-forward-stepper: false;
2195
}
2196
2197
scrollbar.top {
2198
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
2199
}
2200
2201
scrollbar.bottom {
2202
border-top: 1px solid rgba(0, 0, 0, 0.12);
2203
}
2204
2205
scrollbar.left {
2206
border-right: 1px solid rgba(0, 0, 0, 0.12);
2207
}
2208
2209
scrollbar.right {
2210
border-left: 1px solid rgba(0, 0, 0, 0.12);
2211
}
2212
2213
scrollbar slider {
2214
transition: all 180ms cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0;
2215
min-width: 8px;
2216
min-height: 8px;
2217
border: 4px solid transparent;
2218
border-radius: 9999px;
2219
background-clip: padding-box;
2220
background-color: rgba(0, 0, 0, 0.38);
2221
}
2222
2223
scrollbar slider:hover {
2224
background-color: rgba(0, 0, 0, 0.54);
2225
}
2226
2227
scrollbar slider:active {
2228
background-color: rgba(0, 0, 0, 0.87);
2229
}
2230
2231
scrollbar slider:disabled {
2232
background-color: rgba(0, 0, 0, 0.26);
2233
}
2234
2235
scrollbar.fine-tune slider {
2236
transition: all 180ms cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0, min-width 0, min-height 0;
2237
min-width: 4px;
2238
min-height: 4px;
2239
}
2240
2241
scrollbar.fine-tune.horizontal slider {
2242
margin: 2px 0;
2243
}
2244
2245
scrollbar.fine-tune.vertical slider {
2246
margin: 0 2px;
2247
}
2248
2249
scrollbar.overlay-indicator:not(.dragging):not(.hovering) {
2250
border-color: transparent;
2251
background-color: transparent;
2252
}
2253
2254
scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider {
2255
min-width: 4px;
2256
min-height: 4px;
2257
margin: 3px;
2258
border: 1px solid rgba(255, 255, 255, 0.3);
2259
}
2260
2261
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button {
2262
min-width: 4px;
2263
min-height: 4px;
2264
margin: 3px;
2265
border: 1px solid rgba(255, 255, 255, 0.3);
2266
border-radius: 9999px;
2267
background-color: rgba(0, 0, 0, 0.38);
2268
background-clip: padding-box;
2269
-gtk-icon-source: none;
2270
}
2271
2272
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled {
2273
background-color: rgba(0, 0, 0, 0.26);
2274
}
2275
2276
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider {
2277
min-width: 24px;
2278
}
2279
2280
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal button {
2281
min-width: 8px;
2282
}
2283
2284
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider {
2285
min-height: 24px;
2286
}
2287
2288
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button {
2289
min-height: 8px;
2290
}
2291
2292
scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering {
2293
background-color: rgba(255, 255, 255, 0.9);
2294
}
2295
2296
scrollbar.horizontal slider {
2297
min-width: 24px;
2298
}
2299
2300
scrollbar.vertical slider {
2301
min-height: 24px;
2302
}
2303
2304
scrollbar button {
2305
min-width: 16px;
2306
min-height: 16px;
2307
padding: 0;
2308
border-radius: 0;
2309
}
2310
2311
scrollbar.vertical button.down {
2312
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
2313
}
2314
2315
scrollbar.vertical button.up {
2316
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
2317
}
2318
2319
scrollbar.horizontal button.down {
2320
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
2321
}
2322
2323
scrollbar.horizontal button.up {
2324
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
2325
}
2326
2327
/**********
2328
* Switch *
2329
**********/
2330
switch {
2331
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
2332
margin: 6px 0;
2333
padding: 0 2px;
2334
border: 5px solid transparent;
2335
border-radius: 9999px;
2336
background-color: rgba(0, 0, 0, 0.26);
2337
background-clip: padding-box;
2338
font-size: 0;
2339
}
2340
2341
switch:disabled {
2342
background-color: rgba(0, 0, 0, 0.12);
2343
}
2344
2345
switch:checked {
2346
background-color: rgba(255, 64, 129, 0.5);
2347
}
2348
2349
switch:checked:disabled {
2350
background-color: rgba(255, 64, 129, 0.3);
2351
}
2352
2353
switch slider {
2354
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), box-shadow 180ms cubic-bezier(0, 0, 0.2, 1);
2355
min-width: 20px;
2356
min-height: 20px;
2357
margin: -3px -2px;
2358
border-radius: 9999px;
2359
-gtk-outline-radius: 9999px;
2360
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2361
background-color: #FFFFFF;
2362
}
2363
2364
switch:hover slider {
2365
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2366
}
2367
2368
switch:checked slider {
2369
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), box-shadow 180ms cubic-bezier(0, 0, 0.2, 1), background-image 0, background-color 0.00001s 270ms;
2370
animation: needs_attention 270ms cubic-bezier(0, 0, 0.2, 1);
2371
background-color: #FF4081;
2372
color: #FFFFFF;
2373
}
2374
2375
switch:disabled slider {
2376
background-color: #FAFAFA;
2377
}
2378
2379
switch:checked:disabled slider {
2380
animation: none;
2381
}
2382
2383
/*************************
2384
* Check and Radio items *
2385
*************************/
2386
.view.content-view.check:not(list),
2387
.content-view .tile check:not(list) {
2388
min-height: 40px;
2389
min-width: 40px;
2390
margin: 0;
2391
padding: 0;
2392
box-shadow: none;
2393
background-color: transparent;
2394
background-image: none;
2395
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2396
}
2397
2398
.view.content-view.check:not(list):hover, .view.content-view.check:not(list):active,
2399
.content-view .tile check:not(list):hover,
2400
.content-view .tile check:not(list):active {
2401
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2402
}
2403
2404
.view.content-view.check:not(list),
2405
.content-view .tile check:not(list) {
2406
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-unchecked.png"), url("assets/selectionmode-checkbox-unchecked@2.png"));
2407
}
2408
2409
.view.content-view.check:not(list):checked,
2410
.content-view .tile check:not(list):checked {
2411
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-checked.png"), url("assets/selectionmode-checkbox-checked@2.png"));
2412
}
2413
2414
checkbutton.text-button,
2415
radiobutton.text-button {
2416
padding: 2px;
2417
outline-offset: 0;
2418
}
2419
2420
checkbutton.text-button label:not(:only-child),
2421
radiobutton.text-button label:not(:only-child) {
2422
margin: 0 4px;
2423
}
2424
2425
check,
2426
radio {
2427
min-height: 24px;
2428
min-width: 24px;
2429
margin: -10px;
2430
padding: 10px;
2431
}
2432
2433
check:checked, check:indeterminate,
2434
radio:checked,
2435
radio:indeterminate {
2436
color: #FF4081;
2437
}
2438
2439
check:checked:disabled, check:indeterminate:disabled,
2440
radio:checked:disabled,
2441
radio:indeterminate:disabled {
2442
color: rgba(255, 64, 129, 0.5);
2443
}
2444
2445
row:selected check:not(:checked):not(:indeterminate), row:selected
2446
radio:not(:checked):not(:indeterminate) {
2447
color: rgba(255, 255, 255, 0.7);
2448
}
2449
2450
row:selected check:not(:checked):not(:indeterminate):hover, row:selected check:not(:checked):not(:indeterminate):active, row:selected
2451
radio:not(:checked):not(:indeterminate):hover, row:selected
2452
radio:not(:checked):not(:indeterminate):active {
2453
color: #FFFFFF;
2454
}
2455
2456
row:selected check:not(:checked):not(:indeterminate):disabled, row:selected
2457
radio:not(:checked):not(:indeterminate):disabled {
2458
color: rgba(255, 255, 255, 0.3);
2459
}
2460
2461
popover check, popover check:hover, popover check:disabled, popover
2462
radio, popover
2463
radio:hover, popover
2464
radio:disabled {
2465
box-shadow: none;
2466
background-image: none;
2467
}
2468
2469
popover check:not(:checked):not(:indeterminate):not(:disabled), popover
2470
radio:not(:checked):not(:indeterminate):not(:disabled) {
2471
color: rgba(0, 0, 0, 0.54);
2472
}
2473
2474
popover check.left:dir(rtl), popover
2475
radio.left:dir(rtl) {
2476
margin-left: -16px;
2477
margin-right: -8px;
2478
}
2479
2480
popover check.right:dir(ltr), popover
2481
radio.right:dir(ltr) {
2482
margin-left: -8px;
2483
margin-right: -16px;
2484
}
2485
2486
menu menuitem check, menu menuitem
2487
radio {
2488
transition: none;
2489
margin: 0;
2490
padding: 0;
2491
}
2492
2493
menu menuitem check:dir(ltr), menu menuitem
2494
radio:dir(ltr) {
2495
margin-right: 8px;
2496
}
2497
2498
menu menuitem check:dir(rtl), menu menuitem
2499
radio:dir(rtl) {
2500
margin-left: 8px;
2501
}
2502
2503
menu menuitem check:not(:checked):not(:indeterminate):not(:disabled), menu menuitem
2504
radio:not(:checked):not(:indeterminate):not(:disabled) {
2505
color: rgba(0, 0, 0, 0.54);
2506
}
2507
2508
menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem
2509
radio, menu menuitem
2510
radio:hover, menu menuitem
2511
radio:disabled {
2512
box-shadow: none;
2513
}
2514
2515
2516
check {
2517
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.symbolic.png")));
2518
}
2519
2520
2521
check:checked {
2522
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.symbolic.png")));
2523
}
2524
2525
2526
check:indeterminate {
2527
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.symbolic.png")));
2528
}
2529
2530
2531
radio {
2532
border-image-slice: 22;
2533
border-image-width: 22px;
2534
}
2535
2536
2537
radio {
2538
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.symbolic.png")));
2539
}
2540
2541
2542
radio:indeterminate {
2543
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-mixed-symbolic.symbolic.png")));
2544
}
2545
2546
2547
radio {
2548
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent));
2549
}
2550
2551
2552
radio:checked:not(:indeterminate) {
2553
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.11364, to(#FF4081), to(transparent));
2554
}
2555
2556
2557
radio:checked:not(:indeterminate):disabled {
2558
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.11364, to(rgba(255, 64, 129, 0.5)), to(transparent));
2559
}
2560
2561
window.background:not(.csd) > widget > checkbutton > check,
2562
menu menuitem check {
2563
min-height: 16px;
2564
min-width: 16px;
2565
border-radius: 2px;
2566
-gtk-outline-radius: 2px;
2567
-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")));
2568
}
2569
2570
window.background:not(.csd) > widget > checkbutton > check:checked,
2571
menu menuitem check:checked {
2572
-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")));
2573
}
2574
2575
window.background:not(.csd) > widget > checkbutton > check:indeterminate,
2576
menu menuitem check:indeterminate {
2577
-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")));
2578
}
2579
2580
window.background:not(.csd) > widget > radiobutton > radio,
2581
menu menuitem radio {
2582
min-height: 16px;
2583
min-width: 16px;
2584
border-image: none;
2585
-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")));
2586
}
2587
2588
window.background:not(.csd) > widget > radiobutton > radio:checked,
2589
menu menuitem radio:checked {
2590
-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")));
2591
}
2592
2593
window.background:not(.csd) > widget > radiobutton > radio:indeterminate,
2594
menu menuitem radio:indeterminate {
2595
-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")));
2596
}
2597
2598
check:not(:checked):active {
2599
-gtk-icon-transform: rotate(90deg);
2600
}
2601
2602
check:not(:checked):indeterminate:active,
2603
radio:not(:checked):indeterminate:active {
2604
-gtk-icon-transform: scaleX(-1);
2605
}
2606
2607
check:not(:checked),
2608
radio:not(:checked) {
2609
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), background-size 450ms cubic-bezier(0, 0, 0.2, 1), background-image 900ms cubic-bezier(0, 0, 0.2, 1), -gtk-icon-transform 0;
2610
}
2611
2612
check:not(:checked):active,
2613
radio:not(:checked):active {
2614
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0, -gtk-icon-transform 0;
2615
}
2616
2617
menu menuitem check:not(:checked), menu menuitem
2618
radio:not(:checked) {
2619
transition: none;
2620
}
2621
2622
treeview.view check,
2623
treeview.view radio {
2624
padding: 0;
2625
}
2626
2627
treeview.view check:hover,
2628
treeview.view radio:hover {
2629
box-shadow: inset 0 0 0 9999px alpha(rgba(0, 0, 0, 0.87), 0.05);
2630
}
2631
2632
treeview.view check:hover:disabled,
2633
treeview.view radio:hover:disabled {
2634
box-shadow: none;
2635
}
2636
2637
treeview.view check:hover:selected,
2638
treeview.view radio:hover:selected {
2639
box-shadow: inset 0 0 0 9999px alpha(#FFFFFF, 0.05);
2640
}
2641
2642
treeview.view check,
2643
treeview.view radio {
2644
color: rgba(0, 0, 0, 0.54);
2645
}
2646
2647
treeview.view check:hover, treeview.view check:active,
2648
treeview.view radio:hover,
2649
treeview.view radio:active {
2650
color: rgba(0, 0, 0, 0.87);
2651
}
2652
2653
treeview.view check:disabled,
2654
treeview.view radio:disabled {
2655
color: rgba(0, 0, 0, 0.26);
2656
}
2657
2658
treeview.view check:checked, treeview.view check:indeterminate,
2659
treeview.view radio:checked,
2660
treeview.view radio:indeterminate {
2661
color: #FF4081;
2662
}
2663
2664
treeview.view check:checked:disabled, treeview.view check:indeterminate:disabled,
2665
treeview.view radio:checked:disabled,
2666
treeview.view radio:indeterminate:disabled {
2667
color: rgba(255, 64, 129, 0.5);
2668
}
2669
2670
treeview.view check:selected,
2671
treeview.view radio:selected {
2672
color: rgba(255, 255, 255, 0.7);
2673
}
2674
2675
treeview.view check:selected:hover, treeview.view check:selected:active,
2676
treeview.view radio:selected:hover,
2677
treeview.view radio:selected:active {
2678
color: #FFFFFF;
2679
}
2680
2681
treeview.view check:selected:disabled,
2682
treeview.view radio:selected:disabled {
2683
color: rgba(255, 255, 255, 0.3);
2684
}
2685
2686
treeview.view check:selected:checked, treeview.view check:selected:indeterminate,
2687
treeview.view radio:selected:checked,
2688
treeview.view radio:selected:indeterminate {
2689
color: #FF4081;
2690
}
2691
2692
treeview.view check:selected:checked:disabled, treeview.view check:selected:indeterminate:disabled,
2693
treeview.view radio:selected:checked:disabled,
2694
treeview.view radio:selected:indeterminate:disabled {
2695
color: rgba(255, 64, 129, 0.5);
2696
}
2697
2698
treeview.view radio:checked {
2699
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-checked-symbolic.symbolic.png")));
2700
border-image: none;
2701
}
2702
2703
/************
2704
* GtkScale *
2705
************/
2706
scale {
2707
min-height: 8px;
2708
min-width: 8px;
2709
padding: 12px;
2710
}
2711
2712
scale slider {
2713
min-height: 24px;
2714
min-width: 24px;
2715
margin: -11px;
2716
}
2717
2718
scale trough {
2719
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
2720
outline-offset: 2px;
2721
background-color: rgba(0, 0, 0, 0.26);
2722
}
2723
2724
scale trough:disabled {
2725
background-color: rgba(0, 0, 0, 0.12);
2726
}
2727
2728
scale highlight {
2729
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
2730
background-color: #FF4081;
2731
}
2732
2733
scale highlight:disabled {
2734
background-color: transparent;
2735
}
2736
2737
scale fill {
2738
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
2739
background-color: rgba(0, 0, 0, 0.26);
2740
}
2741
2742
scale fill:disabled {
2743
background-color: transparent;
2744
}
2745
2746
scale slider {
2747
transition: all 180ms cubic-bezier(0.4, 0, 0.2, 1);
2748
background-repeat: no-repeat;
2749
background-position: center;
2750
background-size: calc(100% - 10px);
2751
}
2752
2753
scale slider {
2754
background-image: -gtk-scaled(url("assets/scale-slider.png"), url("assets/scale-slider@2.png"));
2755
}
2756
2757
scale slider:disabled {
2758
background-image: -gtk-scaled(url("assets/scale-slider-disabled.png"), url("assets/scale-slider-disabled@2.png"));
2759
}
2760
2761
scale slider:hover {
2762
background-size: calc(100% - 8px);
2763
}
2764
2765
scale slider:active {
2766
background-size: calc(100% - 6px);
2767
}
2768
2769
scale.fine-tune slider {
2770
background-size: calc(100% - 12px);
2771
}
2772
2773
scale marks label,
2774
scale value {
2775
color: rgba(0, 0, 0, 0.38);
2776
}
2777
2778
scale marks {
2779
color: rgba(0, 0, 0, 0.26);
2780
}
2781
2782
scale marks.top {
2783
margin-bottom: 8px;
2784
margin-top: -16px;
2785
}
2786
2787
scale marks.bottom {
2788
margin-top: 8px;
2789
margin-bottom: -16px;
2790
}
2791
2792
scale marks.top {
2793
margin-right: 8px;
2794
margin-left: -16px;
2795
}
2796
2797
scale marks.bottom {
2798
margin-left: 8px;
2799
margin-right: -16px;
2800
}
2801
2802
scale.horizontal indicator {
2803
min-height: 8px;
2804
min-width: 1px;
2805
}
2806
2807
scale.vertical indicator {
2808
min-height: 1px;
2809
min-width: 8px;
2810
}
2811
2812
scale.horizontal.marks-before:not(.marks-after) slider {
2813
min-height: 30px;
2814
min-width: 24px;
2815
margin-top: -17px;
2816
background-position: center calc(100% - 5px);
2817
}
2818
2819
scale.horizontal.marks-before:not(.marks-after) slider {
2820
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider.png"), url("assets/scale-horz-marks-before-slider@2.png"));
2821
}
2822
2823
scale.horizontal.marks-before:not(.marks-after) slider:disabled {
2824
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider-disabled.png"), url("assets/scale-horz-marks-before-slider-disabled@2.png"));
2825
}
2826
2827
scale.horizontal.marks-before:not(.marks-after) slider:hover {
2828
background-position: center calc(100% - 4px);
2829
}
2830
2831
scale.horizontal.marks-before:not(.marks-after) slider:active {
2832
background-position: center calc(100% - 3px);
2833
}
2834
2835
scale.horizontal.marks-before:not(.marks-after).fine-tune slider {
2836
background-position: center calc(100% - 6px);
2837
}
2838
2839
scale.horizontal.marks-after:not(.marks-before) slider {
2840
min-height: 30px;
2841
min-width: 24px;
2842
margin-bottom: -17px;
2843
background-position: center calc(5px);
2844
}
2845
2846
scale.horizontal.marks-after:not(.marks-before) slider {
2847
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider.png"), url("assets/scale-horz-marks-after-slider@2.png"));
2848
}
2849
2850
scale.horizontal.marks-after:not(.marks-before) slider:disabled {
2851
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider-disabled.png"), url("assets/scale-horz-marks-after-slider-disabled@2.png"));
2852
}
2853
2854
scale.horizontal.marks-after:not(.marks-before) slider:hover {
2855
background-position: center calc(4px);
2856
}
2857
2858
scale.horizontal.marks-after:not(.marks-before) slider:active {
2859
background-position: center calc(3px);
2860
}
2861
2862
scale.horizontal.marks-after:not(.marks-before).fine-tune slider {
2863
background-position: center calc(6px);
2864
}
2865
2866
scale.vertical.marks-before:not(.marks-after) slider {
2867
min-height: 24px;
2868
min-width: 30px;
2869
margin-left: -17px;
2870
background-position: calc(5px) center;
2871
}
2872
2873
scale.vertical.marks-before:not(.marks-after) slider {
2874
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider.png"), url("assets/scale-vert-marks-before-slider@2.png"));
2875
}
2876
2877
scale.vertical.marks-before:not(.marks-after) slider:disabled {
2878
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider-disabled.png"), url("assets/scale-vert-marks-before-slider-disabled@2.png"));
2879
}
2880
2881
scale.vertical.marks-before:not(.marks-after) slider:hover {
2882
background-position: calc(4px) center;
2883
}
2884
2885
scale.vertical.marks-before:not(.marks-after) slider:active {
2886
background-position: calc(3px) center;
2887
}
2888
2889
scale.vertical.marks-before:not(.marks-after).fine-tune slider {
2890
background-position: calc(6px) center;
2891
}
2892
2893
scale.vertical.marks-after:not(.marks-before) slider {
2894
min-height: 24px;
2895
min-width: 30px;
2896
margin-right: -17px;
2897
background-position: calc(100% - 5px) center;
2898
}
2899
2900
scale.vertical.marks-after:not(.marks-before) slider {
2901
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider.png"), url("assets/scale-vert-marks-after-slider@2.png"));
2902
}
2903
2904
scale.vertical.marks-after:not(.marks-before) slider:disabled {
2905
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider-disabled.png"), url("assets/scale-vert-marks-after-slider-disabled@2.png"));
2906
}
2907
2908
scale.vertical.marks-after:not(.marks-before) slider:hover {
2909
background-position: calc(100% - 4px) center;
2910
}
2911
2912
scale.vertical.marks-after:not(.marks-before) slider:active {
2913
background-position: calc(100% - 3px) center;
2914
}
2915
2916
scale.vertical.marks-after:not(.marks-before).fine-tune slider {
2917
background-position: calc(100% - 6px) center;
2918
}
2919
2920
scale.color {
2921
min-height: 0;
2922
min-width: 0;
2923
}
2924
2925
scale.color.horizontal {
2926
padding: 0 0 12px 0;
2927
}
2928
2929
scale.color.horizontal slider:dir(ltr), scale.color.horizontal slider:dir(rtl) {
2930
margin-bottom: -12px;
2931
margin-top: -2px;
2932
}
2933
2934
scale.color.vertical:dir(ltr) {
2935
padding: 0 0 0 12px;
2936
}
2937
2938
scale.color.vertical:dir(ltr) slider {
2939
margin-left: -12px;
2940
margin-right: -2px;
2941
}
2942
2943
scale.color.vertical:dir(rtl) {
2944
padding: 0 12px 0 0;
2945
}
2946
2947
scale.color.vertical:dir(rtl) slider {
2948
margin-right: -12px;
2949
margin-left: -2px;
2950
}
2951
2952
/*****************
2953
* Progress bars *
2954
*****************/
2955
progressbar {
2956
color: rgba(0, 0, 0, 0.38);
2957
font-size: smaller;
2958
}
2959
2960
progressbar.horizontal trough,
2961
progressbar.horizontal progress {
2962
min-height: 4px;
2963
}
2964
2965
progressbar.vertical trough,
2966
progressbar.vertical progress {
2967
min-width: 4px;
2968
}
2969
2970
progressbar trough {
2971
background-color: rgba(66, 165, 245, 0.3);
2972
}
2973
2974
progressbar progress {
2975
background-color: #42A5F5;
2976
}
2977
2978
progressbar trough.empty progress {
2979
all: unset;
2980
}
2981
2982
/*************
2983
* Level Bar *
2984
*************/
2985
levelbar.horizontal block {
2986
min-height: 4px;
2987
}
2988
2989
levelbar.horizontal.discrete block {
2990
min-width: 32px;
2991
}
2992
2993
levelbar.horizontal.discrete block:not(:last-child) {
2994
margin-right: 2px;
2995
}
2996
2997
levelbar.vertical block {
2998
min-width: 4px;
2999
}
3000
3001
levelbar.vertical.discrete block {
3002
min-height: 32px;
3003
}
3004
3005
levelbar.vertical.discrete block:not(:last-child) {
3006
margin-bottom: 2px;
3007
}
3008
3009
levelbar trough {
3010
padding: 2px;
3011
border-radius: 2px;
3012
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3013
background-color: #FFFFFF;
3014
}
3015
3016
levelbar trough:disabled {
3017
background-color: #FAFAFA;
3018
}
3019
3020
levelbar block.low {
3021
background-color: #FF6D00;
3022
}
3023
3024
levelbar block.high, levelbar block:not(.empty) {
3025
background-color: #42A5F5;
3026
}
3027
3028
levelbar block.full {
3029
background-color: #00C853;
3030
}
3031
3032
levelbar block.empty {
3033
background-color: rgba(0, 0, 0, 0.12);
3034
}
3035
3036
/****************
3037
* Print dialog *
3038
*****************/
3039
printdialog paper {
3040
padding: 0;
3041
border: 1px solid rgba(0, 0, 0, 0.12);
3042
background-color: #FFFFFF;
3043
color: rgba(0, 0, 0, 0.87);
3044
}
3045
3046
printdialog .dialog-action-box {
3047
margin: 12px;
3048
}
3049
3050
/**********
3051
* Frames *
3052
**********/
3053
frame > border,
3054
.frame {
3055
margin: 0;
3056
padding: 0;
3057
border: 1px solid rgba(0, 0, 0, 0.12);
3058
border-radius: 0;
3059
box-shadow: none;
3060
}
3061
3062
frame > border.flat,
3063
.frame.flat,
3064
frame.flat > border {
3065
border-style: none;
3066
}
3067
3068
actionbar > revealer > box {
3069
padding: 6px;
3070
border-top: 1px solid rgba(0, 0, 0, 0.12);
3071
}
3072
3073
scrolledwindow viewport.frame {
3074
border-style: none;
3075
}
3076
3077
overshoot.top {
3078
background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
3079
background-repeat: no-repeat;
3080
background-position: center top;
3081
background-color: transparent;
3082
border: none;
3083
box-shadow: none;
3084
}
3085
3086
overshoot.bottom {
3087
background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
3088
background-repeat: no-repeat;
3089
background-position: center bottom;
3090
background-color: transparent;
3091
border: none;
3092
box-shadow: none;
3093
}
3094
3095
overshoot.left {
3096
background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
3097
background-repeat: no-repeat;
3098
background-position: left center;
3099
background-color: transparent;
3100
border: none;
3101
box-shadow: none;
3102
}
3103
3104
overshoot.right {
3105
background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
3106
background-repeat: no-repeat;
3107
background-position: right center;
3108
background-color: transparent;
3109
border: none;
3110
box-shadow: none;
3111
}
3112
3113
undershoot.top {
3114
background-color: transparent;
3115
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%);
3116
padding-top: 1px;
3117
background-size: 12px 1px;
3118
background-repeat: repeat-x;
3119
background-origin: content-box;
3120
background-position: left top;
3121
}
3122
3123
undershoot.bottom {
3124
background-color: transparent;
3125
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%);
3126
padding-bottom: 1px;
3127
background-size: 12px 1px;
3128
background-repeat: repeat-x;
3129
background-origin: content-box;
3130
background-position: left bottom;
3131
}
3132
3133
undershoot.left {
3134
background-color: transparent;
3135
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%);
3136
padding-left: 1px;
3137
background-size: 1px 12px;
3138
background-repeat: repeat-y;
3139
background-origin: content-box;
3140
background-position: left top;
3141
}
3142
3143
undershoot.right {
3144
background-color: transparent;
3145
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%);
3146
padding-right: 1px;
3147
background-size: 1px 12px;
3148
background-repeat: repeat-y;
3149
background-origin: content-box;
3150
background-position: right top;
3151
}
3152
3153
junction {
3154
border-style: solid none none solid;
3155
border-width: 1px;
3156
border-color: rgba(0, 0, 0, 0.12);
3157
background-color: #FFFFFF;
3158
}
3159
3160
junction:dir(rtl) {
3161
border-style: solid solid none none;
3162
}
3163
3164
separator {
3165
min-width: 1px;
3166
min-height: 1px;
3167
background-color: rgba(0, 0, 0, 0.12);
3168
}
3169
3170
3171
button.font separator,
3172
button.file separator, .tweak-categories separator {
3173
min-width: 0;
3174
min-height: 0;
3175
background-color: transparent;
3176
}
3177
3178
/*********
3179
* Lists *
3180
*********/
3181
list {
3182
border-color: rgba(0, 0, 0, 0.12);
3183
background-color: #FFFFFF;
3184
}
3185
3186
list row {
3187
padding: 2px;
3188
}
3189
3190
row.activatable, .view, treeview.view header button, .budgie-menu button {
3191
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, background-size 450ms cubic-bezier(0, 0, 0.2, 1), background-image 900ms cubic-bezier(0, 0, 0.2, 1);
3192
box-shadow: inset 0 0 0 9999px transparent;
3193
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
3194
background-repeat: no-repeat;
3195
background-position: center;
3196
background-size: 1000% 1000%;
3197
}
3198
3199
row.activatable:hover, .view:hover, treeview.view header button:hover, .budgie-menu button:hover {
3200
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, box-shadow 0, background-size 450ms cubic-bezier(0, 0, 0.2, 1), background-image 900ms cubic-bezier(0, 0, 0.2, 1);
3201
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.05);
3202
}
3203
3204
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 {
3205
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, background-size 0, background-image 0;
3206
animation: ripple_effect 270ms cubic-bezier(0, 0, 0.2, 1) forwards;
3207
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
3208
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
3209
background-size: 0% 0%;
3210
}
3211
3212
/*********************
3213
* App Notifications *
3214
*********************/
3215
.app-notification {
3216
margin: 8px;
3217
}
3218
3219
.app-notification.frame,
3220
.app-notification border {
3221
border-style: none;
3222
}
3223
3224
/*************
3225
* Expanders *
3226
*************/
3227
expander title > arrow {
3228
transition: all 180ms cubic-bezier(0.4, 0, 0.2, 1);
3229
min-width: 16px;
3230
min-height: 16px;
3231
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
3232
-gtk-icon-transform: rotate(-90deg);
3233
color: rgba(0, 0, 0, 0.54);
3234
}
3235
3236
expander title > arrow:dir(rtl) {
3237
-gtk-icon-transform: rotate(90deg);
3238
}
3239
3240
expander title > arrow:checked {
3241
-gtk-icon-transform: unset;
3242
}
3243
3244
expander title > arrow:hover, expander title > arrow:active {
3245
color: rgba(0, 0, 0, 0.87);
3246
}
3247
3248
expander title > arrow:disabled {
3249
color: rgba(0, 0, 0, 0.26);
3250
}
3251
3252
expander title > arrow:selected {
3253
color: rgba(255, 255, 255, 0.7);
3254
}
3255
3256
expander title > arrow:selected:hover, expander title > arrow:selected:active {
3257
color: #FFFFFF;
3258
}
3259
3260
expander title > arrow:selected:disabled {
3261
color: rgba(255, 255, 255, 0.3);
3262
}
3263
3264
/************
3265
* Calendar *
3266
************/
3267
calendar {
3268
padding: 1px;
3269
border: 1px solid rgba(0, 0, 0, 0.12);
3270
color: rgba(0, 0, 0, 0.87);
3271
}
3272
3273
calendar:disabled {
3274
color: rgba(0, 0, 0, 0.38);
3275
}
3276
3277
calendar:selected {
3278
border-radius: 3px;
3279
}
3280
3281
calendar.header {
3282
border-style: none none solid;
3283
border-radius: 0;
3284
}
3285
3286
calendar.highlight {
3287
color: rgba(0, 0, 0, 0.54);
3288
font-weight: 500;
3289
}
3290
3291
calendar:indeterminate {
3292
color: rgba(0, 0, 0, 0.26);
3293
}
3294
3295
/***********
3296
* Dialogs *
3297
***********/
3298
messagedialog.background {
3299
background-color: #FAFAFA;
3300
}
3301
3302
messagedialog .titlebar {
3303
min-height: 20px;
3304
border-style: none;
3305
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
3306
background-color: #FAFAFA;
3307
color: rgba(0, 0, 0, 0.87);
3308
}
3309
3310
messagedialog .titlebar:backdrop {
3311
color: rgba(0, 0, 0, 0.54);
3312
}
3313
3314
messagedialog.csd.background {
3315
border-bottom-left-radius: 2px;
3316
border-bottom-right-radius: 2px;
3317
}
3318
3319
messagedialog.csd .dialog-action-area button {
3320
padding: 8px 16px;
3321
border-top: 1px solid rgba(0, 0, 0, 0.12);
3322
border-radius: 0;
3323
}
3324
3325
messagedialog.csd .dialog-action-area button:first-child {
3326
border-bottom-left-radius: 2px;
3327
}
3328
3329
messagedialog.csd .dialog-action-area button:last-child {
3330
border-bottom-right-radius: 2px;
3331
}
3332
3333
filechooser .dialog-action-box {
3334
border-top: 1px solid rgba(0, 0, 0, 0.12);
3335
}
3336
3337
filechooser #pathbarbox {
3338
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
3339
background-color: #F5F5F5;
3340
}
3341
3342
filechooserbutton:drop(active) {
3343
box-shadow: none;
3344
}
3345
3346
/***********
3347
* Sidebar *
3348
***********/
3349
.sidebar {
3350
border-style: none;
3351
background-color: #FAFAFA;
3352
}
3353
3354
stacksidebar.sidebar:dir(ltr) list, stacksidebar.sidebar.left list, stacksidebar.sidebar.left:dir(rtl) list, .sidebar:dir(ltr), .sidebar.left, .sidebar.left:dir(rtl) {
3355
border-right: 1px solid rgba(0, 0, 0, 0.12);
3356
border-left-style: none;
3357
}
3358
3359
stacksidebar.sidebar:dir(rtl) list, stacksidebar.sidebar.right list, .sidebar:dir(rtl), .sidebar.right {
3360
border-left: 1px solid rgba(0, 0, 0, 0.12);
3361
border-right-style: none;
3362
}
3363
3364
.sidebar list {
3365
background-color: transparent;
3366
}
3367
3368
paned .sidebar.left, paned .sidebar.right, paned .sidebar.left:dir(rtl), paned .sidebar:dir(rtl), paned .sidebar:dir(ltr), paned .sidebar {
3369
border-style: none;
3370
}
3371
3372
stacksidebar row {
3373
padding: 10px 4px;
3374
}
3375
3376
stacksidebar row > label {
3377
padding-left: 6px;
3378
padding-right: 6px;
3379
}
3380
3381
/****************
3382
* File chooser *
3383
****************/
3384
row image.sidebar-icon {
3385
color: rgba(0, 0, 0, 0.54);
3386
}
3387
3388
row:selected image.sidebar-icon {
3389
color: rgba(255, 255, 255, 0.7);
3390
}
3391
3392
placessidebar > viewport.frame {
3393
border-style: none;
3394
}
3395
3396
placessidebar list {
3397
padding: 1px 0 4px;
3398
}
3399
3400
placessidebar row {
3401
min-height: 32px;
3402
margin: -1px 0;
3403
padding: 0;
3404
}
3405
3406
placessidebar row > revealer {
3407
padding: 0 12px;
3408
}
3409
3410
placessidebar row:selected {
3411
color: #FFFFFF;
3412
}
3413
3414
placessidebar row:disabled {
3415
color: rgba(0, 0, 0, 0.38);
3416
}
3417
3418
placessidebar row image.sidebar-icon:dir(ltr) {
3419
padding-right: 8px;
3420
}
3421
3422
placessidebar row image.sidebar-icon:dir(rtl) {
3423
padding-left: 8px;
3424
}
3425
3426
placessidebar row label.sidebar-label:dir(ltr) {
3427
padding-right: 2px;
3428
}
3429
3430
placessidebar row label.sidebar-label:dir(rtl) {
3431
padding-left: 2px;
3432
}
3433
3434
placessidebar row.sidebar-placeholder-row {
3435
min-height: 2px;
3436
padding: 0 8px;
3437
background-image: image(#FF4081);
3438
background-clip: content-box;
3439
}
3440
3441
placessidebar row.sidebar-new-bookmark-row {
3442
color: #FF4081;
3443
}
3444
3445
placessidebar row:drop(active):not(:disabled) {
3446
box-shadow: inset 0 0 0 2px #FF4081;
3447
}
3448
3449
placesview .server-list-button > image {
3450
-gtk-icon-transform: rotate(0turn);
3451
}
3452
3453
placesview .server-list-button:checked > image {
3454
-gtk-icon-transform: rotate(-0.5turn);
3455
}
3456
3457
placesview > actionbar > revealer > box > label {
3458
padding-left: 8px;
3459
padding-right: 8px;
3460
}
3461
3462
/*********
3463
* Paned *
3464
*********/
3465
paned > separator {
3466
min-width: 1px;
3467
min-height: 1px;
3468
-gtk-icon-source: none;
3469
border-style: none;
3470
background-color: transparent;
3471
background-image: image(rgba(0, 0, 0, 0.12));
3472
background-size: 1px 1px;
3473
background-clip: content-box;
3474
}
3475
3476
paned > separator.wide {
3477
min-width: 6px;
3478
min-height: 6px;
3479
background-color: #F5F5F5;
3480
background-image: image(rgba(0, 0, 0, 0.12)), image(rgba(0, 0, 0, 0.12));
3481
background-size: 1px 1px, 1px 1px;
3482
}
3483
3484
paned.horizontal > separator {
3485
background-repeat: repeat-y;
3486
}
3487
3488
paned.horizontal > separator:dir(ltr) {
3489
margin: 0 -8px 0 0;
3490
padding: 0 8px 0 0;
3491
background-position: left;
3492
}
3493
3494
paned.horizontal > separator:dir(rtl) {
3495
margin: 0 0 0 -8px;
3496
padding: 0 0 0 8px;
3497
background-position: right;
3498
}
3499
3500
paned.horizontal > separator.wide {
3501
margin: 0;
3502
padding: 0;
3503
background-repeat: repeat-y, repeat-y;
3504
background-position: left, right;
3505
}
3506
3507
paned.vertical > separator {
3508
margin: 0 0 -8px 0;
3509
padding: 0 0 8px 0;
3510
background-repeat: repeat-x;
3511
background-position: top;
3512
}
3513
3514
paned.vertical > separator.wide {
3515
margin: 0;
3516
padding: 0;
3517
background-repeat: repeat-x, repeat-x;
3518
background-position: bottom, top;
3519
}
3520
3521
/**************
3522
* GtkInfoBar *
3523
**************/
3524
infobar {
3525
border-style: none;
3526
}
3527
3528
infobar.info {
3529
background-color: #66BB6A;
3530
}
3531
3532
infobar.question {
3533
background-color: #42A5F5;
3534
}
3535
3536
infobar.warning {
3537
background-color: #FFA726;
3538
}
3539
3540
infobar.error {
3541
background-color: #EF5350;
3542
}
3543
3544
infobar.info > label, infobar.info, infobar.question > label, infobar.question, infobar.warning > label, infobar.warning, infobar.error > label, infobar.error {
3545
color: #FFFFFF;
3546
}
3547
3548
/************
3549
* Tooltips *
3550
************/
3551
tooltip {
3552
border-radius: 2px;
3553
box-shadow: none;
3554
}
3555
3556
tooltip.background {
3557
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
3558
background-color: rgba(255, 255, 255, 0.9);
3559
}
3560
3561
tooltip:not(.csd):not(.unity-csd) {
3562
border: 1px solid rgba(0, 0, 0, 0.12);
3563
border-radius: 3px;
3564
background-clip: padding-box;
3565
}
3566
3567
tooltip decoration {
3568
background-color: transparent;
3569
}
3570
3571
tooltip label {
3572
min-height: 20px;
3573
padding: 0 2px;
3574
}
3575
3576
/*****************
3577
* Color Chooser *
3578
*****************/
3579
colorswatch.top {
3580
border-top-left-radius: 2.5px;
3581
border-top-right-radius: 2.5px;
3582
}
3583
3584
colorswatch.top overlay {
3585
border-top-left-radius: 2px;
3586
border-top-right-radius: 2px;
3587
}
3588
3589
colorswatch.bottom {
3590
border-bottom-left-radius: 2.5px;
3591
border-bottom-right-radius: 2.5px;
3592
}
3593
3594
colorswatch.bottom overlay {
3595
border-bottom-left-radius: 2px;
3596
border-bottom-right-radius: 2px;
3597
}
3598
3599
colorswatch.left, colorswatch:first-child:not(.top) {
3600
border-top-left-radius: 2.5px;
3601
border-bottom-left-radius: 2.5px;
3602
}
3603
3604
colorswatch.left overlay, colorswatch:first-child:not(.top) overlay {
3605
border-top-left-radius: 2px;
3606
border-bottom-left-radius: 2px;
3607
}
3608
3609
colorswatch.right, colorswatch:last-child:not(.bottom) {
3610
border-top-right-radius: 2.5px;
3611
border-bottom-right-radius: 2.5px;
3612
}
3613
3614
colorswatch.right overlay, colorswatch:last-child:not(.bottom) overlay {
3615
border-top-right-radius: 2px;
3616
border-bottom-right-radius: 2px;
3617
}
3618
3619
colorswatch.dark {
3620
color: #FFFFFF;
3621
}
3622
3623
colorswatch.light {
3624
color: rgba(0, 0, 0, 0.87);
3625
}
3626
3627
colorswatch:drop(active) {
3628
box-shadow: none;
3629
}
3630
3631
colorswatch:drop(active).light overlay {
3632
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;
3633
}
3634
3635
colorswatch:drop(active).dark overlay {
3636
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;
3637
}
3638
3639
colorswatch overlay {
3640
transition: box-shadow 180ms cubic-bezier(0, 0, 0.2, 1);
3641
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3642
}
3643
3644
colorswatch overlay:hover {
3645
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3646
}
3647
3648
colorswatch#add-color-button {
3649
border-radius: 2px 2px 0 0;
3650
color: #FFFFFF;
3651
}
3652
3653
colorswatch#add-color-button:only-child {
3654
border-radius: 2px;
3655
}
3656
3657
colorswatch#add-color-button overlay {
3658
background-image: linear-gradient(to right, #EF5350 25%, #FFA726 25%, #FFA726 50%, #66BB6A 50%, #66BB6A 75%, #42A5F5 75%);
3659
}
3660
3661
colorswatch:disabled {
3662
opacity: 0.5;
3663
}
3664
3665
colorswatch:disabled overlay {
3666
box-shadow: none;
3667
}
3668
3669
colorswatch#editor-color-sample {
3670
border-radius: 2.5px;
3671
}
3672
3673
colorswatch#editor-color-sample overlay {
3674
border-radius: 2px;
3675
}
3676
3677
colorchooser .popover.osd {
3678
transition: box-shadow 180ms cubic-bezier(0, 0, 0.2, 1);
3679
border-radius: 2px;
3680
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);
3681
background-color: #FFFFFF;
3682
}
3683
3684
colorchooser .popover.osd:backdrop {
3685
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);
3686
}
3687
3688
/********
3689
* Misc *
3690
********/
3691
.content-view {
3692
background-color: #F5F5F5;
3693
}
3694
3695
/**********************
3696
* Window Decorations *
3697
**********************/
3698
decoration {
3699
transition: box-shadow 180ms cubic-bezier(0, 0, 0.2, 1);
3700
border-radius: 2px 2px 0 0;
3701
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent;
3702
margin: 8px;
3703
}
3704
3705
decoration:backdrop {
3706
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent;
3707
}
3708
3709
.maximized decoration,
3710
.fullscreen decoration,
3711
.tiled decoration,
3712
.tiled-top decoration,
3713
.tiled-right decoration,
3714
.tiled-bottom decoration,
3715
.tiled-left decoration {
3716
border-radius: 0;
3717
}
3718
3719
.popup decoration {
3720
box-shadow: none;
3721
}
3722
3723
.ssd decoration {
3724
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16);
3725
}
3726
3727
.csd.popup decoration {
3728
border-radius: 2px;
3729
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3730
}
3731
3732
tooltip.csd decoration {
3733
border-radius: 2px;
3734
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3735
}
3736
3737
messagedialog.csd decoration {
3738
border-radius: 2px;
3739
}
3740
3741
.solid-csd decoration {
3742
margin: 0;
3743
border-radius: 0;
3744
box-shadow: none;
3745
background-color: #455A64;
3746
}
3747
3748
.view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3749
entry selection, modelbutton.flat:selected,
3750
.menuitem.button.flat:selected, popover.background.menu button:checked,
3751
popover.background button.model:checked, row:selected, calendar:selected, text:selected, .budgie-menu button:checked {
3752
background-color: #42A5F5;
3753
}
3754
3755
row:selected label, label:selected, .view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3756
entry selection, modelbutton.flat:selected,
3757
.menuitem.button.flat:selected, popover.background.menu button:checked,
3758
popover.background button.model:checked, row:selected, calendar:selected, text:selected, .budgie-menu button:checked {
3759
color: #FFFFFF;
3760
}
3761
3762
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,
3763
entry selection:disabled, modelbutton.flat:disabled:selected,
3764
.menuitem.button.flat:disabled:selected, popover.background.menu button:disabled:checked,
3765
popover.background button.model:disabled:checked, row:disabled:selected, calendar:disabled:selected, text:disabled:selected, .budgie-menu button:disabled:checked {
3766
color: rgba(255, 255, 255, 0.5);
3767
}
3768
3769
.monospace {
3770
font-family: monospace;
3771
}
3772
3773
/**********************
3774
* Touch Copy & Paste *
3775
**********************/
3776
cursor-handle {
3777
border-radius: 9999px;
3778
background-color: #FF4081;
3779
background-image: none;
3780
}
3781
3782
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) {
3783
padding-left: 6px;
3784
border-top-right-radius: 0;
3785
}
3786
3787
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) {
3788
padding-right: 6px;
3789
border-top-left-radius: 0;
3790
}
3791
3792
cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) {
3793
-GtkWidget-text-handle-width: 24;
3794
-GtkWidget-text-handle-height: 30;
3795
-gtk-icon-source: -gtk-scaled(url("assets/scale-horz-marks-before-slider.png"), url("assets/scale-horz-marks-before-slider@2.png"));
3796
}
3797
3798
.context-menu {
3799
font: initial;
3800
}
3801
3802
.keycap {
3803
min-width: 12px;
3804
min-height: 26px;
3805
margin-top: 2px;
3806
padding-bottom: 2px;
3807
padding-left: 8px;
3808
padding-right: 8px;
3809
border: solid 1px rgba(0, 0, 0, 0.12);
3810
border-radius: 3px;
3811
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.12);
3812
background-color: #FFFFFF;
3813
color: rgba(0, 0, 0, 0.87);
3814
font-size: smaller;
3815
}
3816
3817
:not(decoration):not(window):drop(active) {
3818
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
3819
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;
3820
caret-color: #FF4081;
3821
}
3822
3823
stackswitcher button.text-button {
3824
min-width: 100px;
3825
}
3826
3827
stackswitcher button.circular,
3828
stackswitcher button.text-button.circular {
3829
min-width: 32px;
3830
min-height: 32px;
3831
padding: 0;
3832
}
3833
3834
/*********
3835
* Emoji *
3836
*********/
3837
popover.emoji-picker {
3838
padding: 0;
3839
}
3840
3841
popover.emoji-picker entry {
3842
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
3843
border-bottom-left-radius: 0;
3844
border-bottom-right-radius: 0;
3845
box-shadow: none;
3846
}
3847
3848
popover.emoji-picker scrolledwindow {
3849
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
3850
}
3851
3852
button.emoji-section {
3853
margin-top: -1px;
3854
padding: 0 8px;
3855
min-width: 24px;
3856
min-height: 32px;
3857
border-radius: 0;
3858
outline-offset: -6px;
3859
box-shadow: none;
3860
}
3861
3862
button.emoji-section:hover {
3863
box-shadow: inset 0 2px rgba(0, 0, 0, 0.26);
3864
}
3865
3866
button.emoji-section:active {
3867
box-shadow: inset 0 2px #42A5F5;
3868
background-image: radial-gradient(circle farthest-corner at center, rgba(66, 165, 245, 0.7) 10%, transparent 0%);
3869
}
3870
3871
button.emoji-section:checked {
3872
box-shadow: inset 0 2px #42A5F5;
3873
background-color: transparent;
3874
}
3875
3876
button.emoji-section:first-child {
3877
margin-left: 4px;
3878
}
3879
3880
button.emoji-section:last-child {
3881
margin-right: 4px;
3882
}
3883
3884
.emoji {
3885
min-width: 3em;
3886
min-height: 3em;
3887
padding: 0;
3888
}
3889
3890
.emoji widget {
3891
transition: all 180ms cubic-bezier(0, 0, 0.2, 1);
3892
}
3893
3894
.emoji widget:hover {
3895
font-size: larger;
3896
}
3897
3898
/************
3899
* Nautilus *
3900
************/
3901
.nautilus-window,
3902
.nautilus-window notebook,
3903
.nautilus-window notebook > stack {
3904
background-color: #FFFFFF;
3905
}
3906
3907
.nautilus-desktop.nautilus-canvas-item:not(:selected), .caja-desktop.caja-canvas-item:not(:selected) {
3908
color: #FFFFFF;
3909
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3910
}
3911
3912
@keyframes needs_attention_keyframes {
3913
to {
3914
background-color: alpha(currentColor, 0.3);
3915
}
3916
}
3917
3918
.nautilus-operations-button-needs-attention {
3919
animation: needs_attention_keyframes 270ms cubic-bezier(0.4, 0, 0.2, 1) 2 alternate;
3920
}
3921
3922
.nautilus-operations-button-needs-attention-multiple {
3923
animation: needs_attention_keyframes 270ms cubic-bezier(0.4, 0, 0.2, 1) 4 alternate;
3924
}
3925
3926
.nautilus-window .floating-bar {
3927
min-height: 32px;
3928
padding: 0;
3929
border-style: solid solid none;
3930
border-width: 1px;
3931
border-color: rgba(0, 0, 0, 0.12);
3932
border-radius: 3px 3px 0 0;
3933
background-color: #FFFFFF;
3934
background-clip: padding-box;
3935
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), border-width 0;
3936
}
3937
3938
.nautilus-window .floating-bar.bottom.left {
3939
margin-right: 7px;
3940
border-left-style: none;
3941
border-top-left-radius: 0;
3942
}
3943
3944
.nautilus-window .floating-bar.bottom.right {
3945
margin-left: 7px;
3946
border-right-style: none;
3947
border-top-right-radius: 0;
3948
}
3949
3950
.nautilus-window .floating-bar button {
3951
margin: 6px;
3952
}
3953
3954
.disk-space-display.unknown {
3955
background-color: #FF6D00;
3956
}
3957
3958
.disk-space-display.used {
3959
background-color: #42A5F5;
3960
}
3961
3962
.disk-space-display.free {
3963
background-color: rgba(0, 0, 0, 0.12);
3964
}
3965
3966
.nautilus-window searchbar {
3967
border-top: 1px solid rgba(0, 0, 0, 0.12);
3968
}
3969
3970
.nautilus-window .searchbar-container {
3971
margin-top: -1px;
3972
}
3973
3974
.nautilus-window paned > separator {
3975
background-color: #F5F5F5;
3976
}
3977
3978
/*********
3979
* gedit *
3980
*********/
3981
.open-document-selector-path-label {
3982
color: rgba(0, 0, 0, 0.54);
3983
font-size: smaller;
3984
}
3985
3986
.open-document-selector-path-label:selected {
3987
color: rgba(255, 255, 255, 0.7);
3988
}
3989
3990
.gedit-document-panel {
3991
background-color: #FAFAFA;
3992
}
3993
3994
.gedit-document-panel row button.flat {
3995
margin-top: 8px;
3996
margin-bottom: 8px;
3997
}
3998
3999
.gedit-document-panel-group-row:not(:first-child) {
4000
border-top: 1px solid rgba(0, 0, 0, 0.12);
4001
}
4002
4003
.gedit-side-panel-paned statusbar {
4004
border-top: 1px solid rgba(0, 0, 0, 0.12);
4005
}
4006
4007
.gedit-search-slider {
4008
margin: 4px 4px 8px;
4009
}
4010
4011
.gedit-search-slider entry:dir(ltr), .gedit-search-slider entry:dir(rtl) {
4012
border-radius: 2px;
4013
}
4014
4015
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag, .gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
4016
all: unset;
4017
color: rgba(0, 0, 0, 0.38);
4018
}
4019
4020
.gedit-search-slider entry:dir(ltr) {
4021
margin-right: -58px;
4022
padding-right: 58px;
4023
}
4024
4025
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag {
4026
margin-left: 6px;
4027
}
4028
4029
.gedit-search-slider entry:dir(ltr) image.right {
4030
margin-right: 0;
4031
}
4032
4033
.gedit-search-slider entry:dir(rtl) {
4034
margin-left: -58px;
4035
padding-left: 58px;
4036
}
4037
4038
.gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
4039
margin-right: 6px;
4040
}
4041
4042
.gedit-search-slider entry:dir(rtl) image.left {
4043
margin-left: 0;
4044
}
4045
4046
.gedit-search-slider entry.error ~ button {
4047
color: rgba(255, 255, 255, 0.7);
4048
}
4049
4050
.gedit-search-slider entry.error ~ button:hover, .gedit-search-slider entry.error ~ button:active {
4051
color: #FFFFFF;
4052
}
4053
4054
.gedit-search-slider entry.error ~ button:disabled {
4055
color: rgba(255, 255, 255, 0.3);
4056
}
4057
4058
.gedit-search-slider button {
4059
border: solid 6px transparent;
4060
}
4061
4062
.gedit-search-slider button:last-child:dir(ltr), .gedit-search-slider button:not(:first-child):dir(rtl) {
4063
margin-left: -3px;
4064
}
4065
4066
.gedit-search-slider button:first-child:dir(rtl), .gedit-search-slider button:not(:last-child):dir(ltr) {
4067
margin-right: -3px;
4068
}
4069
4070
frame.gedit-map-frame > border:dir(ltr) {
4071
border-style: none none none solid;
4072
}
4073
4074
frame.gedit-map-frame > border:dir(rtl) {
4075
border-style: none solid none none;
4076
}
4077
4078
/**************
4079
* Tweak Tool *
4080
**************/
4081
.tweak-categories {
4082
background-image: image(#FAFAFA);
4083
}
4084
4085
.tweak {
4086
padding: 3px;
4087
}
4088
4089
.tweak.title:hover {
4090
box-shadow: none;
4091
}
4092
4093
.tweak-group-white,
4094
.tweak-white,
4095
.tweak-white:hover {
4096
background-image: image(#FFFFFF);
4097
}
4098
4099
.tweak-startup,
4100
.tweak-startup:hover {
4101
background-image: image(#FFFFFF);
4102
}
4103
4104
.tweak-group-startup {
4105
background-image: image(#FFFFFF);
4106
border: 1px solid rgba(0, 0, 0, 0.12);
4107
}
4108
4109
/***********
4110
* Builder *
4111
***********/
4112
workbench stack.titlebar {
4113
padding: 0;
4114
}
4115
4116
workbench:not(.tiled):not(.maximized):not(.fullscreen) stack.titlebar headerbar {
4117
border-radius: 2px 2px 0 0;
4118
}
4119
4120
perspectiveswitcher {
4121
background-color: #F5F5F5;
4122
}
4123
4124
perspectiveswitcher button:checked {
4125
color: #42A5F5;
4126
}
4127
4128
layouttabbar {
4129
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
4130
background-color: #F5F5F5;
4131
}
4132
4133
layouttabbar > box > button {
4134
margin: 4px 0;
4135
}
4136
4137
layouttab {
4138
margin: 0 8px;
4139
border-style: none solid;
4140
border-width: 1px;
4141
border-color: rgba(0, 0, 0, 0.12);
4142
box-shadow: inset 0 -2px #42A5F5;
4143
background-color: #FFFFFF;
4144
}
4145
4146
layouttab separator.vertical {
4147
margin: 8px 4px;
4148
}
4149
4150
layouttab button.text-button, layouttab button.image-button, layouttab button {
4151
margin-top: 8px;
4152
margin-bottom: 8px;
4153
padding: 0 4px;
4154
}
4155
4156
layout {
4157
border: 1px solid rgba(0, 0, 0, 0.12);
4158
-PnlDockBin-handle-size: 1;
4159
}
4160
4161
entry.search-missing {
4162
background-color: #DD2C00;
4163
color: #FFFFFF;
4164
}
4165
4166
workbench treeview.image {
4167
color: rgba(0, 0, 0, 0.54);
4168
}
4169
4170
workbench treeview.image:selected {
4171
color: rgba(255, 255, 255, 0.7);
4172
}
4173
4174
dockbin {
4175
border: 1px solid rgba(0, 0, 0, 0.12);
4176
-PnlDockBin-handle-size: 1;
4177
}
4178
4179
dockpaned {
4180
border: 1px solid rgba(0, 0, 0, 0.12);
4181
}
4182
4183
eggsearchbar box.search-bar {
4184
padding: 0 8px;
4185
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
4186
background-color: #F5F5F5;
4187
}
4188
4189
docktabstrip {
4190
padding: 0 8px;
4191
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
4192
background-color: #F5F5F5;
4193
}
4194
4195
docktab {
4196
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
4197
min-height: 20px;
4198
min-width: 20px;
4199
margin-bottom: -1px;
4200
padding: 6px 6px;
4201
outline-offset: -6px;
4202
border-width: 1px;
4203
border-color: transparent;
4204
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 10%, transparent 0%);
4205
background-repeat: no-repeat;
4206
background-position: center;
4207
background-size: 0% 0%;
4208
color: rgba(0, 0, 0, 0.54);
4209
font-weight: 500;
4210
}
4211
4212
docktab:hover {
4213
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.26);
4214
color: rgba(0, 0, 0, 0.87);
4215
}
4216
4217
docktab:checked {
4218
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), background-size 270ms cubic-bezier(0, 0, 0.2, 1), background-image 720ms cubic-bezier(0, 0, 0.2, 1);
4219
box-shadow: inset 0 -2px #42A5F5;
4220
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
4221
background-size: 1000% 1000%;
4222
color: rgba(0, 0, 0, 0.87);
4223
}
4224
4225
dockoverlayedge {
4226
background-color: #F5F5F5;
4227
}
4228
4229
dockoverlayedge docktabstrip {
4230
padding: 0;
4231
border: none;
4232
}
4233
4234
dockoverlayedge.left-edge docktab:hover {
4235
box-shadow: inset -2px 0 rgba(0, 0, 0, 0.26);
4236
}
4237
4238
dockoverlayedge.left-edge docktab:checked {
4239
box-shadow: inset -2px 0 #42A5F5;
4240
}
4241
4242
dockoverlayedge.right-edge docktab:hover {
4243
box-shadow: inset 2px 0 rgba(0, 0, 0, 0.26);
4244
}
4245
4246
dockoverlayedge.right-edge docktab:checked {
4247
box-shadow: inset 2px 0 #42A5F5;
4248
}
4249
4250
pillbox {
4251
background-color: #F5F5F5;
4252
border-radius: 2px;
4253
}
4254
4255
buildperspective row {
4256
padding: 10px;
4257
}
4258
4259
layoutpane entry.search {
4260
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12);
4261
background-color: #FFFFFF;
4262
}
4263
4264
editortweak entry.search {
4265
margin-bottom: -1px;
4266
box-shadow: none;
4267
}
4268
4269
frame.gb-search-frame {
4270
border-bottom-right-radius: 5px;
4271
}
4272
4273
.gb-search-entry-occurrences-tag {
4274
box-shadow: none;
4275
background-color: transparent;
4276
}
4277
4278
docktabstrip {
4279
min-height: 39px;
4280
}
4281
4282
workbench preferences preferencesgroup list entry {
4283
padding-top: 8px;
4284
padding-bottom: 8px;
4285
}
4286
4287
/**********
4288
* Photos *
4289
**********/
4290
GdMainIconView.content-view {
4291
-GdMainIconView-icon-size: 48;
4292
}
4293
4294
.documents-counter {
4295
margin: 8px;
4296
border-radius: 9999px;
4297
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
4298
background-color: #FF4081;
4299
color: #FFFFFF;
4300
font-weight: bold;
4301
}
4302
4303
.documents-scrolledwin.frame {
4304
border-style: none;
4305
}
4306
4307
.photos-fade-in {
4308
opacity: 1;
4309
transition: opacity 180ms cubic-bezier(0, 0, 0.2, 1);
4310
}
4311
4312
.photos-fade-out {
4313
opacity: 0;
4314
transition: opacity 180ms cubic-bezier(0, 0, 0.2, 1);
4315
}
4316
4317
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) {
4318
border-style: none none none solid;
4319
}
4320
4321
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(rtl) {
4322
border-style: none solid none none;
4323
}
4324
4325
/*********
4326
* Music *
4327
*********/
4328
.side-panel:dir(ltr) {
4329
border-style: solid;
4330
border-color: rgba(0, 0, 0, 0.12);
4331
}
4332
4333
.side-panel:dir(rtl) {
4334
border-style: solid;
4335
border-color: rgba(0, 0, 0, 0.12);
4336
}
4337
4338
.side-panel .view {
4339
background-image: image(#FAFAFA);
4340
}
4341
4342
.side-panel .view:hover {
4343
background-image: image(rgba(240, 240, 240, 0.9935));
4344
}
4345
4346
.side-panel .view:selected {
4347
background-image: image(#42A5F5);
4348
}
4349
4350
.side-panel .view:selected:hover {
4351
background-image: image(#4baaf6);
4352
}
4353
4354
.songs-list:hover {
4355
background-image: image(alpha(currentColor, 0.05));
4356
}
4357
4358
frame.documents-dropdown {
4359
margin: 8px;
4360
}
4361
4362
frame.documents-dropdown > border {
4363
border: none;
4364
}
4365
4366
box.vertical:not(.titlebar) > revealer > toolbar.search-bar {
4367
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
4368
}
4369
4370
box.vertical:not(.titlebar) > revealer > toolbar.search-bar button > widget {
4371
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4372
}
4373
4374
/*********
4375
* To Do *
4376
*********/
4377
task-row {
4378
transition: all 180ms cubic-bezier(0, 0, 0.2, 1);
4379
margin: 0 -4px;
4380
}
4381
4382
task-row:hover {
4383
transition: none;
4384
}
4385
4386
task-row label {
4387
margin: 0 8px;
4388
}
4389
4390
task-row image {
4391
margin: 0 4px;
4392
}
4393
4394
task-list-view > box > revealer > box > button {
4395
min-height: 32px;
4396
margin: -4px;
4397
padding: 0 12px;
4398
}
4399
4400
task-list-view > box > revealer > box > button label {
4401
margin: 0 8px;
4402
}
4403
4404
task-list-view > box > revealer > box > button image {
4405
margin: 0 4px;
4406
}
4407
4408
/*******
4409
* eog *
4410
*******/
4411
#eog-thumb-nav scrolledwindow {
4412
border-top: none;
4413
}
4414
4415
#eog-thumb-nav button {
4416
-gtk-outline-radius: 2px;
4417
}
4418
4419
/*************
4420
* Evolution *
4421
*************/
4422
frame.taskbar > border {
4423
border-style: solid none none;
4424
}
4425
4426
box.vertical > paned.horizontal notebook widget .frame {
4427
border-style: none;
4428
}
4429
4430
/********
4431
* gitg *
4432
********/
4433
frame.commit-frame > border {
4434
border-style: solid none none;
4435
}
4436
4437
/**************
4438
* Characters *
4439
**************/
4440
box.dialog-vbox scrolledwindow.related {
4441
border: 1px solid rgba(0, 0, 0, 0.12);
4442
}
4443
4444
list.categories {
4445
background-image: image(#FAFAFA);
4446
}
4447
4448
/*********
4449
* Boxes *
4450
*********/
4451
.transparent-bg + stack overlay > label {
4452
min-height: 24px;
4453
padding: 0 4px;
4454
border-radius: 2px;
4455
background-color: rgba(0, 0, 0, 0.3);
4456
color: #FFFFFF;
4457
}
4458
4459
/**************
4460
* Calculator *
4461
**************/
4462
button.title label {
4463
min-height: 32px;
4464
}
4465
4466
/*********
4467
* Geary *
4468
*********/
4469
.geary-titlebar-left:dir(ltr) {
4470
margin-right: 5px;
4471
padding-right: 0;
4472
}
4473
4474
.geary-titlebar-left:dir(rtl) {
4475
margin-left: 5px;
4476
padding-left: 0;
4477
}
4478
4479
.geary-titlebar-left > separator {
4480
background-color: rgba(0, 0, 0, 0.05);
4481
}
4482
4483
.geary-titlebar-right:dir(ltr) {
4484
margin-left: -5px;
4485
}
4486
4487
.geary-titlebar-right:dir(rtl) {
4488
margin-right: -5px;
4489
}
4490
4491
/*********
4492
* Tilix *
4493
*********/
4494
overlay > revealer.left > scrolledwindow.frame,
4495
overlay > revealer.right > scrolledwindow.frame {
4496
border-style: none;
4497
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22);
4498
}
4499
4500
overlay > revealer.left > scrolledwindow.frame {
4501
margin-right: 32px;
4502
}
4503
4504
overlay > revealer.right > scrolledwindow.frame {
4505
margin-left: 32px;
4506
}
4507
4508
.terminix-session-sidebar,
4509
.tilix-session-sidebar {
4510
background-image: image(#FAFAFA);
4511
}
4512
4513
button.image-button.session-new-button {
4514
min-width: 28px;
4515
}
4516
4517
/***********
4518
* Eclipse *
4519
***********/
4520
window.background > box.vertical > scrolledwindow > widget toolbar {
4521
padding: 2px;
4522
}
4523
4524
window.background > box.vertical > scrolledwindow > widget toolbar separator,
4525
window.background > box.vertical > scrolledwindow > widget toolbar button {
4526
margin: 2px;
4527
}
4528
4529
window.background > box.vertical > scrolledwindow > widget toolbar button {
4530
border-radius: 2px;
4531
}
4532
4533
/************
4534
* Chromium *
4535
************/
4536
tooltip.chromium {
4537
background-color: #FFFFFF;
4538
}
4539
4540
/***********
4541
* Firefox *
4542
***********/
4543
window.background:not(.csd) > widget > separator {
4544
color: rgba(0, 0, 0, 0.26);
4545
}
4546
4547
window.background:not(.csd) > widget > scrollbar {
4548
background-clip: border-box;
4549
}
4550
4551
window.background:not(.csd) > widget > scrollbar,
4552
window.background:not(.csd) > widget > frame > border {
4553
border-color: rgba(0, 0, 0, 0.26);
4554
}
4555
4556
window.background:not(.csd) > widget > entry,
4557
window.background:not(.csd) > widget > button > button {
4558
border: 1px solid rgba(0, 0, 0, 0.26);
4559
border-radius: 3px;
4560
box-shadow: none;
4561
}
4562
4563
window.background:not(.csd) > widget > entry {
4564
min-height: 30px;
4565
}
4566
4567
window.background:not(.csd) > widget > entry:focus {
4568
border-color: #42A5F5;
4569
}
4570
4571
window.background:not(.csd) > widget > button > button {
4572
padding: 4px 8px;
4573
background-size: auto;
4574
}
4575
4576
window.background:not(.csd) > widget > button > button:hover {
4577
background-image: image(alpha(currentColor, 0.05));
4578
}
4579
4580
window.background:not(.csd) > widget > button > button:active {
4581
background-image: image(alpha(currentColor, 0.1));
4582
}
4583
4584
window.background:not(.csd) > window > menu,
4585
window.background:not(.csd) > menu > menu {
4586
border: none;
4587
}
4588
4589
window.background:not(.csd) > widget > menubar {
4590
color: rgba(255, 255, 255, 0.7);
4591
}
4592
4593
window.background:not(.csd) > widget > menubar:hover {
4594
color: #FFFFFF;
4595
}
4596
4597
window.background:not(.csd) > widget > menubar:disabled {
4598
color: rgba(255, 255, 255, 0.3);
4599
}
4600
4601
window.background:not(.csd) > widget > frame {
4602
color: rgba(0, 0, 0, 0.26);
4603
}
4604
4605
window.background:not(.csd) > widget > checkbutton > check,
4606
window.background:not(.csd) > widget > radiobutton > radio {
4607
margin: 0;
4608
padding: 0;
4609
}
4610
4611
window.background:not(.csd) > window.background > menu > separator {
4612
color: rgba(0, 0, 0, 0.12);
4613
}
4614
4615
/************
4616
* Inkscape *
4617
************/
4618
#ToolboxCommon > #AuxToolbox #StyleSwatch {
4619
font-size: smaller;
4620
}
4621
4622
#ToolboxCommon > #AuxToolbox #Kludge {
4623
padding: 0;
4624
}
4625
4626
#ToolboxCommon > #AuxToolbox spinbutton,
4627
#ToolboxCommon > #AuxToolbox entry {
4628
min-height: 32px;
4629
}
4630
4631
#ToolboxCommon > #AuxToolbox button:not(.up):not(.down) {
4632
min-height: 24px;
4633
min-width: 16px;
4634
padding: 4px 8px;
4635
border-radius: 2px;
4636
-gtk-outline-radius: 2px;
4637
}
4638
4639
#ToolboxCommon > #AuxToolbox spinbutton button {
4640
border-width: 4px;
4641
}
4642
4643
#ToolboxCommon > toolbar.vertical {
4644
margin-top: -4px;
4645
}
4646
4647
#ToolboxCommon > toolbar.vertical button {
4648
min-height: 24px;
4649
min-width: 24px;
4650
padding: 4px;
4651
border-radius: 2px;
4652
-gtk-outline-radius: 2px;
4653
}
4654
4655
#CanvasTable button {
4656
min-height: 16px;
4657
min-width: 16px;
4658
padding: 0;
4659
}
4660
4661
#CanvasTable #HorizontalScrollbar {
4662
border-top: 1px solid rgba(0, 0, 0, 0.12);
4663
}
4664
4665
#CanvasTable #VerticalScrollbar:dir(ltr) {
4666
border-left: 1px solid rgba(0, 0, 0, 0.12);
4667
}
4668
4669
#CanvasTable #VerticalScrollbar:dir(rtl) {
4670
border-right: 1px solid rgba(0, 0, 0, 0.12);
4671
}
4672
4673
#Canvas_and_Dock frame > border {
4674
border: none;
4675
}
4676
4677
#Canvas_and_Dock widget > widget > button.flat {
4678
min-height: 16px;
4679
min-width: 16px;
4680
padding: 4px;
4681
}
4682
4683
#Canvas_and_Dock widget > widget > box.horizontal image {
4684
padding: 4px;
4685
}
4686
4687
#Canvas_and_Dock box.horizontal > box.vertical > button.flat {
4688
min-height: 16px;
4689
min-width: 24px;
4690
padding: 8px 4px;
4691
}
4692
4693
/***********
4694
* Synapse *
4695
***********/
4696
box.vertical > widget > widget:selected {
4697
background-color: #42A5F5;
4698
}
4699
4700
/*********
4701
* Unity *
4702
*********/
4703
UnityDecoration {
4704
-UnityDecoration-extents: 28px 0 0 0;
4705
-UnityDecoration-input-extents: 8px;
4706
-UnityDecoration-shadow-offset-x: 0;
4707
-UnityDecoration-shadow-offset-y: 3px;
4708
-UnityDecoration-active-shadow-color: rgba(0, 0, 0, 0.48);
4709
-UnityDecoration-active-shadow-radius: 18px;
4710
-UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32);
4711
-UnityDecoration-inactive-shadow-radius: 6px;
4712
-UnityDecoration-glow-size: 8px;
4713
-UnityDecoration-glow-color: #42A5F5;
4714
-UnityDecoration-title-indent: 4px;
4715
-UnityDecoration-title-fade: 32px;
4716
-UnityDecoration-title-alignment: 0.0;
4717
}
4718
4719
UnityDecoration .top {
4720
padding: 0 2px;
4721
border-style: none;
4722
border-radius: 2px 2px 0 0;
4723
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
4724
background-color: #37474F;
4725
color: #FFFFFF;
4726
}
4727
4728
UnityDecoration .top:backdrop {
4729
color: rgba(255, 255, 255, 0.7);
4730
}
4731
4732
UnityDecoration .menuitem {
4733
color: rgba(255, 255, 255, 0.7);
4734
}
4735
4736
UnityDecoration .menuitem:hover {
4737
box-shadow: inset 0 -2px currentColor;
4738
background-color: transparent;
4739
color: #FFFFFF;
4740
}
4741
4742
.background:not(.csd) headerbar:not(.titlebar) {
4743
border-radius: 0;
4744
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
4745
}
4746
4747
.background:not(.csd) headerbar:not(.titlebar).inline-toolbar {
4748
border-style: none;
4749
}
4750
4751
UnityPanelWidget,
4752
.unity-panel {
4753
background-color: #263238;
4754
color: #FFFFFF;
4755
}
4756
4757
UnityPanelWidget:backdrop,
4758
.unity-panel:backdrop {
4759
color: rgba(255, 255, 255, 0.7);
4760
}
4761
4762
.unity-panel.menuitem,
4763
.unity-panel .menuitem {
4764
color: rgba(255, 255, 255, 0.7);
4765
}
4766
4767
.unity-panel.menubar.menuitem:hover,
4768
.unity-panel.menubar .menuitem *:hover {
4769
box-shadow: inset 0 -2px currentColor;
4770
background-color: transparent;
4771
color: #FFFFFF;
4772
}
4773
4774
.menu IdoPlaybackMenuItem.menuitem:active {
4775
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
4776
animation: spin 1s linear infinite;
4777
color: #42A5F5;
4778
}
4779
4780
/**************
4781
* Mate-Panel *
4782
**************/
4783
.mate-panel-menu-bar menubar,
4784
#PanelApplet-window-menu-applet-button {
4785
background-color: transparent;
4786
}
4787
4788
.mate-panel-menu-bar {
4789
background-color: #263238;
4790
font-weight: 500;
4791
}
4792
4793
.mate-panel-menu-bar:not(.popup) {
4794
color: rgba(255, 255, 255, 0.7);
4795
}
4796
4797
.mate-panel-menu-bar button {
4798
min-height: 16px;
4799
min-width: 16px;
4800
padding: 0;
4801
border-radius: 0;
4802
}
4803
4804
.mate-panel-menu-bar button:checked {
4805
background-color: rgba(255, 255, 255, 0.12);
4806
}
4807
4808
PanelToplevel.horizontal > grid > button {
4809
min-width: 24px;
4810
}
4811
4812
PanelToplevel.vertical > grid > button {
4813
min-height: 24px;
4814
}
4815
4816
PanelSeparator {
4817
color: rgba(255, 255, 255, 0.12);
4818
}
4819
4820
MatePanelAppletFrameDBus {
4821
border-style: solid;
4822
border-color: rgba(255, 255, 255, 0.12);
4823
}
4824
4825
.mate-panel-menu-bar.horizontal MatePanelAppletFrameDBus {
4826
border-width: 0 1px;
4827
}
4828
4829
.mate-panel-menu-bar.vertical MatePanelAppletFrameDBus {
4830
border-width: 1px 0;
4831
}
4832
4833
.mate-panel-menu-bar menubar > menuitem {
4834
color: rgba(255, 255, 255, 0.7);
4835
}
4836
4837
.mate-panel-menu-bar menubar > menuitem:hover {
4838
background-color: rgba(255, 255, 255, 0.12);
4839
color: #FFFFFF;
4840
}
4841
4842
.mate-panel-menu-bar menubar > menuitem:disabled {
4843
color: rgba(255, 255, 255, 0.3);
4844
}
4845
4846
.mate-panel-menu-bar.horizontal menubar > menuitem {
4847
padding: 0 8px;
4848
}
4849
4850
.mate-panel-menu-bar.vertical menubar > menuitem {
4851
padding: 8px 0;
4852
}
4853
4854
.mate-panel-menu-bar menubar menu > menuitem {
4855
min-height: 28px;
4856
padding: 0 6px;
4857
}
4858
4859
.mate-panel-menu-bar #PanelApplet button {
4860
-GtkWidget-window-dragging: true;
4861
}
4862
4863
.mate-panel-menu-bar #tasklist-button {
4864
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px;
4865
}
4866
4867
.mate-panel-menu-bar #tasklist-button:checked {
4868
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
4869
}
4870
4871
.mate-panel-menu-bar #tasklist-button image:dir(ltr), .mate-panel-menu-bar #tasklist-button label:dir(rtl) {
4872
padding-left: 4px;
4873
}
4874
4875
.mate-panel-menu-bar #tasklist-button label:dir(ltr), .mate-panel-menu-bar #tasklist-button image:dir(rtl) {
4876
padding-right: 4px;
4877
}
4878
4879
.mate-panel-menu-bar.vertical #tasklist-button {
4880
min-height: 32px;
4881
}
4882
4883
.mate-panel-menu-bar.horizontal #showdesktop-button image {
4884
min-width: 24px;
4885
padding: 0 4px;
4886
}
4887
4888
.mate-panel-menu-bar.vertical #showdesktop-button image {
4889
min-height: 24px;
4890
padding: 4px 0;
4891
}
4892
4893
PanelApplet.wnck-applet .wnck-pager {
4894
background-color: transparent;
4895
color: #40C4FF;
4896
}
4897
4898
PanelApplet.wnck-applet .wnck-pager:hover {
4899
background-color: rgba(255, 255, 255, 0.12);
4900
}
4901
4902
PanelApplet.wnck-applet .wnck-pager:active {
4903
background-color: rgba(255, 255, 255, 0.3);
4904
}
4905
4906
PanelApplet.wnck-applet .wnck-pager:selected {
4907
background-color: #42A5F5;
4908
}
4909
4910
.mate-panel-menu-bar.horizontal #clock-applet-button label {
4911
padding: 0 8px;
4912
}
4913
4914
.mate-panel-menu-bar.vertical #clock-applet-button label {
4915
padding: 8px 0;
4916
}
4917
4918
#MatePanelPopupWindow {
4919
border: 1px solid rgba(0, 0, 0, 0.12);
4920
border-radius: 3px;
4921
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
4922
}
4923
4924
#MatePanelPopupWindow frame > border {
4925
border-style: none;
4926
}
4927
4928
#MatePanelPopupWindow button {
4929
padding: 4px 16px;
4930
}
4931
4932
#MatePanelPopupWindow ClockMap {
4933
border: 1px solid rgba(0, 0, 0, 0.12);
4934
}
4935
4936
#MatePanelPopupWindow widget {
4937
color: rgba(0, 0, 0, 0.12);
4938
}
4939
4940
na-tray-applet {
4941
-NaTrayApplet-icon-padding: 3px;
4942
-NaTrayApplet-icon-size: 16;
4943
}
4944
4945
.mate-panel-menu-bar {
4946
-PanelMenuBar-icon-visible: true;
4947
}
4948
4949
.mate-panel-applet-slider {
4950
border: 1px solid rgba(0, 0, 0, 0.12);
4951
border-radius: 3px;
4952
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
4953
background-color: #F5F5F5;
4954
}
4955
4956
.mate-panel-applet-slider frame > border {
4957
border-style: none;
4958
}
4959
4960
#PanelApplet:not(:selected) > box {
4961
transition: all 180ms cubic-bezier(0, 0, 0.2, 1);
4962
}
4963
4964
#PanelApplet:selected > box {
4965
background-color: rgba(255, 255, 255, 0.12);
4966
color: #FFFFFF;
4967
}
4968
4969
#mate-menu {
4970
border: 1px solid rgba(0, 0, 0, 0.12);
4971
}
4972
4973
#mate-menu button {
4974
min-height: 24px;
4975
min-width: 24px;
4976
padding: 4px 0;
4977
color: rgba(0, 0, 0, 0.87);
4978
font-weight: normal;
4979
}
4980
4981
#mate-menu button label:not(:first-child) {
4982
color: rgba(0, 0, 0, 0.54);
4983
}
4984
4985
#mate-menu entry {
4986
margin: 0 0 8px;
4987
}
4988
4989
#mate-menu entry image {
4990
margin: 0;
4991
}
4992
4993
#mate-menu entry + button {
4994
margin: 0 4px 8px;
4995
padding: 4px;
4996
}
4997
4998
/*********************
4999
* CAJA File manager *
5000
*********************/
5001
.caja-navigation-window button.toggle.image-button {
5002
border-radius: 2px;
5003
}
5004
5005
.caja-pathbar button {
5006
margin: 0 -1px 0 -2px;
5007
}
5008
5009
.caja-pathbar button > widget {
5010
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
5011
-GtkArrow-arrow-scaling: 1;
5012
}
5013
5014
.caja-side-pane notebook viewport.frame,
5015
.caja-side-pane notebook widget .vertical {
5016
background-color: #FFFFFF;
5017
}
5018
5019
.caja-side-pane notebook,
5020
.caja-notebook {
5021
border-top: 1px solid rgba(0, 0, 0, 0.12);
5022
}
5023
5024
.caja-side-pane notebook .frame,
5025
.caja-notebook .frame {
5026
border-style: none;
5027
}
5028
5029
.caja-navigation-window statusbar {
5030
margin: 0 -10px;
5031
padding: 0 4px;
5032
border-top: 1px solid rgba(0, 0, 0, 0.12);
5033
}
5034
5035
.caja-notebook frame > border {
5036
border-style: none;
5037
}
5038
5039
#caja-extra-view-widget {
5040
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
5041
background-color: #F5F5F5;
5042
}
5043
5044
#caja-extra-view-widget > box > box > label {
5045
font-weight: bold;
5046
}
5047
5048
/*********
5049
* Pluma *
5050
*********/
5051
.pluma-window statusbar {
5052
margin: 0 -10px;
5053
padding: 0 4px;
5054
border-top: 1px solid rgba(0, 0, 0, 0.12);
5055
}
5056
5057
.pluma-window statusbar frame > border {
5058
border-style: none;
5059
}
5060
5061
.pluma-window statusbar frame button.flat {
5062
padding: 0 4px;
5063
border-radius: 0;
5064
}
5065
5066
.pluma-window statusbar frame button.flat widget {
5067
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
5068
-GtkArrow-arrow-scaling: 1;
5069
}
5070
5071
.pluma-print-preview toolbar {
5072
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
5073
}
5074
5075
.pluma-window paned.horizontal box.vertical box.horizontal button.flat {
5076
margin: 1px;
5077
}
5078
5079
.pluma-window paned.horizontal box.vertical .frame {
5080
border-style: none;
5081
}
5082
5083
.pluma-window paned.horizontal box.vertical notebook.frame {
5084
margin-top: -1px;
5085
border-top: 1px solid rgba(0, 0, 0, 0.12);
5086
}
5087
5088
.pluma-window paned.horizontal box.vertical notebook.frame box.vertical toolbar.horizontal {
5089
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
5090
}
5091
5092
/*********
5093
* Atril *
5094
*********/
5095
.atril-window paned.horizontal box.vertical .frame {
5096
border-style: none;
5097
}
5098
5099
.atril-window paned.horizontal box.vertical notebook .frame {
5100
border-top: 1px solid rgba(0, 0, 0, 0.12);
5101
}
5102
5103
/* mate-screensaver lock dialog */
5104
.lock-dialog {
5105
border-radius: 2px;
5106
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);
5107
}
5108
5109
.lock-dialog frame > border {
5110
border-style: none;
5111
}
5112
5113
/******************
5114
* Budgie Desktop *
5115
******************/
5116
.budgie-container {
5117
background-color: transparent;
5118
}
5119
5120
.budgie-settings-window buttonbox.inline-toolbar {
5121
border-style: none none solid;
5122
}
5123
5124
.budgie-settings-window buttonbox.inline-toolbar button {
5125
border-radius: 2px;
5126
-gtk-outline-radius: 2px;
5127
}
5128
5129
.budgie-popover {
5130
border-style: solid;
5131
border-width: 1px;
5132
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3);
5133
border-radius: 3px;
5134
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
5135
background-color: #FAFAFA;
5136
}
5137
5138
.budgie-popover .container {
5139
padding: 2px;
5140
}
5141
5142
.budgie-popover border {
5143
border: none;
5144
}
5145
5146
.budgie-popover list {
5147
background-color: transparent;
5148
}
5149
5150
.budgie-popover row {
5151
padding: 0;
5152
}
5153
5154
.budgie-popover row:hover {
5155
box-shadow: none;
5156
}
5157
5158
.budgie-popover:not(.budgie-menu) button.flat:not(.image-button) {
5159
min-height: 28px;
5160
padding: 0 8px;
5161
color: rgba(0, 0, 0, 0.87);
5162
font-weight: normal;
5163
}
5164
5165
.budgie-popover:not(.budgie-menu) button.flat:not(.image-button):disabled {
5166
color: rgba(0, 0, 0, 0.38);
5167
}
5168
5169
.budgie-popover.budgie-menu .container {
5170
padding: 0;
5171
}
5172
5173
.budgie-popover.user-menu .container {
5174
padding: 8px;
5175
}
5176
5177
.budgie-popover.user-menu separator {
5178
margin: 4px 0;
5179
}
5180
5181
.budgie-popover.sound-popover separator {
5182
margin: 3px 0;
5183
}
5184
5185
.budgie-popover.night-light-indicator .container {
5186
padding: 8px;
5187
}
5188
5189
.budgie-popover.places-menu .container {
5190
padding: 8px;
5191
}
5192
5193
.budgie-popover.places-menu .places-list:not(.always-expand) {
5194
margin-top: 4px;
5195
padding-top: 4px;
5196
border-top: 1px solid rgba(0, 0, 0, 0.12);
5197
}
5198
5199
.budgie-popover.places-menu .alternative-label {
5200
padding: 3px;
5201
font-size: 15px;
5202
}
5203
5204
.budgie-popover.workspace-popover .container {
5205
padding: 2px 8px 8px;
5206
}
5207
5208
.budgie-popover.workspace-popover separator {
5209
margin: 4px 0;
5210
}
5211
5212
.budgie-popover.workspace-popover flowboxchild {
5213
padding: 0;
5214
}
5215
5216
.workspace-switcher .workspace-layout {
5217
border: 0 solid rgba(255, 255, 255, 0.12);
5218
}
5219
5220
.top .workspace-switcher .workspace-layout:dir(ltr),
5221
.bottom .workspace-switcher .workspace-layout:dir(ltr) {
5222
border-left-width: 1px;
5223
}
5224
5225
.top .workspace-switcher .workspace-layout:dir(rtl),
5226
.bottom .workspace-switcher .workspace-layout:dir(rtl) {
5227
border-right-width: 1px;
5228
}
5229
5230
.left .workspace-switcher .workspace-layout,
5231
.right .workspace-switcher .workspace-layout {
5232
border-top-width: 1px;
5233
}
5234
5235
.workspace-switcher .workspace-item,
5236
.workspace-switcher .workspace-add-button {
5237
border: 0 solid rgba(255, 255, 255, 0.12);
5238
}
5239
5240
.top .workspace-switcher .workspace-item:dir(ltr),
5241
.bottom .workspace-switcher .workspace-item:dir(ltr), .top
5242
.workspace-switcher .workspace-add-button:dir(ltr),
5243
.bottom
5244
.workspace-switcher .workspace-add-button:dir(ltr) {
5245
border-right-width: 1px;
5246
}
5247
5248
.top .workspace-switcher .workspace-item:dir(rtl),
5249
.bottom .workspace-switcher .workspace-item:dir(rtl), .top
5250
.workspace-switcher .workspace-add-button:dir(rtl),
5251
.bottom
5252
.workspace-switcher .workspace-add-button:dir(rtl) {
5253
border-left-width: 1px;
5254
}
5255
5256
.left .workspace-switcher .workspace-item,
5257
.right .workspace-switcher .workspace-item, .left
5258
.workspace-switcher .workspace-add-button,
5259
.right
5260
.workspace-switcher .workspace-add-button {
5261
border-bottom-width: 1px;
5262
}
5263
5264
.workspace-switcher .workspace-item {
5265
transition: all 180ms cubic-bezier(0, 0, 0.2, 1);
5266
}
5267
5268
.workspace-switcher .workspace-item.current-workspace {
5269
background-color: rgba(255, 255, 255, 0.12);
5270
}
5271
5272
.workspace-switcher .workspace-add-button:hover {
5273
box-shadow: none;
5274
}
5275
5276
.workspace-switcher .workspace-add-button:active {
5277
background-image: none;
5278
}
5279
5280
.workspace-switcher .workspace-add-button:active image {
5281
margin: 1px 0 -1px;
5282
}
5283
5284
.budgie-panel .workspace-switcher .workspace-icon-button {
5285
min-height: 24px;
5286
min-width: 24px;
5287
padding: 0;
5288
border-radius: 2px;
5289
}
5290
5291
.budgie-menu.background {
5292
padding: 0;
5293
background-color: #FFFFFF;
5294
}
5295
5296
.budgie-menu scrollbar,
5297
.budgie-menu entry.search {
5298
background-color: transparent;
5299
}
5300
5301
.budgie-menu entry.search {
5302
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
5303
border-radius: 0;
5304
box-shadow: none;
5305
font-size: 120%;
5306
}
5307
5308
.budgie-menu .categories:dir(ltr) {
5309
border-bottom-left-radius: 2px;
5310
}
5311
5312
.budgie-menu .categories:dir(rtl) {
5313
border-bottom-right-radius: 2px;
5314
}
5315
5316
.budgie-menu button {
5317
min-height: 32px;
5318
padding: 0 8px;
5319
border-radius: 0;
5320
color: rgba(0, 0, 0, 0.87);
5321
font-weight: normal;
5322
}
5323
5324
.budgie-menu button:disabled {
5325
color: rgba(0, 0, 0, 0.38);
5326
}
5327
5328
.budgie-menu button:checked:disabled {
5329
background-color: #42A5F5;
5330
}
5331
5332
.budgie-menu row {
5333
padding: 0;
5334
}
5335
5336
.budgie-menu row:hover {
5337
box-shadow: none;
5338
}
5339
5340
popover.background.user-menu {
5341
padding: 8px;
5342
}
5343
5344
popover.background.user-menu .content-box {
5345
background-color: transparent;
5346
}
5347
5348
popover.background.user-menu separator {
5349
margin: 4px 0;
5350
}
5351
5352
popover.background.user-menu row {
5353
padding: 0;
5354
box-shadow: none;
5355
background-image: none;
5356
}
5357
5358
popover.background.places-menu {
5359
padding: 8px;
5360
}
5361
5362
popover.background.places-menu .name-button.text-button {
5363
padding-left: 8px;
5364
padding-right: 8px;
5365
}
5366
5367
popover.background.places-menu .name-button.text-button image:dir(ltr) {
5368
margin-right: 3px;
5369
}
5370
5371
popover.background.places-menu .name-button.text-button image:dir(rtl) {
5372
margin-left: 3px;
5373
}
5374
5375
popover.background.places-menu .places-section-header > image:dir(ltr) {
5376
margin: 0 -2px 0 5px;
5377
}
5378
5379
popover.background.places-menu .places-section-header > image:dir(rtl) {
5380
margin: 0 5px 0 -2px;
5381
}
5382
5383
popover.background.places-menu .places-list {
5384
margin-top: 4px;
5385
padding-top: 4px;
5386
border-top: 1px solid rgba(0, 0, 0, 0.12);
5387
background-color: transparent;
5388
}
5389
5390
popover.background.places-menu row {
5391
padding: 0;
5392
box-shadow: none;
5393
background-image: none;
5394
}
5395
5396
.budgie-panel {
5397
transition: background-color 270ms cubic-bezier(0, 0, 0.2, 1);
5398
background-color: #263238;
5399
color: rgba(255, 255, 255, 0.7);
5400
font-weight: 500;
5401
}
5402
5403
.budgie-panel.transparent {
5404
background-color: rgba(0, 0, 0, 0.6);
5405
}
5406
5407
.budgie-panel button {
5408
min-height: 16px;
5409
min-width: 16px;
5410
padding: 0;
5411
border-radius: 0;
5412
}
5413
5414
.budgie-panel button:checked {
5415
background-color: rgba(255, 255, 255, 0.12);
5416
}
5417
5418
.budgie-panel.horizontal button {
5419
padding: 0 4px;
5420
}
5421
5422
.budgie-panel.vertical button {
5423
padding: 4px 0;
5424
}
5425
5426
.budgie-panel separator {
5427
background-color: rgba(255, 255, 255, 0.3);
5428
}
5429
5430
.budgie-panel .alert {
5431
color: #FF5252;
5432
}
5433
5434
.budgie-panel #tasklist-button {
5435
padding: 0 4px;
5436
}
5437
5438
.budgie-panel.vertical #tasklist-button {
5439
min-height: 32px;
5440
}
5441
5442
.budgie-panel button.flat.launcher {
5443
padding: 0;
5444
}
5445
5446
.budgie-panel button.flat.launcher:not(:checked) {
5447
color: rgba(255, 255, 255, 0.5);
5448
}
5449
5450
.budgie-panel button.flat.launcher:not(:checked):hover, .budgie-panel button.flat.launcher:not(:checked):active {
5451
color: rgba(255, 255, 255, 0.7);
5452
}
5453
5454
.budgie-panel button.flat.launcher:not(:checked):disabled {
5455
color: rgba(255, 255, 255, 0.3);
5456
}
5457
5458
.top .budgie-panel #tasklist-button, .budgie-panel .top #tasklist-button, .top .budgie-panel button.flat.launcher, .budgie-panel .top button.flat.launcher {
5459
border-image: radial-gradient(circle closest-corner at center calc(1px), currentColor 0%, transparent 0%) 0 0 0 0/0 0 0 0;
5460
}
5461
5462
.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
5463
.budgie-panel .pinned button.flat.launcher.running,
5464
.budgie-panel .pinned .top button.flat.launcher.running {
5465
border-image: radial-gradient(circle closest-corner at center calc(1px), currentColor 100%, transparent 0%) 2 0 0 0/2px 0 0 0;
5466
}
5467
5468
.bottom .budgie-panel #tasklist-button, .budgie-panel .bottom #tasklist-button, .bottom .budgie-panel button.flat.launcher, .budgie-panel .bottom button.flat.launcher {
5469
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0 0/0 0 0 0;
5470
}
5471
5472
.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
5473
.budgie-panel .pinned button.flat.launcher.running,
5474
.budgie-panel .pinned .bottom button.flat.launcher.running {
5475
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2 0/0 0 2px 0;
5476
}
5477
5478
.left .budgie-panel #tasklist-button, .budgie-panel .left #tasklist-button, .left .budgie-panel button.flat.launcher, .budgie-panel .left button.flat.launcher {
5479
border-image: radial-gradient(circle closest-corner at calc(1px) center, currentColor 0%, transparent 0%) 0 0 0 0/0 0 0 0;
5480
}
5481
5482
.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
5483
.budgie-panel .pinned button.flat.launcher.running,
5484
.budgie-panel .pinned .left button.flat.launcher.running {
5485
border-image: radial-gradient(circle closest-corner at calc(1px) center, currentColor 100%, transparent 0%) 0 0 0 2/0 0 0 2px;
5486
}
5487
5488
.right .budgie-panel #tasklist-button, .budgie-panel .right #tasklist-button, .right .budgie-panel button.flat.launcher, .budgie-panel .right button.flat.launcher {
5489
border-image: radial-gradient(circle closest-corner at calc(100% - 1px) center, currentColor 0%, transparent 0%) 0 0 0 0/0 0 0 0;
5490
}
5491
5492
.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
5493
.budgie-panel .pinned button.flat.launcher.running,
5494
.budgie-panel .pinned .right button.flat.launcher.running {
5495
border-image: radial-gradient(circle closest-corner at calc(100% - 1px) center, currentColor 100%, transparent 0%) 0 2 0 0/0 2px 0 0;
5496
}
5497
5498
frame.raven-frame > border {
5499
border-style: none;
5500
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22);
5501
}
5502
5503
.top frame.raven-frame > border {
5504
margin-bottom: 32px;
5505
}
5506
5507
.bottom frame.raven-frame > border {
5508
margin-top: 32px;
5509
}
5510
5511
.left frame.raven-frame > border {
5512
margin-right: 32px;
5513
}
5514
5515
.right frame.raven-frame > border {
5516
margin-left: 32px;
5517
}
5518
5519
.raven {
5520
background-color: #FAFAFA;
5521
}
5522
5523
.raven > box {
5524
margin-bottom: -10px;
5525
}
5526
5527
.raven > stack {
5528
margin-bottom: -10px;
5529
}
5530
5531
.raven stackswitcher.linked > button {
5532
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FFA726 0%, transparent 0%) 0 0 0/0 0 0px;
5533
border-radius: 0;
5534
}
5535
5536
.raven stackswitcher.linked > button:checked {
5537
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FFA726 100%, transparent 0%) 0 0 2/0 0 2px;
5538
background-color: transparent;
5539
}
5540
5541
.raven .raven-header {
5542
min-height: 32px;
5543
padding: 3px;
5544
}
5545
5546
.raven .raven-header:not(.top) {
5547
margin-top: -6px;
5548
}
5549
5550
.raven .raven-header.top {
5551
padding: 2px 0;
5552
background-color: #42A5F5;
5553
color: #FFFFFF;
5554
}
5555
5556
.raven .raven-header.top stackswitcher button {
5557
margin: -6px 0;
5558
min-height: 32px;
5559
}
5560
5561
.raven .raven-header.top button.image-button:dir(ltr) {
5562
margin-right: 2px;
5563
}
5564
5565
.raven .raven-header.top button.image-button:dir(rtl) {
5566
margin-left: 2px;
5567
}
5568
5569
.raven .raven-header.top > image {
5570
margin: 0 8px;
5571
}
5572
5573
.raven .raven-header.top > label {
5574
margin: 0 -8px;
5575
font-weight: bold;
5576
}
5577
5578
.raven .raven-header.bottom {
5579
border-top: 1px solid rgba(0, 0, 0, 0.12);
5580
}
5581
5582
.raven viewport.frame .raven-header {
5583
margin-top: -8px;
5584
}
5585
5586
.raven .raven-background {
5587
border-style: solid none;
5588
border-width: 1px;
5589
border-color: rgba(0, 0, 0, 0.12);
5590
background-color: #FFFFFF;
5591
}
5592
5593
.raven .raven-background.frame {
5594
border-style: solid none;
5595
}
5596
5597
.raven .raven-background > overlay > widget > image {
5598
color: rgba(0, 0, 0, 0.12);
5599
}
5600
5601
.raven .raven-background grid > label:first-child {
5602
min-height: 32px;
5603
}
5604
5605
.raven scrolledwindow.raven-background {
5606
border-bottom-style: none;
5607
}
5608
5609
.raven .raven-header.top + .raven-background {
5610
border-style: none;
5611
background-color: #42A5F5;
5612
color: #FFFFFF;
5613
}
5614
5615
.raven .raven-header.top + .raven-background stackswitcher button {
5616
margin: -4px 0;
5617
}
5618
5619
.raven .powerstrip button {
5620
margin: 2px 0 1px;
5621
padding: 10px;
5622
}
5623
5624
.raven .option-subtitle {
5625
font-size: smaller;
5626
}
5627
5628
calendar.raven-calendar {
5629
border-style: none;
5630
background-color: transparent;
5631
}
5632
5633
calendar.raven-calendar:selected {
5634
border-radius: 2px;
5635
background-color: #42A5F5;
5636
}
5637
5638
.raven-mpris {
5639
background-color: rgba(0, 0, 0, 0.6);
5640
color: #FFFFFF;
5641
}
5642
5643
.raven-mpris label {
5644
min-height: 24px;
5645
}
5646
5647
.raven-mpris button.image-button {
5648
padding: 10px;
5649
}
5650
5651
.budgie-notification-window, .budgie-osd-window, .budgie-switcher-window {
5652
background-color: transparent;
5653
}
5654
5655
.budgie-notification .notification-title, .budgie-switcher .notification-title {
5656
font-size: 120%;
5657
}
5658
5659
.budgie-osd .budgie-osd-text {
5660
font-size: 120%;
5661
}
5662
5663
.drop-shadow {
5664
margin: 5px 9px;
5665
padding: 3px;
5666
border-radius: 2px;
5667
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);
5668
background-color: #FAFAFA;
5669
}
5670
5671
.drop-shadow .linked > button {
5672
border-radius: 2px;
5673
}
5674
5675
.budgie-session-dialog, .budgie-polkit-dialog, .budgie-run-dialog {
5676
border-radius: 2px;
5677
background-color: #FAFAFA;
5678
}
5679
5680
.budgie-session-dialog decoration, .budgie-polkit-dialog decoration, .budgie-run-dialog decoration {
5681
border-radius: 2px;
5682
}
5683
5684
.budgie-session-dialog label:not(:last-child),
5685
.budgie-session-dialog .dialog-title {
5686
font-size: 120%;
5687
}
5688
5689
.budgie-session-dialog .linked.horizontal > button {
5690
padding: 8px 16px;
5691
border-top: 1px solid rgba(0, 0, 0, 0.12);
5692
border-radius: 0;
5693
}
5694
5695
.budgie-session-dialog .linked.horizontal > button:first-child {
5696
border-bottom-left-radius: 2px;
5697
}
5698
5699
.budgie-session-dialog .linked.horizontal > button:last-child {
5700
border-bottom-right-radius: 2px;
5701
}
5702
5703
.budgie-polkit-dialog .message {
5704
color: rgba(0, 0, 0, 0.38);
5705
}
5706
5707
.budgie-polkit-dialog .failure {
5708
color: #FF5252;
5709
}
5710
5711
.budgie-run-dialog {
5712
background-color: #FFFFFF;
5713
}
5714
5715
.budgie-run-dialog entry.search {
5716
font-size: 120%;
5717
padding: 6px 14px;
5718
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
5719
background-color: transparent;
5720
}
5721
5722
.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
5723
headerbar .subtitle,
5724
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 {
5725
opacity: 1;
5726
}
5727
5728
.budgie-run-dialog scrolledwindow {
5729
border-top: 1px solid rgba(0, 0, 0, 0.12);
5730
}
5731
5732
/************************
5733
* LightDM GTK+ Greeter *
5734
************************/
5735
#panel_window {
5736
background-color: rgba(0, 0, 0, 0.3);
5737
color: #FFFFFF;
5738
}
5739
5740
#panel_window menubar,
5741
#panel_window separator {
5742
background-color: transparent;
5743
}
5744
5745
#panel_window separator {
5746
padding: 0 4px;
5747
}
5748
5749
#panel_window separator:first-child {
5750
padding: 0 8px;
5751
}
5752
5753
#panel_window menubar > menuitem {
5754
color: rgba(255, 255, 255, 0.7);
5755
}
5756
5757
#panel_window menubar > menuitem:hover {
5758
color: #FFFFFF;
5759
}
5760
5761
#panel_window menubar > menuitem:disabled label {
5762
color: rgba(255, 255, 255, 0.3);
5763
}
5764
5765
#login_window,
5766
#shutdown_dialog,
5767
#restart_dialog {
5768
margin: 8px;
5769
border-radius: 2px;
5770
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);
5771
background-color: #FAFAFA;
5772
}
5773
5774
#content_frame {
5775
padding-bottom: 20px;
5776
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
5777
}
5778
5779
#buttonbox_frame {
5780
padding-top: 24px;
5781
}
5782
5783
#buttonbox_frame button {
5784
margin: -16px;
5785
}
5786
5787
#greeter_infobar {
5788
margin-top: -1px;
5789
}
5790
5791
/* GTK NAMED COLORS
5792
----------------
5793
use responsibly! */
5794
/*
5795
widget text/foreground color */
5796
@define-color theme_fg_color rgba(0, 0, 0, 0.87);
5797
/*
5798
text color for entries, views and content in general */
5799
@define-color theme_text_color rgba(0, 0, 0, 0.87);
5800
/*
5801
widget base background color */
5802
@define-color theme_bg_color #F5F5F5;
5803
/*
5804
text widgets and the like base background color */
5805
@define-color theme_base_color #FFFFFF;
5806
/*
5807
base background color of selections */
5808
@define-color theme_selected_bg_color #42A5F5;
5809
/*
5810
text/foreground color of selections */
5811
@define-color theme_selected_fg_color #FFFFFF;
5812
/*
5813
base background color of insensitive widgets */
5814
@define-color insensitive_bg_color #F5F5F5;
5815
/*
5816
text foreground color of insensitive widgets */
5817
@define-color insensitive_fg_color rgba(0, 0, 0, 0.38);
5818
/*
5819
insensitive text widgets and the like base background color */
5820
@define-color insensitive_base_color #FAFAFA;
5821
/*
5822
widget text/foreground color on backdrop windows */
5823
@define-color theme_unfocused_fg_color rgba(0, 0, 0, 0.87);
5824
/*
5825
text color for entries, views and content in general on backdrop windows */
5826
@define-color theme_unfocused_text_color rgba(0, 0, 0, 0.87);
5827
/*
5828
widget base background color on backdrop windows */
5829
@define-color theme_unfocused_bg_color #F5F5F5;
5830
/*
5831
text widgets and the like base background color on backdrop windows */
5832
@define-color theme_unfocused_base_color #FFFFFF;
5833
/*
5834
base background color of selections on backdrop windows */
5835
@define-color theme_unfocused_selected_bg_color #42A5F5;
5836
/*
5837
text/foreground color of selections on backdrop windows */
5838
@define-color theme_unfocused_selected_fg_color #FFFFFF;
5839
/*
5840
insensitive color on backdrop windows */
5841
@define-color unfocused_insensitive_color rgba(0, 0, 0, 0.38);
5842
/*
5843
widgets main borders color */
5844
@define-color borders rgba(0, 0, 0, 0.12);
5845
/*
5846
widgets main borders color on backdrop windows */
5847
@define-color unfocused_borders rgba(0, 0, 0, 0.12);
5848
/*
5849
these are pretty self explicative */
5850
@define-color warning_color #FF6D00;
5851
@define-color error_color #DD2C00;
5852
@define-color success_color #00C853;
5853
/*
5854
FIXME this is really an API */
5855
@define-color content_view_bg #FFFFFF;
5856
@define-color placeholder_text_color #757575;
5857