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-dark-compact.css

View raw Download
text/plain • 155.79 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, #338DD6 0%, transparent 0%);
10
}
11
to {
12
background-image: radial-gradient(circle farthest-corner at center, #338DD6 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: #338DD6;
32
}
33
34
notebook:focus tab,
35
*:focus {
36
outline-color: alpha(currentColor, 0.3);
37
}
38
39
/***************
40
* Base States *
41
***************/
42
.background {
43
background-color: #212121;
44
color: #FFFFFF;
45
}
46
47
/*
48
These wildcard seems unavoidable, need to investigate.
49
Wildcards are bad and troublesome, use them with care,
50
or better, just don't.
51
Everytime a wildcard is used a kitten dies, painfully.
52
*/
53
*:disabled {
54
-gtk-icon-effect: dim;
55
}
56
57
.gtkstyle-fallback {
58
background-color: #212121;
59
color: #FFFFFF;
60
}
61
62
.gtkstyle-fallback:hover {
63
background-color: #141414;
64
color: #FFFFFF;
65
}
66
67
.gtkstyle-fallback:active {
68
background-color: #080808;
69
color: #FFFFFF;
70
}
71
72
.gtkstyle-fallback:disabled {
73
background-color: #212121;
74
color: rgba(255, 255, 255, 0.5);
75
}
76
77
.gtkstyle-fallback:selected {
78
background-color: #338DD6;
79
color: #FFFFFF;
80
}
81
82
.view {
83
background-color: #303030;
84
color: #FFFFFF;
85
}
86
87
.view:disabled {
88
color: rgba(255, 255, 255, 0.5);
89
}
90
91
.view:hover, .view:active, .view:selected {
92
border-radius: 2px;
93
}
94
95
textview text {
96
background-color: #303030;
97
}
98
99
textview border {
100
background-color: #292929;
101
color: rgba(255, 255, 255, 0.5);
102
}
103
104
.rubberband,
105
rubberband,
106
flowbox rubberband,
107
treeview.view rubberband,
108
.content-view rubberband,
109
.content-view .rubberband {
110
border: 1px solid #40C4FF;
111
background-color: rgba(64, 196, 255, 0.3);
112
}
113
114
flowbox flowboxchild {
115
padding: 4px;
116
border-radius: 2px;
117
}
118
119
.content-view .tile:selected {
120
background-color: transparent;
121
color: inherit;
122
}
123
124
label {
125
caret-color: currentColor;
126
}
127
128
label.separator {
129
color: #FFFFFF;
130
}
131
132
label selection {
133
background-color: #338DD6;
134
color: #FFFFFF;
135
}
136
137
label:disabled {
138
color: rgba(255, 255, 255, 0.5);
139
}
140
141
tab label:disabled,
142
button label:disabled {
143
color: inherit;
144
}
145
146
.dim-label, label.separator, .titlebar:not(headerbar) .subtitle,
147
headerbar .subtitle, .budgie-notification .notification-body, .budgie-switcher .notification-body {
148
opacity: 0.6;
149
}
150
151
assistant .sidebar {
152
padding: 4px 0;
153
}
154
155
assistant .sidebar label {
156
min-height: 32px;
157
padding: 0 12px;
158
color: rgba(255, 255, 255, 0.5);
159
font-weight: 500;
160
}
161
162
assistant .sidebar label.highlight {
163
color: #FFFFFF;
164
}
165
166
popover.background.touch-selection, popover.background.magnifier, popover.background.osd, .app-notification, .osd .scale-popup, .nautilus-window .floating-bar, .osd {
167
opacity: 0.9;
168
}
169
170
/*********************
171
* Spinner Animation *
172
*********************/
173
@keyframes spin {
174
to {
175
-gtk-icon-transform: rotate(1turn);
176
}
177
}
178
179
spinner {
180
background: none;
181
opacity: 0;
182
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
183
}
184
185
spinner:checked {
186
opacity: 1;
187
animation: spin 1s linear infinite;
188
}
189
190
spinner:checked:disabled {
191
opacity: 0.5;
192
}
193
194
/****************
195
* Text Entries *
196
****************/
197
spinbutton:not(.vertical),
198
entry {
199
min-height: 32px;
200
padding: 0 8px;
201
border-radius: 2px;
202
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), box-shadow 180ms cubic-bezier(0, 0, 0.2, 1);
203
border-image: none;
204
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
205
background-color: #303030;
206
color: #FFFFFF;
207
}
208
209
spinbutton:focus:not(.vertical),
210
entry:focus {
211
border-image: none;
212
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
213
}
214
215
spinbutton:disabled:not(.vertical),
216
entry:disabled {
217
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
218
background-color: #292929;
219
color: rgba(255, 255, 255, 0.5);
220
}
221
222
spinbutton.flat:not(.vertical), notebook > stack:not(:only-child) entry:not(.search),
223
notebook > stack:not(:only-child) spinbutton:not(.vertical), messagedialog entry, colorchooser .popover.osd spinbutton:not(.vertical), entry.preferences-search, layoutpane entry.search, editortweak entry.search, .raven .raven-background spinbutton:not(.vertical), #login_window entry,
224
entry.flat {
225
border-radius: 0;
226
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
227
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #338DD6 0%, transparent 0%) 0 0 0/0 0 0px;
228
box-shadow: inset 0 -1px rgba(255, 255, 255, 0.3);
229
background-color: transparent;
230
color: #FFFFFF;
231
}
232
233
spinbutton.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry:focus:not(.search),
234
notebook > stack:not(:only-child) spinbutton:focus:not(.vertical), messagedialog entry:focus, colorchooser .popover.osd spinbutton:focus:not(.vertical), entry.preferences-search:focus, layoutpane entry.search:focus, editortweak entry.search:focus, .raven .raven-background spinbutton:focus:not(.vertical), #login_window entry:focus,
235
entry.flat:focus {
236
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #338DD6 100%, transparent 0%) 0 0 2/0 0 2px;
237
box-shadow: inset 0 -1px rgba(255, 255, 255, 0.3);
238
}
239
240
spinbutton.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry:disabled:not(.search),
241
notebook > stack:not(:only-child) spinbutton:disabled:not(.vertical), messagedialog entry:disabled, colorchooser .popover.osd spinbutton:disabled:not(.vertical), entry.preferences-search:disabled, layoutpane entry.search:disabled, editortweak entry.search:disabled, .raven .raven-background spinbutton:disabled:not(.vertical), #login_window entry:disabled,
242
entry.flat:disabled {
243
box-shadow: inset 0 -1px rgba(255, 255, 255, 0.12);
244
background-color: transparent;
245
color: rgba(255, 255, 255, 0.5);
246
}
247
248
spinbutton:not(.vertical) image,
249
entry image {
250
color: rgba(255, 255, 255, 0.7);
251
}
252
253
spinbutton:not(.vertical) image:hover, spinbutton:not(.vertical) image:active,
254
entry image:hover,
255
entry image:active {
256
color: #FFFFFF;
257
}
258
259
spinbutton:not(.vertical) image:disabled,
260
entry image:disabled {
261
color: rgba(255, 255, 255, 0.5);
262
}
263
264
spinbutton:not(.vertical) image.left,
265
entry image.left {
266
margin-left: 0px;
267
margin-right: 6px;
268
}
269
270
spinbutton:not(.vertical) image.right,
271
entry image.right {
272
margin-left: 6px;
273
margin-right: 0px;
274
}
275
276
spinbutton:not(.vertical) undershoot.left,
277
entry undershoot.left {
278
background-color: transparent;
279
background-image: linear-gradient(to top, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
280
padding-left: 1px;
281
background-size: 1px 12px;
282
background-repeat: repeat-y;
283
background-origin: content-box;
284
background-position: left top;
285
}
286
287
spinbutton:not(.vertical) undershoot.right,
288
entry undershoot.right {
289
background-color: transparent;
290
background-image: linear-gradient(to top, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
291
padding-right: 1px;
292
background-size: 1px 12px;
293
background-repeat: repeat-y;
294
background-origin: content-box;
295
background-position: right top;
296
}
297
298
spinbutton.error:not(.vertical),
299
entry.error {
300
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), box-shadow 180ms cubic-bezier(0, 0, 0.2, 1);
301
border-image: none;
302
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
303
background-color: #DD2C00;
304
color: #FFFFFF;
305
}
306
307
spinbutton.error:focus:not(.vertical),
308
entry.error:focus {
309
border-image: none;
310
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
311
}
312
313
spinbutton.error:disabled:not(.vertical),
314
entry.error:disabled {
315
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
316
background-color: #292929;
317
color: rgba(255, 255, 255, 0.5);
318
}
319
320
spinbutton.error.flat:not(.vertical), notebook > stack:not(:only-child) entry.error:not(.search),
321
notebook > stack:not(:only-child) spinbutton.error:not(.vertical), messagedialog entry.error, colorchooser .popover.osd spinbutton.error:not(.vertical), entry.error.preferences-search, layoutpane entry.error.search, editortweak entry.error.search, .raven .raven-background spinbutton.error:not(.vertical), #login_window entry.error,
322
entry.error.flat {
323
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
324
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #DD2C00 0%, transparent 0%) 0 0 0/0 0 0px;
325
box-shadow: inset 0 -1px #DD2C00;
326
background-color: transparent;
327
color: #FFFFFF;
328
}
329
330
spinbutton.error.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry.error:focus:not(.search),
331
notebook > stack:not(:only-child) spinbutton.error:focus:not(.vertical), messagedialog entry.error:focus, colorchooser .popover.osd spinbutton.error:focus:not(.vertical), entry.error.preferences-search:focus, layoutpane entry.error.search:focus, editortweak entry.error.search:focus, .raven .raven-background spinbutton.error:focus:not(.vertical), #login_window entry.error:focus,
332
entry.error.flat:focus {
333
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #DD2C00 100%, transparent 0%) 0 0 2/0 0 2px;
334
box-shadow: inset 0 -1px #DD2C00;
335
}
336
337
spinbutton.error.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry.error:disabled:not(.search),
338
notebook > stack:not(:only-child) spinbutton.error:disabled:not(.vertical), messagedialog entry.error:disabled, colorchooser .popover.osd spinbutton.error:disabled:not(.vertical), entry.error.preferences-search:disabled, layoutpane entry.error.search:disabled, editortweak entry.error.search:disabled, .raven .raven-background spinbutton.error:disabled:not(.vertical), #login_window entry.error:disabled,
339
entry.error.flat:disabled {
340
box-shadow: inset 0 -1px rgba(255, 255, 255, 0.12);
341
background-color: transparent;
342
color: rgba(255, 255, 255, 0.5);
343
}
344
345
spinbutton.error:not(.vertical) image,
346
entry.error image {
347
color: rgba(255, 255, 255, 0.7);
348
}
349
350
spinbutton.error:not(.vertical) image:hover, spinbutton.error:not(.vertical) image:active,
351
entry.error image:hover,
352
entry.error image:active {
353
color: #FFFFFF;
354
}
355
356
spinbutton.error:not(.vertical) image:disabled,
357
entry.error image:disabled {
358
color: rgba(255, 255, 255, 0.5);
359
}
360
361
spinbutton.warning:not(.vertical),
362
entry.warning {
363
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), box-shadow 180ms cubic-bezier(0, 0, 0.2, 1);
364
border-image: none;
365
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
366
background-color: #FF6D00;
367
color: #FFFFFF;
368
}
369
370
spinbutton.warning:focus:not(.vertical),
371
entry.warning:focus {
372
border-image: none;
373
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
374
}
375
376
spinbutton.warning:disabled:not(.vertical),
377
entry.warning:disabled {
378
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
379
background-color: #292929;
380
color: rgba(255, 255, 255, 0.5);
381
}
382
383
spinbutton.warning.flat:not(.vertical), notebook > stack:not(:only-child) entry.warning:not(.search),
384
notebook > stack:not(:only-child) spinbutton.warning:not(.vertical), messagedialog entry.warning, colorchooser .popover.osd spinbutton.warning:not(.vertical), entry.warning.preferences-search, layoutpane entry.warning.search, editortweak entry.warning.search, .raven .raven-background spinbutton.warning:not(.vertical), #login_window entry.warning,
385
entry.warning.flat {
386
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
387
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FF6D00 0%, transparent 0%) 0 0 0/0 0 0px;
388
box-shadow: inset 0 -1px #FF6D00;
389
background-color: transparent;
390
color: #FFFFFF;
391
}
392
393
spinbutton.warning.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry.warning:focus:not(.search),
394
notebook > stack:not(:only-child) spinbutton.warning:focus:not(.vertical), messagedialog entry.warning:focus, colorchooser .popover.osd spinbutton.warning:focus:not(.vertical), entry.warning.preferences-search:focus, layoutpane entry.warning.search:focus, editortweak entry.warning.search:focus, .raven .raven-background spinbutton.warning:focus:not(.vertical), #login_window entry.warning:focus,
395
entry.warning.flat:focus {
396
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FF6D00 100%, transparent 0%) 0 0 2/0 0 2px;
397
box-shadow: inset 0 -1px #FF6D00;
398
}
399
400
spinbutton.warning.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry.warning:disabled:not(.search),
401
notebook > stack:not(:only-child) spinbutton.warning:disabled:not(.vertical), messagedialog entry.warning:disabled, colorchooser .popover.osd spinbutton.warning:disabled:not(.vertical), entry.warning.preferences-search:disabled, layoutpane entry.warning.search:disabled, editortweak entry.warning.search:disabled, .raven .raven-background spinbutton.warning:disabled:not(.vertical), #login_window entry.warning:disabled,
402
entry.warning.flat:disabled {
403
box-shadow: inset 0 -1px rgba(255, 255, 255, 0.12);
404
background-color: transparent;
405
color: rgba(255, 255, 255, 0.5);
406
}
407
408
spinbutton.warning:not(.vertical) image,
409
entry.warning image {
410
color: rgba(255, 255, 255, 0.7);
411
}
412
413
spinbutton.warning:not(.vertical) image:hover, spinbutton.warning:not(.vertical) image:active,
414
entry.warning image:hover,
415
entry.warning image:active {
416
color: #FFFFFF;
417
}
418
419
spinbutton.warning:not(.vertical) image:disabled,
420
entry.warning image:disabled {
421
color: rgba(255, 255, 255, 0.5);
422
}
423
424
spinbutton:not(.vertical) progress,
425
entry progress {
426
margin: 2px -6px;
427
border-bottom: 2px solid #338DD6;
428
background-color: transparent;
429
}
430
431
.linked:not(.vertical) > spinbutton.flat:not(.vertical), notebook > stack:not(:only-child) .linked:not(.vertical) > entry:not(.search),
432
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), .linked:not(.vertical) > entry.preferences-search, 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,
433
.linked.vertical > spinbutton.flat:not(.vertical), notebook > stack:not(:only-child)
434
.linked.vertical > entry:not(.search),
435
notebook > stack:not(:only-child)
436
.linked.vertical > spinbutton:not(.vertical), messagedialog
437
.linked.vertical > entry, colorchooser .popover.osd
438
.linked.vertical > spinbutton:not(.vertical),
439
.linked.vertical > entry.preferences-search, 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: #303030;
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: #338DD6;
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(#009688), to(transparent));
503
}
504
to {
505
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#009688), 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: #424242;
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(255, 255, 255, 0.8);
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: #FFFFFF;
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: #FFFFFF;
540
}
541
542
543
button:disabled {
544
box-shadow: none;
545
background-color: rgba(255, 255, 255, 0.12);
546
color: rgba(255, 255, 255, 0.3);
547
}
548
549
550
button:checked {
551
background-color: #338DD6;
552
color: #FFFFFF;
553
}
554
555
556
button:checked:disabled {
557
background-color: rgba(51, 141, 214, 0.3);
558
color: rgba(51, 141, 214, 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, popover.messagepopover .popover-action-area 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(255, 255, 255, 0.7);
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, popover.messagepopover .popover-action-area 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: #FFFFFF;
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, popover.messagepopover .popover-action-area 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: #FFFFFF;
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, popover.messagepopover .popover-action-area 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(255, 255, 255, 0.3);
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(255, 255, 255, 0.3);
621
color: #FFFFFF;
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(255, 255, 255, 0.12);
629
color: rgba(255, 255, 255, 0.5);
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: #009688;
746
color: #FFFFFF;
747
}
748
749
750
button.suggested-action:disabled {
751
box-shadow: none;
752
background-color: rgba(255, 255, 255, 0.12);
753
color: rgba(255, 255, 255, 0.5);
754
}
755
756
757
button.suggested-action:checked {
758
background-color: #4db6ac;
759
}
760
761
762
button.suggested-action.flat {
763
background-color: transparent;
764
color: #009688;
765
}
766
767
768
button.suggested-action.flat:disabled {
769
box-shadow: none;
770
background-color: transparent;
771
color: rgba(255, 255, 255, 0.5);
772
}
773
774
775
button.suggested-action.flat:checked {
776
background-color: rgba(0, 150, 136, 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(255, 255, 255, 0.12);
789
color: rgba(255, 255, 255, 0.5);
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(255, 255, 255, 0.5);
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: #338DD6;
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(255, 255, 255, 0.5);
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), #338DD6 0%, transparent 0%) 0 0 0/0 0 0px;
1121
box-shadow: inset 0 -1px rgba(255, 255, 255, 0.3);
1122
background-color: transparent;
1123
color: #FFFFFF;
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(255, 255, 255, 0.5);
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), #338DD6 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(255, 255, 255, 0.12);
1136
color: rgba(255, 255, 255, 0.5);
1137
}
1138
1139
/************
1140
* Toolbars *
1141
************/
1142
toolbar {
1143
-GtkWidget-window-dragging: true;
1144
padding: 2px;
1145
background-color: #212121;
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.1);
1157
background-color: #303030;
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.1);
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.26);
1209
background-color: #292929;
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.26);
1218
background-color: #212121;
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: #303030;
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: #338DD6;
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: 10px;
1470
margin-bottom: 10px;
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: #303030;
1551
background-image: image(rgba(0, 0, 0, 0.26));
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), #338DD6 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), #338DD6 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(255, 255, 255, 0.3);
1601
border-top-color: rgba(0, 0, 0, 0.26);
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.26);
1624
}
1625
1626
treeview.view:drop(active) {
1627
border-style: solid none;
1628
border-width: 1px;
1629
border-color: #009688;
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(255, 255, 255, 0.7);
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: #FFFFFF;
1656
}
1657
1658
treeview.view.expander:disabled {
1659
color: rgba(255, 255, 255, 0.3);
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 #338DD6;
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(51, 141, 214, 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.26);
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: #303030;
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.26);
1721
border-radius: 0;
1722
box-shadow: none;
1723
background-color: #303030;
1724
background-clip: border-box;
1725
color: #338DD6;
1726
}
1727
1728
treeview.view acceleditor > label {
1729
background-color: #338DD6;
1730
}
1731
1732
/*********
1733
* Menus *
1734
*********/
1735
menubar,
1736
.menubar {
1737
-GtkWidget-window-dragging: true;
1738
padding: 0;
1739
background-color: #303030;
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.1);
1777
background-color: #303030;
1778
border: 1px solid rgba(0, 0, 0, 0.26);
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(255, 255, 255, 0.12);
1804
}
1805
1806
menu menuitem:disabled,
1807
.menu menuitem:disabled,
1808
.context-menu menuitem:disabled {
1809
color: rgba(255, 255, 255, 0.5);
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: #303030;
1848
color: rgba(255, 255, 255, 0.7);
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.26);
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.26);
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(255, 255, 255, 0.12));
1873
color: #FFFFFF;
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(255, 255, 255, 0.7);
1892
}
1893
1894
.popup:not(.csd) menu menuitem {
1895
color: #FFFFFF;
1896
}
1897
1898
.popup:not(.csd) menu menuitem:hover {
1899
background-color: #494949;
1900
}
1901
1902
.popup:not(.csd) menu menuitem:disabled {
1903
color: #989898;
1904
}
1905
1906
.popup:not(.csd) menu accelerator {
1907
color: #c1c1c1;
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: #424242;
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.26);
1968
background-color: #212121;
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(255, 255, 255, 0.3);
1982
}
1983
1984
notebook > header.top > tabs > tab:checked {
1985
box-shadow: inset 0 -2px #338DD6;
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(255, 255, 255, 0.3);
1998
}
1999
2000
notebook > header.bottom > tabs > tab:checked {
2001
box-shadow: inset 0 2px #338DD6;
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(255, 255, 255, 0.3);
2014
}
2015
2016
notebook > header.left > tabs > tab:checked {
2017
box-shadow: inset -2px 0 #338DD6;
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(255, 255, 255, 0.3);
2030
}
2031
2032
notebook > header.right > tabs > tab:checked {
2033
box-shadow: inset 2px 0 #338DD6;
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, #338DD6 10%, transparent 0%);
2097
background-repeat: no-repeat;
2098
background-position: center;
2099
background-size: 0% 0%;
2100
color: rgba(255, 255, 255, 0.7);
2101
font-weight: 500;
2102
}
2103
2104
notebook > header tab:hover {
2105
color: #FFFFFF;
2106
}
2107
2108
notebook > header tab:hover.reorderable-page {
2109
border-color: rgba(0, 0, 0, 0.26);
2110
background-color: #292929;
2111
}
2112
2113
notebook > header tab:disabled {
2114
color: rgba(255, 255, 255, 0.3);
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: #FFFFFF;
2122
}
2123
2124
notebook > header tab:checked:disabled {
2125
color: rgba(255, 255, 255, 0.5);
2126
}
2127
2128
notebook > header tab:checked.reorderable-page {
2129
border-color: rgba(0, 0, 0, 0.26);
2130
background-color: #303030;
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: #303030;
2181
}
2182
2183
/**************
2184
* Scrollbars *
2185
**************/
2186
scrollbar {
2187
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
2188
background-color: #303030;
2189
background-clip: border-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.26);
2199
}
2200
2201
scrollbar.bottom {
2202
border-top: 1px solid rgba(0, 0, 0, 0.26);
2203
}
2204
2205
scrollbar.left {
2206
border-right: 1px solid rgba(0, 0, 0, 0.26);
2207
}
2208
2209
scrollbar.right {
2210
border-left: 1px solid rgba(0, 0, 0, 0.26);
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(255, 255, 255, 0.5);
2221
}
2222
2223
scrollbar slider:hover {
2224
background-color: rgba(255, 255, 255, 0.7);
2225
}
2226
2227
scrollbar slider:active {
2228
background-color: #FFFFFF;
2229
}
2230
2231
scrollbar slider:disabled {
2232
background-color: rgba(255, 255, 255, 0.3);
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(48, 48, 48, 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(48, 48, 48, 0.3);
2266
border-radius: 9999px;
2267
background-color: rgba(255, 255, 255, 0.5);
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(255, 255, 255, 0.3);
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(48, 48, 48, 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(255, 255, 255, 0.3);
2337
background-clip: padding-box;
2338
font-size: 0;
2339
}
2340
2341
switch:disabled {
2342
background-color: rgba(255, 255, 255, 0.12);
2343
}
2344
2345
switch:checked {
2346
background-color: rgba(0, 150, 136, 0.5);
2347
}
2348
2349
switch:checked:disabled {
2350
background-color: rgba(0, 150, 136, 0.3);
2351
}
2352
2353
switch slider {
2354
transition: all 180ms 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
outline-width: 0;
2360
outline-color: rgba(255, 255, 255, 0.12);
2361
outline-offset: 0;
2362
-gtk-outline-radius: 9999px;
2363
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2364
background-color: #424242;
2365
}
2366
2367
switch:focus slider {
2368
outline-width: 14px;
2369
}
2370
2371
switch:hover slider {
2372
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2373
}
2374
2375
switch:checked slider {
2376
background-color: #009688;
2377
outline-color: rgba(0, 150, 136, 0.2);
2378
}
2379
2380
switch:disabled slider {
2381
background-color: #212121;
2382
}
2383
2384
/*************************
2385
* Check and Radio items *
2386
*************************/
2387
.view.content-view.check:not(list),
2388
.content-view .tile check:not(list) {
2389
min-height: 40px;
2390
min-width: 40px;
2391
margin: 0;
2392
padding: 0;
2393
box-shadow: none;
2394
background-color: transparent;
2395
background-image: none;
2396
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2397
}
2398
2399
.view.content-view.check:not(list):hover, .view.content-view.check:not(list):active,
2400
.content-view .tile check:not(list):hover,
2401
.content-view .tile check:not(list):active {
2402
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2403
}
2404
2405
.view.content-view.check:not(list),
2406
.content-view .tile check:not(list) {
2407
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-unchecked-dark.png"), url("assets/selectionmode-checkbox-unchecked-dark@2.png"));
2408
}
2409
2410
.view.content-view.check:not(list):checked,
2411
.content-view .tile check:not(list):checked {
2412
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-checked-dark.png"), url("assets/selectionmode-checkbox-checked-dark@2.png"));
2413
}
2414
2415
checkbutton.text-button,
2416
radiobutton.text-button {
2417
padding: 2px;
2418
outline-offset: 0;
2419
}
2420
2421
checkbutton.text-button label:not(:only-child),
2422
radiobutton.text-button label:not(:only-child) {
2423
margin: 0 4px;
2424
}
2425
2426
check,
2427
radio {
2428
min-height: 24px;
2429
min-width: 24px;
2430
margin: -8px;
2431
padding: 8px;
2432
}
2433
2434
check:checked, check:indeterminate,
2435
radio:checked,
2436
radio:indeterminate {
2437
color: #009688;
2438
}
2439
2440
check:checked:disabled, check:indeterminate:disabled,
2441
radio:checked:disabled,
2442
radio:indeterminate:disabled {
2443
color: rgba(0, 150, 136, 0.5);
2444
}
2445
2446
row:selected check:not(:checked):not(:indeterminate), row:selected
2447
radio:not(:checked):not(:indeterminate) {
2448
color: rgba(255, 255, 255, 0.7);
2449
}
2450
2451
row:selected check:not(:checked):not(:indeterminate):hover, row:selected check:not(:checked):not(:indeterminate):active, row:selected
2452
radio:not(:checked):not(:indeterminate):hover, row:selected
2453
radio:not(:checked):not(:indeterminate):active {
2454
color: #FFFFFF;
2455
}
2456
2457
row:selected check:not(:checked):not(:indeterminate):disabled, row:selected
2458
radio:not(:checked):not(:indeterminate):disabled {
2459
color: rgba(255, 255, 255, 0.3);
2460
}
2461
2462
popover check, popover check:hover, popover check:active, popover check:disabled, popover
2463
radio, popover
2464
radio:hover, popover
2465
radio:active, popover
2466
radio:disabled {
2467
box-shadow: none;
2468
background-image: none;
2469
}
2470
2471
popover check:not(:checked):not(:indeterminate):not(:disabled), popover
2472
radio:not(:checked):not(:indeterminate):not(:disabled) {
2473
color: rgba(255, 255, 255, 0.7);
2474
}
2475
2476
popover check.left:dir(rtl), popover
2477
radio.left:dir(rtl) {
2478
margin-left: -12px;
2479
margin-right: -4px;
2480
}
2481
2482
popover check.right:dir(ltr), popover
2483
radio.right:dir(ltr) {
2484
margin-left: -4px;
2485
margin-right: -12px;
2486
}
2487
2488
menu menuitem check, menu menuitem
2489
radio {
2490
transition: none;
2491
margin: 0;
2492
padding: 0;
2493
}
2494
2495
menu menuitem check:dir(ltr), menu menuitem
2496
radio:dir(ltr) {
2497
margin-right: 8px;
2498
}
2499
2500
menu menuitem check:dir(rtl), menu menuitem
2501
radio:dir(rtl) {
2502
margin-left: 8px;
2503
}
2504
2505
menu menuitem check:not(:checked):not(:indeterminate):not(:disabled), menu menuitem
2506
radio:not(:checked):not(:indeterminate):not(:disabled) {
2507
color: rgba(255, 255, 255, 0.7);
2508
}
2509
2510
menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem
2511
radio, menu menuitem
2512
radio:hover, menu menuitem
2513
radio:disabled {
2514
box-shadow: none;
2515
}
2516
2517
2518
check {
2519
-gtk-icon-source: -gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.svg"));
2520
}
2521
2522
2523
check:checked {
2524
-gtk-icon-source: -gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.svg"));
2525
}
2526
2527
2528
check:indeterminate {
2529
-gtk-icon-source: -gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.svg"));
2530
}
2531
2532
2533
radio {
2534
-gtk-icon-source: -gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.svg"));
2535
border-image-slice: 20;
2536
border-image-width: 20px;
2537
}
2538
2539
2540
radio:indeterminate {
2541
-gtk-icon-source: -gtk-recolor(url("assets/scalable/radio-mixed-symbolic.svg"));
2542
}
2543
2544
2545
radio {
2546
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#009688), to(transparent));
2547
}
2548
2549
2550
radio:checked:not(:indeterminate) {
2551
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.125, to(#009688), to(transparent));
2552
}
2553
2554
2555
radio:checked:not(:indeterminate):disabled {
2556
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.125, to(rgba(0, 150, 136, 0.5)), to(transparent));
2557
}
2558
2559
window.background:not(.csd) > widget > checkbutton > check,
2560
menu menuitem check {
2561
min-height: 16px;
2562
min-width: 16px;
2563
border-radius: 2px;
2564
-gtk-outline-radius: 2px;
2565
-gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-unchecked-symbolic.svg"));
2566
}
2567
2568
window.background:not(.csd) > widget > checkbutton > check:checked,
2569
menu menuitem check:checked {
2570
-gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-checked-symbolic.svg"));
2571
}
2572
2573
window.background:not(.csd) > widget > checkbutton > check:indeterminate,
2574
menu menuitem check:indeterminate {
2575
-gtk-icon-source: -gtk-recolor(url("assets/scalable/small-checkbox-mixed-symbolic.svg"));
2576
}
2577
2578
window.background:not(.csd) > widget > radiobutton > radio,
2579
menu menuitem radio {
2580
min-height: 16px;
2581
min-width: 16px;
2582
border-image: none;
2583
-gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-unchecked-symbolic.svg"));
2584
}
2585
2586
window.background:not(.csd) > widget > radiobutton > radio:checked,
2587
menu menuitem radio:checked {
2588
-gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-checked-symbolic.svg"));
2589
}
2590
2591
window.background:not(.csd) > widget > radiobutton > radio:indeterminate,
2592
menu menuitem radio:indeterminate {
2593
-gtk-icon-source: -gtk-recolor(url("assets/scalable/small-radio-mixed-symbolic.svg"));
2594
}
2595
2596
check:not(:checked):active {
2597
-gtk-icon-transform: rotate(90deg);
2598
}
2599
2600
check:not(:checked):indeterminate:active,
2601
radio:not(:checked):indeterminate:active {
2602
-gtk-icon-transform: scaleX(-1);
2603
}
2604
2605
check:not(:checked),
2606
radio:not(:checked) {
2607
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;
2608
}
2609
2610
check:not(:checked):active,
2611
radio:not(:checked):active {
2612
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0, -gtk-icon-transform 0;
2613
}
2614
2615
menu menuitem check:not(:checked), menu menuitem
2616
radio:not(:checked) {
2617
transition: none;
2618
}
2619
2620
treeview.view check,
2621
treeview.view radio {
2622
padding: 0;
2623
}
2624
2625
treeview.view check:hover,
2626
treeview.view radio:hover {
2627
box-shadow: inset 0 0 0 9999px alpha(#FFFFFF, 0.05);
2628
}
2629
2630
treeview.view check:hover:disabled,
2631
treeview.view radio:hover:disabled {
2632
box-shadow: none;
2633
}
2634
2635
treeview.view check:hover:selected,
2636
treeview.view radio:hover:selected {
2637
box-shadow: inset 0 0 0 9999px alpha(#FFFFFF, 0.05);
2638
}
2639
2640
treeview.view check,
2641
treeview.view radio {
2642
color: rgba(255, 255, 255, 0.7);
2643
}
2644
2645
treeview.view check:hover, treeview.view check:active,
2646
treeview.view radio:hover,
2647
treeview.view radio:active {
2648
color: #FFFFFF;
2649
}
2650
2651
treeview.view check:disabled,
2652
treeview.view radio:disabled {
2653
color: rgba(255, 255, 255, 0.3);
2654
}
2655
2656
treeview.view check:checked, treeview.view check:indeterminate,
2657
treeview.view radio:checked,
2658
treeview.view radio:indeterminate {
2659
color: #009688;
2660
}
2661
2662
treeview.view check:checked:disabled, treeview.view check:indeterminate:disabled,
2663
treeview.view radio:checked:disabled,
2664
treeview.view radio:indeterminate:disabled {
2665
color: rgba(0, 150, 136, 0.5);
2666
}
2667
2668
treeview.view check:selected,
2669
treeview.view radio:selected {
2670
color: rgba(255, 255, 255, 0.7);
2671
}
2672
2673
treeview.view check:selected:hover, treeview.view check:selected:active,
2674
treeview.view radio:selected:hover,
2675
treeview.view radio:selected:active {
2676
color: #FFFFFF;
2677
}
2678
2679
treeview.view check:selected:disabled,
2680
treeview.view radio:selected:disabled {
2681
color: rgba(255, 255, 255, 0.3);
2682
}
2683
2684
treeview.view check:selected:checked, treeview.view check:selected:indeterminate,
2685
treeview.view radio:selected:checked,
2686
treeview.view radio:selected:indeterminate {
2687
color: #009688;
2688
}
2689
2690
treeview.view check:selected:checked:disabled, treeview.view check:selected:indeterminate:disabled,
2691
treeview.view radio:selected:checked:disabled,
2692
treeview.view radio:selected:indeterminate:disabled {
2693
color: rgba(0, 150, 136, 0.5);
2694
}
2695
2696
treeview.view radio:checked {
2697
-gtk-icon-source: -gtk-recolor(url("assets/scalable/radio-checked-symbolic.svg"));
2698
border-image: none;
2699
}
2700
2701
/************
2702
* GtkScale *
2703
************/
2704
scale {
2705
min-height: 8px;
2706
min-width: 8px;
2707
padding: 12px;
2708
}
2709
2710
scale slider {
2711
min-height: 24px;
2712
min-width: 24px;
2713
margin: -11px;
2714
}
2715
2716
scale trough {
2717
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
2718
outline-offset: 2px;
2719
background-color: rgba(255, 255, 255, 0.3);
2720
}
2721
2722
scale trough:disabled {
2723
background-color: rgba(255, 255, 255, 0.12);
2724
}
2725
2726
scale highlight {
2727
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
2728
background-color: #009688;
2729
}
2730
2731
scale highlight:disabled {
2732
background-color: transparent;
2733
}
2734
2735
scale fill {
2736
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
2737
background-color: rgba(255, 255, 255, 0.3);
2738
}
2739
2740
scale fill:disabled {
2741
background-color: transparent;
2742
}
2743
2744
scale slider {
2745
transition: all 180ms cubic-bezier(0.4, 0, 0.2, 1);
2746
background-repeat: no-repeat;
2747
background-position: center;
2748
background-size: calc(100% - 10px);
2749
}
2750
2751
scale slider {
2752
background-image: -gtk-scaled(url("assets/scale-slider-dark.png"), url("assets/scale-slider-dark@2.png"));
2753
}
2754
2755
scale slider:disabled {
2756
background-image: -gtk-scaled(url("assets/scale-slider-disabled-dark.png"), url("assets/scale-slider-disabled-dark@2.png"));
2757
}
2758
2759
scale slider:hover {
2760
background-size: calc(100% - 8px);
2761
}
2762
2763
scale slider:active {
2764
background-size: calc(100% - 6px);
2765
}
2766
2767
scale.fine-tune slider {
2768
background-size: calc(100% - 12px);
2769
}
2770
2771
scale marks label,
2772
scale value {
2773
color: rgba(255, 255, 255, 0.5);
2774
}
2775
2776
scale marks {
2777
color: rgba(255, 255, 255, 0.3);
2778
}
2779
2780
scale marks.top {
2781
margin-bottom: 8px;
2782
margin-top: -16px;
2783
}
2784
2785
scale marks.bottom {
2786
margin-top: 8px;
2787
margin-bottom: -16px;
2788
}
2789
2790
scale marks.top {
2791
margin-right: 8px;
2792
margin-left: -16px;
2793
}
2794
2795
scale marks.bottom {
2796
margin-left: 8px;
2797
margin-right: -16px;
2798
}
2799
2800
scale.horizontal indicator {
2801
min-height: 8px;
2802
min-width: 1px;
2803
}
2804
2805
scale.vertical indicator {
2806
min-height: 1px;
2807
min-width: 8px;
2808
}
2809
2810
scale.horizontal.marks-before:not(.marks-after) slider {
2811
min-height: 30px;
2812
min-width: 24px;
2813
margin-top: -17px;
2814
background-position: center calc(100% - 5px);
2815
}
2816
2817
scale.horizontal.marks-before:not(.marks-after) slider {
2818
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider-dark.png"), url("assets/scale-horz-marks-before-slider-dark@2.png"));
2819
}
2820
2821
scale.horizontal.marks-before:not(.marks-after) slider:disabled {
2822
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider-disabled-dark.png"), url("assets/scale-horz-marks-before-slider-disabled-dark@2.png"));
2823
}
2824
2825
scale.horizontal.marks-before:not(.marks-after) slider:hover {
2826
background-position: center calc(100% - 4px);
2827
}
2828
2829
scale.horizontal.marks-before:not(.marks-after) slider:active {
2830
background-position: center calc(100% - 3px);
2831
}
2832
2833
scale.horizontal.marks-before:not(.marks-after).fine-tune slider {
2834
background-position: center calc(100% - 6px);
2835
}
2836
2837
scale.horizontal.marks-after:not(.marks-before) slider {
2838
min-height: 30px;
2839
min-width: 24px;
2840
margin-bottom: -17px;
2841
background-position: center calc(5px);
2842
}
2843
2844
scale.horizontal.marks-after:not(.marks-before) slider {
2845
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider-dark.png"), url("assets/scale-horz-marks-after-slider-dark@2.png"));
2846
}
2847
2848
scale.horizontal.marks-after:not(.marks-before) slider:disabled {
2849
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider-disabled-dark.png"), url("assets/scale-horz-marks-after-slider-disabled-dark@2.png"));
2850
}
2851
2852
scale.horizontal.marks-after:not(.marks-before) slider:hover {
2853
background-position: center calc(4px);
2854
}
2855
2856
scale.horizontal.marks-after:not(.marks-before) slider:active {
2857
background-position: center calc(3px);
2858
}
2859
2860
scale.horizontal.marks-after:not(.marks-before).fine-tune slider {
2861
background-position: center calc(6px);
2862
}
2863
2864
scale.vertical.marks-before:not(.marks-after) slider {
2865
min-height: 24px;
2866
min-width: 30px;
2867
margin-left: -17px;
2868
background-position: calc(5px) center;
2869
}
2870
2871
scale.vertical.marks-before:not(.marks-after) slider {
2872
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider-dark.png"), url("assets/scale-vert-marks-before-slider-dark@2.png"));
2873
}
2874
2875
scale.vertical.marks-before:not(.marks-after) slider:disabled {
2876
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider-disabled-dark.png"), url("assets/scale-vert-marks-before-slider-disabled-dark@2.png"));
2877
}
2878
2879
scale.vertical.marks-before:not(.marks-after) slider:hover {
2880
background-position: calc(4px) center;
2881
}
2882
2883
scale.vertical.marks-before:not(.marks-after) slider:active {
2884
background-position: calc(3px) center;
2885
}
2886
2887
scale.vertical.marks-before:not(.marks-after).fine-tune slider {
2888
background-position: calc(6px) center;
2889
}
2890
2891
scale.vertical.marks-after:not(.marks-before) slider {
2892
min-height: 24px;
2893
min-width: 30px;
2894
margin-right: -17px;
2895
background-position: calc(100% - 5px) center;
2896
}
2897
2898
scale.vertical.marks-after:not(.marks-before) slider {
2899
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider-dark.png"), url("assets/scale-vert-marks-after-slider-dark@2.png"));
2900
}
2901
2902
scale.vertical.marks-after:not(.marks-before) slider:disabled {
2903
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider-disabled-dark.png"), url("assets/scale-vert-marks-after-slider-disabled-dark@2.png"));
2904
}
2905
2906
scale.vertical.marks-after:not(.marks-before) slider:hover {
2907
background-position: calc(100% - 4px) center;
2908
}
2909
2910
scale.vertical.marks-after:not(.marks-before) slider:active {
2911
background-position: calc(100% - 3px) center;
2912
}
2913
2914
scale.vertical.marks-after:not(.marks-before).fine-tune slider {
2915
background-position: calc(100% - 6px) center;
2916
}
2917
2918
scale.color {
2919
min-height: 0;
2920
min-width: 0;
2921
}
2922
2923
scale.color.horizontal {
2924
padding: 0 0 12px 0;
2925
}
2926
2927
scale.color.horizontal slider:dir(ltr), scale.color.horizontal slider:dir(rtl) {
2928
margin-bottom: -12px;
2929
margin-top: -2px;
2930
}
2931
2932
scale.color.vertical:dir(ltr) {
2933
padding: 0 0 0 12px;
2934
}
2935
2936
scale.color.vertical:dir(ltr) slider {
2937
margin-left: -12px;
2938
margin-right: -2px;
2939
}
2940
2941
scale.color.vertical:dir(rtl) {
2942
padding: 0 12px 0 0;
2943
}
2944
2945
scale.color.vertical:dir(rtl) slider {
2946
margin-right: -12px;
2947
margin-left: -2px;
2948
}
2949
2950
/*****************
2951
* Progress bars *
2952
*****************/
2953
progressbar {
2954
color: rgba(255, 255, 255, 0.5);
2955
font-size: smaller;
2956
}
2957
2958
progressbar.horizontal trough,
2959
progressbar.horizontal progress {
2960
min-height: 4px;
2961
}
2962
2963
progressbar.vertical trough,
2964
progressbar.vertical progress {
2965
min-width: 4px;
2966
}
2967
2968
progressbar trough {
2969
background-color: rgba(51, 141, 214, 0.3);
2970
}
2971
2972
progressbar progress {
2973
background-color: #338DD6;
2974
}
2975
2976
progressbar trough.empty progress {
2977
all: unset;
2978
}
2979
2980
/*************
2981
* Level Bar *
2982
*************/
2983
levelbar.horizontal block {
2984
min-height: 4px;
2985
}
2986
2987
levelbar.horizontal.discrete block {
2988
min-width: 32px;
2989
}
2990
2991
levelbar.horizontal.discrete block:not(:last-child) {
2992
margin-right: 2px;
2993
}
2994
2995
levelbar.vertical block {
2996
min-width: 4px;
2997
}
2998
2999
levelbar.vertical.discrete block {
3000
min-height: 32px;
3001
}
3002
3003
levelbar.vertical.discrete block:not(:last-child) {
3004
margin-bottom: 2px;
3005
}
3006
3007
levelbar trough {
3008
padding: 2px;
3009
border-radius: 2px;
3010
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3011
background-color: #303030;
3012
}
3013
3014
levelbar trough:disabled {
3015
background-color: #292929;
3016
}
3017
3018
levelbar block.low {
3019
background-color: #FF6D00;
3020
}
3021
3022
levelbar block.high, levelbar block:not(.empty) {
3023
background-color: #338DD6;
3024
}
3025
3026
levelbar block.full {
3027
background-color: #00C853;
3028
}
3029
3030
levelbar block.empty {
3031
background-color: rgba(255, 255, 255, 0.12);
3032
}
3033
3034
/****************
3035
* Print dialog *
3036
*****************/
3037
printdialog paper {
3038
padding: 0;
3039
border: 1px solid rgba(0, 0, 0, 0.26);
3040
background-color: #303030;
3041
color: #FFFFFF;
3042
}
3043
3044
printdialog .dialog-action-box {
3045
margin: 12px;
3046
}
3047
3048
/**********
3049
* Frames *
3050
**********/
3051
frame > border,
3052
.frame {
3053
margin: 0;
3054
padding: 0;
3055
border: 1px solid rgba(0, 0, 0, 0.26);
3056
border-radius: 0;
3057
box-shadow: none;
3058
}
3059
3060
frame > border.flat,
3061
.frame.flat,
3062
frame.flat > border {
3063
border-style: none;
3064
}
3065
3066
actionbar > revealer > box {
3067
padding: 6px;
3068
border-top: 1px solid rgba(0, 0, 0, 0.26);
3069
}
3070
3071
scrolledwindow viewport.frame {
3072
border-style: none;
3073
}
3074
3075
overshoot.top {
3076
background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
3077
background-repeat: no-repeat;
3078
background-position: center top;
3079
background-color: transparent;
3080
border: none;
3081
box-shadow: none;
3082
}
3083
3084
overshoot.bottom {
3085
background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
3086
background-repeat: no-repeat;
3087
background-position: center bottom;
3088
background-color: transparent;
3089
border: none;
3090
box-shadow: none;
3091
}
3092
3093
overshoot.left {
3094
background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
3095
background-repeat: no-repeat;
3096
background-position: left center;
3097
background-color: transparent;
3098
border: none;
3099
box-shadow: none;
3100
}
3101
3102
overshoot.right {
3103
background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
3104
background-repeat: no-repeat;
3105
background-position: right center;
3106
background-color: transparent;
3107
border: none;
3108
box-shadow: none;
3109
}
3110
3111
undershoot.top {
3112
background-color: transparent;
3113
background-image: linear-gradient(to left, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
3114
padding-top: 1px;
3115
background-size: 12px 1px;
3116
background-repeat: repeat-x;
3117
background-origin: content-box;
3118
background-position: left top;
3119
}
3120
3121
undershoot.bottom {
3122
background-color: transparent;
3123
background-image: linear-gradient(to left, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
3124
padding-bottom: 1px;
3125
background-size: 12px 1px;
3126
background-repeat: repeat-x;
3127
background-origin: content-box;
3128
background-position: left bottom;
3129
}
3130
3131
undershoot.left {
3132
background-color: transparent;
3133
background-image: linear-gradient(to top, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
3134
padding-left: 1px;
3135
background-size: 1px 12px;
3136
background-repeat: repeat-y;
3137
background-origin: content-box;
3138
background-position: left top;
3139
}
3140
3141
undershoot.right {
3142
background-color: transparent;
3143
background-image: linear-gradient(to top, rgba(48, 48, 48, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
3144
padding-right: 1px;
3145
background-size: 1px 12px;
3146
background-repeat: repeat-y;
3147
background-origin: content-box;
3148
background-position: right top;
3149
}
3150
3151
junction {
3152
border-style: solid none none solid;
3153
border-width: 1px;
3154
border-color: rgba(0, 0, 0, 0.26);
3155
background-color: #303030;
3156
}
3157
3158
junction:dir(rtl) {
3159
border-style: solid solid none none;
3160
}
3161
3162
separator {
3163
min-width: 1px;
3164
min-height: 1px;
3165
background-color: rgba(0, 0, 0, 0.26);
3166
}
3167
3168
3169
button.font separator,
3170
button.file separator, .tweak-categories separator, preferences stacksidebar.sidebar list separator {
3171
min-width: 0;
3172
min-height: 0;
3173
background-color: transparent;
3174
}
3175
3176
/*********
3177
* Lists *
3178
*********/
3179
list {
3180
border-color: rgba(0, 0, 0, 0.26);
3181
background-color: #303030;
3182
}
3183
3184
list row {
3185
padding: 2px;
3186
}
3187
3188
row.activatable, .view, treeview.view header button, .budgie-menu button {
3189
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);
3190
box-shadow: inset 0 0 0 9999px transparent;
3191
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
3192
background-repeat: no-repeat;
3193
background-position: center;
3194
background-size: 1000% 1000%;
3195
}
3196
3197
row.activatable:hover, .view:hover, treeview.view header button:hover, .budgie-menu button:hover {
3198
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);
3199
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.05);
3200
}
3201
3202
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 {
3203
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, background-size 0, background-image 0;
3204
animation: ripple_effect 270ms cubic-bezier(0, 0, 0.2, 1) forwards;
3205
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
3206
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
3207
background-size: 0% 0%;
3208
}
3209
3210
/*********************
3211
* App Notifications *
3212
*********************/
3213
.app-notification {
3214
margin: 8px;
3215
}
3216
3217
.app-notification.frame,
3218
.app-notification border {
3219
border-style: none;
3220
}
3221
3222
/*************
3223
* Expanders *
3224
*************/
3225
expander title > arrow {
3226
transition: all 180ms cubic-bezier(0.4, 0, 0.2, 1);
3227
min-width: 16px;
3228
min-height: 16px;
3229
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
3230
-gtk-icon-transform: rotate(-90deg);
3231
color: rgba(255, 255, 255, 0.7);
3232
}
3233
3234
expander title > arrow:dir(rtl) {
3235
-gtk-icon-transform: rotate(90deg);
3236
}
3237
3238
expander title > arrow:checked {
3239
-gtk-icon-transform: unset;
3240
}
3241
3242
expander title > arrow:hover, expander title > arrow:active {
3243
color: #FFFFFF;
3244
}
3245
3246
expander title > arrow:disabled {
3247
color: rgba(255, 255, 255, 0.3);
3248
}
3249
3250
expander title > arrow:selected {
3251
color: rgba(255, 255, 255, 0.7);
3252
}
3253
3254
expander title > arrow:selected:hover, expander title > arrow:selected:active {
3255
color: #FFFFFF;
3256
}
3257
3258
expander title > arrow:selected:disabled {
3259
color: rgba(255, 255, 255, 0.3);
3260
}
3261
3262
/************
3263
* Calendar *
3264
************/
3265
calendar {
3266
padding: 1px;
3267
border: 1px solid rgba(0, 0, 0, 0.26);
3268
color: #FFFFFF;
3269
}
3270
3271
calendar:disabled {
3272
color: rgba(255, 255, 255, 0.5);
3273
}
3274
3275
calendar:selected {
3276
border-radius: 3px;
3277
}
3278
3279
calendar.header {
3280
border-style: none none solid;
3281
border-radius: 0;
3282
}
3283
3284
calendar.highlight {
3285
color: rgba(255, 255, 255, 0.7);
3286
font-weight: 500;
3287
}
3288
3289
calendar:indeterminate {
3290
color: rgba(255, 255, 255, 0.3);
3291
}
3292
3293
/***********
3294
* Dialogs *
3295
***********/
3296
messagedialog.background {
3297
background-color: #424242;
3298
}
3299
3300
messagedialog .titlebar {
3301
min-height: 20px;
3302
border-style: none;
3303
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
3304
background-color: #424242;
3305
color: #FFFFFF;
3306
}
3307
3308
messagedialog .titlebar:backdrop {
3309
color: rgba(255, 255, 255, 0.7);
3310
}
3311
3312
messagedialog.csd.background {
3313
border-bottom-left-radius: 2px;
3314
border-bottom-right-radius: 2px;
3315
}
3316
3317
messagedialog.csd .dialog-action-area button {
3318
padding: 8px 16px;
3319
border-top: 1px solid rgba(0, 0, 0, 0.26);
3320
border-radius: 0;
3321
}
3322
3323
messagedialog.csd .dialog-action-area button:first-child {
3324
border-bottom-left-radius: 2px;
3325
}
3326
3327
messagedialog.csd .dialog-action-area button:last-child {
3328
border-bottom-right-radius: 2px;
3329
}
3330
3331
filechooser .dialog-action-box {
3332
border-top: 1px solid rgba(0, 0, 0, 0.26);
3333
}
3334
3335
filechooser #pathbarbox {
3336
border-bottom: 1px solid rgba(0, 0, 0, 0.26);
3337
background-color: #212121;
3338
}
3339
3340
filechooserbutton:drop(active) {
3341
box-shadow: none;
3342
}
3343
3344
/***********
3345
* Sidebar *
3346
***********/
3347
.sidebar {
3348
border-style: none;
3349
background-color: #292929;
3350
}
3351
3352
stacksidebar.sidebar:dir(ltr) list, stacksidebar.sidebar.left list, stacksidebar.sidebar.left:dir(rtl) list, .sidebar:dir(ltr), .sidebar.left, .sidebar.left:dir(rtl) {
3353
border-right: 1px solid rgba(0, 0, 0, 0.26);
3354
border-left-style: none;
3355
}
3356
3357
stacksidebar.sidebar:dir(rtl) list, stacksidebar.sidebar.right list, .sidebar:dir(rtl), .sidebar.right {
3358
border-left: 1px solid rgba(0, 0, 0, 0.26);
3359
border-right-style: none;
3360
}
3361
3362
.sidebar list {
3363
background-color: transparent;
3364
}
3365
3366
paned .sidebar.left, paned .sidebar.right, paned .sidebar.left:dir(rtl), paned .sidebar:dir(rtl), paned .sidebar:dir(ltr), paned .sidebar {
3367
border-style: none;
3368
}
3369
3370
stacksidebar row {
3371
padding: 10px 4px;
3372
}
3373
3374
stacksidebar row > label {
3375
padding-left: 6px;
3376
padding-right: 6px;
3377
}
3378
3379
/****************
3380
* File chooser *
3381
****************/
3382
row image.sidebar-icon {
3383
color: rgba(255, 255, 255, 0.7);
3384
}
3385
3386
row:selected image.sidebar-icon {
3387
color: rgba(255, 255, 255, 0.7);
3388
}
3389
3390
placessidebar > viewport.frame {
3391
border-style: none;
3392
}
3393
3394
placessidebar list {
3395
padding: 1px 0 4px;
3396
}
3397
3398
placessidebar row {
3399
min-height: 32px;
3400
margin: -1px 0;
3401
padding: 0;
3402
}
3403
3404
placessidebar row > revealer {
3405
padding: 0 12px;
3406
}
3407
3408
placessidebar row:selected {
3409
color: #FFFFFF;
3410
}
3411
3412
placessidebar row:disabled {
3413
color: rgba(255, 255, 255, 0.5);
3414
}
3415
3416
placessidebar row image.sidebar-icon:dir(ltr) {
3417
padding-right: 8px;
3418
}
3419
3420
placessidebar row image.sidebar-icon:dir(rtl) {
3421
padding-left: 8px;
3422
}
3423
3424
placessidebar row label.sidebar-label:dir(ltr) {
3425
padding-right: 2px;
3426
}
3427
3428
placessidebar row label.sidebar-label:dir(rtl) {
3429
padding-left: 2px;
3430
}
3431
3432
placessidebar row.sidebar-placeholder-row {
3433
min-height: 2px;
3434
padding: 0 8px;
3435
background-image: image(#009688);
3436
background-clip: content-box;
3437
}
3438
3439
placessidebar row.sidebar-new-bookmark-row {
3440
color: #009688;
3441
}
3442
3443
placessidebar row:drop(active):not(:disabled) {
3444
box-shadow: inset 0 0 0 2px #009688;
3445
}
3446
3447
placesview .server-list-button > image {
3448
-gtk-icon-transform: rotate(0turn);
3449
}
3450
3451
placesview .server-list-button:checked > image {
3452
-gtk-icon-transform: rotate(-0.5turn);
3453
}
3454
3455
placesview > actionbar > revealer > box > label {
3456
padding-left: 8px;
3457
padding-right: 8px;
3458
}
3459
3460
/*********
3461
* Paned *
3462
*********/
3463
paned > separator {
3464
min-width: 1px;
3465
min-height: 1px;
3466
-gtk-icon-source: none;
3467
border-style: none;
3468
background-color: transparent;
3469
background-image: image(rgba(0, 0, 0, 0.26));
3470
background-size: 1px 1px;
3471
background-clip: content-box;
3472
}
3473
3474
paned > separator.wide {
3475
min-width: 6px;
3476
min-height: 6px;
3477
background-color: #212121;
3478
background-image: image(rgba(0, 0, 0, 0.26)), image(rgba(0, 0, 0, 0.26));
3479
background-size: 1px 1px, 1px 1px;
3480
}
3481
3482
paned.horizontal > separator {
3483
background-repeat: repeat-y;
3484
}
3485
3486
paned.horizontal > separator:dir(ltr) {
3487
margin: 0 -8px 0 0;
3488
padding: 0 8px 0 0;
3489
background-position: left;
3490
}
3491
3492
paned.horizontal > separator:dir(rtl) {
3493
margin: 0 0 0 -8px;
3494
padding: 0 0 0 8px;
3495
background-position: right;
3496
}
3497
3498
paned.horizontal > separator.wide {
3499
margin: 0;
3500
padding: 0;
3501
background-repeat: repeat-y, repeat-y;
3502
background-position: left, right;
3503
}
3504
3505
paned.vertical > separator {
3506
margin: 0 0 -8px 0;
3507
padding: 0 0 8px 0;
3508
background-repeat: repeat-x;
3509
background-position: top;
3510
}
3511
3512
paned.vertical > separator.wide {
3513
margin: 0;
3514
padding: 0;
3515
background-repeat: repeat-x, repeat-x;
3516
background-position: bottom, top;
3517
}
3518
3519
/**************
3520
* GtkInfoBar *
3521
**************/
3522
infobar {
3523
border-style: none;
3524
}
3525
3526
infobar.info {
3527
background-color: #66BB6A;
3528
}
3529
3530
infobar.question {
3531
background-color: #42A5F5;
3532
}
3533
3534
infobar.warning {
3535
background-color: #FFA726;
3536
}
3537
3538
infobar.error {
3539
background-color: #EF5350;
3540
}
3541
3542
infobar.info > label, infobar.info, infobar.question > label, infobar.question, infobar.warning > label, infobar.warning, infobar.error > label, infobar.error {
3543
color: #FFFFFF;
3544
}
3545
3546
/************
3547
* Tooltips *
3548
************/
3549
tooltip {
3550
border-radius: 2px;
3551
box-shadow: none;
3552
}
3553
3554
tooltip.background {
3555
background-color: rgba(66, 66, 66, 0.9);
3556
color: #FFFFFF;
3557
}
3558
3559
tooltip decoration {
3560
background-color: transparent;
3561
}
3562
3563
tooltip label {
3564
min-height: 20px;
3565
padding: 0 2px;
3566
}
3567
3568
/*****************
3569
* Color Chooser *
3570
*****************/
3571
colorswatch.top {
3572
border-top-left-radius: 2.5px;
3573
border-top-right-radius: 2.5px;
3574
}
3575
3576
colorswatch.top overlay {
3577
border-top-left-radius: 2px;
3578
border-top-right-radius: 2px;
3579
}
3580
3581
colorswatch.bottom {
3582
border-bottom-left-radius: 2.5px;
3583
border-bottom-right-radius: 2.5px;
3584
}
3585
3586
colorswatch.bottom overlay {
3587
border-bottom-left-radius: 2px;
3588
border-bottom-right-radius: 2px;
3589
}
3590
3591
colorswatch.left, colorswatch:first-child:not(.top) {
3592
border-top-left-radius: 2.5px;
3593
border-bottom-left-radius: 2.5px;
3594
}
3595
3596
colorswatch.left overlay, colorswatch:first-child:not(.top) overlay {
3597
border-top-left-radius: 2px;
3598
border-bottom-left-radius: 2px;
3599
}
3600
3601
colorswatch.right, colorswatch:last-child:not(.bottom) {
3602
border-top-right-radius: 2.5px;
3603
border-bottom-right-radius: 2.5px;
3604
}
3605
3606
colorswatch.right overlay, colorswatch:last-child:not(.bottom) overlay {
3607
border-top-right-radius: 2px;
3608
border-bottom-right-radius: 2px;
3609
}
3610
3611
colorswatch.dark {
3612
color: #FFFFFF;
3613
}
3614
3615
colorswatch.light {
3616
color: rgba(0, 0, 0, 0.87);
3617
}
3618
3619
colorswatch:drop(active) {
3620
box-shadow: none;
3621
}
3622
3623
colorswatch:drop(active).light overlay {
3624
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), 0 0 0 2px #009688;
3625
}
3626
3627
colorswatch:drop(active).dark overlay {
3628
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), 0 0 0 2px #009688;
3629
}
3630
3631
colorswatch overlay {
3632
transition: box-shadow 180ms cubic-bezier(0, 0, 0.2, 1);
3633
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3634
}
3635
3636
colorswatch overlay:hover {
3637
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3638
}
3639
3640
colorswatch#add-color-button {
3641
border-radius: 2px 2px 0 0;
3642
color: #FFFFFF;
3643
}
3644
3645
colorswatch#add-color-button:only-child {
3646
border-radius: 2px;
3647
}
3648
3649
colorswatch#add-color-button overlay {
3650
background-image: linear-gradient(to right, #EF5350 25%, #FFA726 25%, #FFA726 50%, #66BB6A 50%, #66BB6A 75%, #42A5F5 75%);
3651
}
3652
3653
colorswatch:disabled {
3654
opacity: 0.5;
3655
}
3656
3657
colorswatch:disabled overlay {
3658
box-shadow: none;
3659
}
3660
3661
colorswatch#editor-color-sample {
3662
border-radius: 2.5px;
3663
}
3664
3665
colorswatch#editor-color-sample overlay {
3666
border-radius: 2px;
3667
}
3668
3669
colorchooser .popover.osd {
3670
transition: box-shadow 180ms cubic-bezier(0, 0, 0.2, 1);
3671
border-radius: 2px;
3672
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.1);
3673
background-color: #303030;
3674
}
3675
3676
colorchooser .popover.osd:backdrop {
3677
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);
3678
}
3679
3680
/********
3681
* Misc *
3682
********/
3683
.content-view {
3684
background-color: #212121;
3685
}
3686
3687
/**********************
3688
* Window Decorations *
3689
**********************/
3690
decoration {
3691
transition: box-shadow 180ms cubic-bezier(0, 0, 0.2, 1);
3692
border-radius: 2px 2px 0 0;
3693
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent;
3694
margin: 8px;
3695
}
3696
3697
decoration:backdrop {
3698
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent;
3699
}
3700
3701
.maximized decoration,
3702
.fullscreen decoration,
3703
.tiled decoration,
3704
.tiled-top decoration,
3705
.tiled-right decoration,
3706
.tiled-bottom decoration,
3707
.tiled-left decoration {
3708
border-radius: 0;
3709
}
3710
3711
.popup decoration {
3712
box-shadow: none;
3713
}
3714
3715
.ssd decoration {
3716
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16);
3717
}
3718
3719
.csd.popup decoration {
3720
border-radius: 2px;
3721
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3722
}
3723
3724
tooltip.csd decoration {
3725
border-radius: 2px;
3726
box-shadow: none;
3727
}
3728
3729
messagedialog.csd decoration {
3730
border-radius: 2px;
3731
}
3732
3733
.solid-csd decoration {
3734
margin: 0;
3735
border-radius: 0;
3736
box-shadow: none;
3737
background-color: #303030;
3738
}
3739
3740
.view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3741
entry selection, modelbutton.flat:selected,
3742
.menuitem.button.flat:selected, popover.background.menu button:checked,
3743
popover.background button.model:checked, row:selected, calendar:selected, text:selected, .budgie-menu button:checked {
3744
background-color: #338DD6;
3745
}
3746
3747
row:selected label, label:selected, .view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3748
entry selection, modelbutton.flat:selected,
3749
.menuitem.button.flat:selected, popover.background.menu button:checked,
3750
popover.background button.model:checked, row:selected, calendar:selected, text:selected, .budgie-menu button:checked {
3751
color: #FFFFFF;
3752
}
3753
3754
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,
3755
entry selection:disabled, modelbutton.flat:disabled:selected,
3756
.menuitem.button.flat:disabled:selected, popover.background.menu button:disabled:checked,
3757
popover.background button.model:disabled:checked, row:disabled:selected, calendar:disabled:selected, text:disabled:selected, .budgie-menu button:disabled:checked {
3758
color: rgba(255, 255, 255, 0.5);
3759
}
3760
3761
.monospace {
3762
font-family: monospace;
3763
}
3764
3765
/**********************
3766
* Touch Copy & Paste *
3767
**********************/
3768
cursor-handle {
3769
border-radius: 9999px;
3770
background-color: #009688;
3771
background-image: none;
3772
}
3773
3774
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) {
3775
padding-left: 6px;
3776
border-top-right-radius: 0;
3777
}
3778
3779
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) {
3780
padding-right: 6px;
3781
border-top-left-radius: 0;
3782
}
3783
3784
cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) {
3785
-GtkWidget-text-handle-width: 24;
3786
-GtkWidget-text-handle-height: 30;
3787
-gtk-icon-source: -gtk-scaled(url("assets/scale-horz-marks-before-slider-dark.png"), url("assets/scale-horz-marks-before-slider-dark@2.png"));
3788
}
3789
3790
.context-menu {
3791
font: initial;
3792
}
3793
3794
.keycap {
3795
min-width: 12px;
3796
min-height: 26px;
3797
margin-top: 2px;
3798
padding-bottom: 2px;
3799
padding-left: 8px;
3800
padding-right: 8px;
3801
border: solid 1px rgba(0, 0, 0, 0.26);
3802
border-radius: 3px;
3803
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.26);
3804
background-color: #303030;
3805
color: #FFFFFF;
3806
font-size: smaller;
3807
}
3808
3809
:not(decoration):not(window):drop(active) {
3810
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
3811
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 #009688;
3812
caret-color: #009688;
3813
}
3814
3815
stackswitcher button.text-button {
3816
min-width: 100px;
3817
}
3818
3819
stackswitcher button.circular,
3820
stackswitcher button.text-button.circular {
3821
min-width: 32px;
3822
min-height: 32px;
3823
padding: 0;
3824
}
3825
3826
/*********
3827
* Emoji *
3828
*********/
3829
popover.emoji-picker {
3830
padding: 0;
3831
}
3832
3833
popover.emoji-picker entry {
3834
border-bottom: 1px solid rgba(0, 0, 0, 0.26);
3835
border-bottom-left-radius: 0;
3836
border-bottom-right-radius: 0;
3837
box-shadow: none;
3838
}
3839
3840
popover.emoji-picker scrolledwindow {
3841
border-bottom: 1px solid rgba(0, 0, 0, 0.26);
3842
}
3843
3844
button.emoji-section {
3845
margin-top: -1px;
3846
padding: 0 8px;
3847
min-width: 24px;
3848
min-height: 32px;
3849
border-radius: 0;
3850
outline-offset: -6px;
3851
box-shadow: none;
3852
}
3853
3854
button.emoji-section:hover {
3855
box-shadow: inset 0 2px rgba(255, 255, 255, 0.3);
3856
}
3857
3858
button.emoji-section:active {
3859
box-shadow: inset 0 2px #338DD6;
3860
background-image: radial-gradient(circle farthest-corner at center, rgba(51, 141, 214, 0.7) 10%, transparent 0%);
3861
}
3862
3863
button.emoji-section:checked {
3864
box-shadow: inset 0 2px #338DD6;
3865
background-color: transparent;
3866
}
3867
3868
button.emoji-section:first-child {
3869
margin-left: 4px;
3870
}
3871
3872
button.emoji-section:last-child {
3873
margin-right: 4px;
3874
}
3875
3876
.emoji {
3877
min-width: 3em;
3878
min-height: 3em;
3879
padding: 0;
3880
}
3881
3882
.emoji widget {
3883
transition: all 180ms cubic-bezier(0, 0, 0.2, 1);
3884
}
3885
3886
.emoji widget:hover {
3887
font-size: larger;
3888
}
3889
3890
/************
3891
* Nautilus *
3892
************/
3893
.nautilus-window,
3894
.nautilus-window notebook,
3895
.nautilus-window notebook > stack {
3896
background-color: #303030;
3897
}
3898
3899
.nautilus-desktop.nautilus-canvas-item:not(:selected), .caja-desktop.caja-canvas-item:not(:selected) {
3900
color: #FFFFFF;
3901
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3902
}
3903
3904
@keyframes needs_attention_keyframes {
3905
to {
3906
background-color: alpha(currentColor, 0.3);
3907
}
3908
}
3909
3910
.nautilus-operations-button-needs-attention {
3911
animation: needs_attention_keyframes 270ms cubic-bezier(0.4, 0, 0.2, 1) 2 alternate;
3912
}
3913
3914
.nautilus-operations-button-needs-attention-multiple {
3915
animation: needs_attention_keyframes 270ms cubic-bezier(0.4, 0, 0.2, 1) 4 alternate;
3916
}
3917
3918
.nautilus-window .floating-bar {
3919
min-height: 32px;
3920
padding: 0;
3921
border-style: solid solid none;
3922
border-width: 1px;
3923
border-color: rgba(0, 0, 0, 0.26);
3924
border-radius: 3px 3px 0 0;
3925
background-color: #303030;
3926
background-clip: border-box;
3927
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), border-width 0;
3928
}
3929
3930
.nautilus-window .floating-bar.bottom.left {
3931
margin-right: 7px;
3932
border-left-style: none;
3933
border-top-left-radius: 0;
3934
}
3935
3936
.nautilus-window .floating-bar.bottom.right {
3937
margin-left: 7px;
3938
border-right-style: none;
3939
border-top-right-radius: 0;
3940
}
3941
3942
.nautilus-window .floating-bar button {
3943
margin: 6px;
3944
}
3945
3946
.disk-space-display.unknown {
3947
background-color: #FF6D00;
3948
}
3949
3950
.disk-space-display.used {
3951
background-color: #338DD6;
3952
}
3953
3954
.disk-space-display.free {
3955
background-color: rgba(255, 255, 255, 0.12);
3956
}
3957
3958
.nautilus-window searchbar {
3959
border-top: 1px solid rgba(0, 0, 0, 0.26);
3960
}
3961
3962
.nautilus-window .searchbar-container {
3963
margin-top: -1px;
3964
}
3965
3966
.conflict-row:not(:selected) {
3967
background-color: #6e4222;
3968
}
3969
3970
.nautilus-window flowboxchild > widget > .icon-item-background {
3971
padding: 4px;
3972
border-radius: 2px;
3973
}
3974
3975
.nautilus-window flowboxchild:selected {
3976
background-color: transparent;
3977
}
3978
3979
.nautilus-window flowboxchild:selected > widget > .icon-item-background {
3980
background-color: #338DD6;
3981
}
3982
3983
dialog.background > box.dialog-vbox.vertical > grid.horizontal > scrolledwindow.frame {
3984
border-style: none;
3985
}
3986
3987
dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal:last-child {
3988
margin: -6px 0 0 -6px;
3989
border-top: 1px solid rgba(0, 0, 0, 0.26);
3990
}
3991
3992
dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal:last-child > label {
3993
margin: 0 8px;
3994
}
3995
3996
dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal:last-child > box > button {
3997
border-radius: 0;
3998
}
3999
4000
.nautilus-window > popover.menu:not(:last-child) {
4001
padding: 3px;
4002
}
4003
4004
.nautilus-window > popover.menu:not(:last-child) > stack > box > box > box {
4005
margin-top: -6px;
4006
}
4007
4008
.nautilus-window > popover.menu:not(:last-child) > stack > box > box > box > box {
4009
margin-bottom: -6px;
4010
}
4011
4012
.nautilus-window > popover.menu:not(:last-child) > stack > box > box > box > box.linked {
4013
margin-top: 1px;
4014
}
4015
4016
.nautilus-window > popover.menu:not(:last-child) separator {
4017
margin-bottom: -2px;
4018
}
4019
4020
.nautilus-menu-sort-heading {
4021
margin: 1px 3px;
4022
font-weight: 500;
4023
}
4024
4025
.nautilus-menu-sort-heading:disabled {
4026
color: rgba(255, 255, 255, 0.5);
4027
}
4028
4029
.nautilus-window paned > separator {
4030
background-color: #212121;
4031
}
4032
4033
/*********
4034
* gedit *
4035
*********/
4036
.open-document-selector-path-label {
4037
color: rgba(255, 255, 255, 0.7);
4038
font-size: smaller;
4039
}
4040
4041
.open-document-selector-path-label:selected {
4042
color: rgba(255, 255, 255, 0.7);
4043
}
4044
4045
.gedit-document-panel {
4046
background-color: #292929;
4047
}
4048
4049
.gedit-document-panel row button.flat {
4050
margin-top: 8px;
4051
margin-bottom: 8px;
4052
}
4053
4054
.gedit-document-panel-group-row:not(:first-child) {
4055
border-top: 1px solid rgba(0, 0, 0, 0.26);
4056
}
4057
4058
.gedit-side-panel-paned statusbar {
4059
border-top: 1px solid rgba(0, 0, 0, 0.26);
4060
}
4061
4062
.gedit-search-slider {
4063
margin: 4px 4px 8px;
4064
}
4065
4066
.gedit-search-slider entry:dir(ltr), .gedit-search-slider entry:dir(rtl) {
4067
border-radius: 2px;
4068
}
4069
4070
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag, .gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
4071
all: unset;
4072
color: rgba(255, 255, 255, 0.5);
4073
}
4074
4075
.gedit-search-slider entry:dir(ltr) {
4076
margin-right: -58px;
4077
padding-right: 58px;
4078
}
4079
4080
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag {
4081
margin-left: 6px;
4082
}
4083
4084
.gedit-search-slider entry:dir(ltr) image.right {
4085
margin-right: 0;
4086
}
4087
4088
.gedit-search-slider entry:dir(rtl) {
4089
margin-left: -58px;
4090
padding-left: 58px;
4091
}
4092
4093
.gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
4094
margin-right: 6px;
4095
}
4096
4097
.gedit-search-slider entry:dir(rtl) image.left {
4098
margin-left: 0;
4099
}
4100
4101
.gedit-search-slider entry.error ~ button {
4102
color: rgba(255, 255, 255, 0.7);
4103
}
4104
4105
.gedit-search-slider entry.error ~ button:hover, .gedit-search-slider entry.error ~ button:active {
4106
color: #FFFFFF;
4107
}
4108
4109
.gedit-search-slider entry.error ~ button:disabled {
4110
color: rgba(255, 255, 255, 0.3);
4111
}
4112
4113
.gedit-search-slider button {
4114
border: solid 6px transparent;
4115
}
4116
4117
.gedit-search-slider button:last-child:dir(ltr), .gedit-search-slider button:not(:first-child):dir(rtl) {
4118
margin-left: -3px;
4119
}
4120
4121
.gedit-search-slider button:first-child:dir(rtl), .gedit-search-slider button:not(:last-child):dir(ltr) {
4122
margin-right: -3px;
4123
}
4124
4125
frame.gedit-map-frame > border:dir(ltr) {
4126
border-style: none none none solid;
4127
}
4128
4129
frame.gedit-map-frame > border:dir(rtl) {
4130
border-style: none solid none none;
4131
}
4132
4133
/**************
4134
* Tweak Tool *
4135
**************/
4136
.tweak-categories {
4137
background-image: image(#292929);
4138
}
4139
4140
.tweak {
4141
padding: 3px;
4142
}
4143
4144
.tweak.title:hover {
4145
box-shadow: none;
4146
}
4147
4148
.tweak-group-white,
4149
.tweak-white,
4150
.tweak-white:hover {
4151
background-image: image(#303030);
4152
}
4153
4154
.tweak-startup,
4155
.tweak-startup:hover {
4156
background-image: image(#303030);
4157
}
4158
4159
.tweak-group-startup {
4160
background-image: image(#303030);
4161
border: 1px solid rgba(0, 0, 0, 0.26);
4162
}
4163
4164
row#Focus,
4165
row#StaticWorkspaceTweak,
4166
row#dynamic-workspaces,
4167
row#PrimaryWorkspaceTweak,
4168
row#workspaces-only-on-primary {
4169
padding: 0;
4170
border: 1px solid rgba(0, 0, 0, 0.26);
4171
}
4172
4173
row#Focus row:not(:last-child),
4174
row#StaticWorkspaceTweak row:not(:last-child),
4175
row#dynamic-workspaces row:not(:last-child),
4176
row#PrimaryWorkspaceTweak row:not(:last-child),
4177
row#workspaces-only-on-primary row:not(:last-child) {
4178
border-bottom: 1px solid rgba(0, 0, 0, 0.26);
4179
}
4180
4181
row#Focus.tweak > list,
4182
row#StaticWorkspaceTweak.tweak > list,
4183
row#dynamic-workspaces.tweak > list,
4184
row#PrimaryWorkspaceTweak.tweak > list,
4185
row#workspaces-only-on-primary.tweak > list {
4186
margin-top: -3px;
4187
}
4188
4189
row#Focus,
4190
row#PrimaryWorkspaceTweak,
4191
row#workspaces-only-on-primary {
4192
margin-top: 4px;
4193
}
4194
4195
/***********
4196
* Builder *
4197
***********/
4198
layouttabbar {
4199
border-bottom: 1px solid rgba(0, 0, 0, 0.26);
4200
background-color: #212121;
4201
}
4202
4203
layouttabbar > box > button {
4204
margin: 4px 0;
4205
}
4206
4207
layouttab {
4208
margin: 0 8px;
4209
border-style: none solid;
4210
border-width: 1px;
4211
border-color: rgba(0, 0, 0, 0.26);
4212
box-shadow: inset 0 -2px #338DD6;
4213
background-color: #303030;
4214
}
4215
4216
layouttab separator.vertical {
4217
margin: 8px 4px;
4218
}
4219
4220
layouttab button.text-button, layouttab button.image-button, layouttab button {
4221
margin-top: 8px;
4222
margin-bottom: 8px;
4223
padding: 0 4px;
4224
}
4225
4226
layout {
4227
border: 1px solid rgba(0, 0, 0, 0.26);
4228
-PnlDockBin-handle-size: 1;
4229
}
4230
4231
entry.search-missing {
4232
background-color: #DD2C00;
4233
color: #FFFFFF;
4234
}
4235
4236
window.workbench treeview.image {
4237
color: rgba(255, 255, 255, 0.7);
4238
}
4239
4240
window.workbench treeview.image:selected {
4241
color: rgba(255, 255, 255, 0.7);
4242
}
4243
4244
popover.popover-selector list {
4245
padding: 6px;
4246
}
4247
4248
popover.popover-selector list row {
4249
border-radius: 2px;
4250
}
4251
4252
popover.popover-selector list row image:dir(ltr) {
4253
margin-right: 6px;
4254
}
4255
4256
popover.popover-selector list row image:dir(rtl) {
4257
margin-left: 6px;
4258
}
4259
4260
popover.popover-selector list row .accel:dir(ltr) {
4261
margin-left: 6px;
4262
}
4263
4264
popover.popover-selector list row .accel:dir(rtl) {
4265
margin-right: 6px;
4266
}
4267
4268
omnibar.linked:not(.vertical) entry {
4269
border-radius: 2px;
4270
}
4271
4272
omnibar:not(:hover):not(:active) entry {
4273
color: rgba(255, 255, 255, 0.7);
4274
}
4275
4276
popover.omnibar list row:not(:last-child) {
4277
border-bottom: 1px solid rgba(0, 0, 0, 0.26);
4278
}
4279
4280
entry.preferences-search {
4281
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.26);
4282
background-color: #303030;
4283
}
4284
4285
preferences stacksidebar.sidebar list {
4286
background-color: #292929;
4287
}
4288
4289
preferences stacksidebar.sidebar:dir(ltr) list, preferences stacksidebar.sidebar:dir(rtl) list {
4290
border-style: none;
4291
}
4292
4293
preferences > box > box:dir(ltr) {
4294
border-right: 1px solid rgba(0, 0, 0, 0.26);
4295
}
4296
4297
preferences > box > box:dir(rtl) {
4298
border-left: 1px solid rgba(0, 0, 0, 0.26);
4299
}
4300
4301
popover.messagepopover.background {
4302
padding: 0;
4303
}
4304
4305
popover.messagepopover .popover-action-area button {
4306
padding: 8px 16px;
4307
border-top: 1px solid rgba(0, 0, 0, 0.26);
4308
border-radius: 0;
4309
}
4310
4311
popover.messagepopover .popover-action-area button:first-child {
4312
border-bottom-left-radius: 2px;
4313
}
4314
4315
popover.messagepopover .popover-action-area button:last-child {
4316
border-bottom-right-radius: 2px;
4317
}
4318
4319
popover.messagepopover .popover-content-area {
4320
margin: 16px;
4321
}
4322
4323
popover.transfers list {
4324
background-color: transparent;
4325
}
4326
4327
popover.transfers list row:not(:first-child) {
4328
border-top: 1px solid rgba(0, 0, 0, 0.26);
4329
}
4330
4331
popover.transfers list row > box {
4332
padding: 10px;
4333
}
4334
4335
dockbin {
4336
border: 1px solid rgba(0, 0, 0, 0.26);
4337
-PnlDockBin-handle-size: 1;
4338
}
4339
4340
dockpaned {
4341
border: 1px solid rgba(0, 0, 0, 0.26);
4342
}
4343
4344
eggsearchbar box.search-bar {
4345
padding: 0 8px;
4346
border-bottom: 1px solid rgba(0, 0, 0, 0.26);
4347
background-color: #212121;
4348
}
4349
4350
docktabstrip {
4351
padding: 0 8px;
4352
border-bottom: 1px solid rgba(0, 0, 0, 0.26);
4353
background-color: #212121;
4354
}
4355
4356
docktab {
4357
transition: all 270ms cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
4358
min-height: 20px;
4359
min-width: 20px;
4360
margin-bottom: -1px;
4361
padding: 6px 6px;
4362
outline-offset: -6px;
4363
border-width: 1px;
4364
border-color: transparent;
4365
background-image: radial-gradient(circle farthest-corner at center, #338DD6 10%, transparent 0%);
4366
background-repeat: no-repeat;
4367
background-position: center;
4368
background-size: 0% 0%;
4369
color: rgba(255, 255, 255, 0.7);
4370
font-weight: 500;
4371
}
4372
4373
docktab:hover {
4374
box-shadow: inset 0 -2px rgba(255, 255, 255, 0.3);
4375
color: #FFFFFF;
4376
}
4377
4378
docktab:checked {
4379
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);
4380
box-shadow: inset 0 -2px #338DD6;
4381
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
4382
background-size: 1000% 1000%;
4383
color: #FFFFFF;
4384
}
4385
4386
dockoverlayedge {
4387
background-color: #212121;
4388
}
4389
4390
dockoverlayedge docktabstrip {
4391
padding: 0;
4392
border: none;
4393
}
4394
4395
dockoverlayedge.left-edge docktab:hover {
4396
box-shadow: inset -2px 0 rgba(255, 255, 255, 0.3);
4397
}
4398
4399
dockoverlayedge.left-edge docktab:checked {
4400
box-shadow: inset -2px 0 #338DD6;
4401
}
4402
4403
dockoverlayedge.right-edge docktab:hover {
4404
box-shadow: inset 2px 0 rgba(255, 255, 255, 0.3);
4405
}
4406
4407
dockoverlayedge.right-edge docktab:checked {
4408
box-shadow: inset 2px 0 #338DD6;
4409
}
4410
4411
pillbox {
4412
background-color: #212121;
4413
border-radius: 2px;
4414
}
4415
4416
layoutpane entry.search {
4417
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.26);
4418
background-color: #303030;
4419
}
4420
4421
editortweak entry.search {
4422
margin-bottom: -1px;
4423
box-shadow: none;
4424
}
4425
4426
.gb-search-entry-occurrences-tag {
4427
box-shadow: none;
4428
background-color: transparent;
4429
}
4430
4431
docktabstrip {
4432
min-height: 39px;
4433
}
4434
4435
window.workbench preferences preferencesgroup list entry {
4436
padding-top: 8px;
4437
padding-bottom: 8px;
4438
}
4439
4440
button.run-arrow-button {
4441
padding-left: 8px;
4442
padding-right: 8px;
4443
}
4444
4445
button.dzlmenubutton image {
4446
min-width: 26px;
4447
}
4448
4449
button.dzlmenubutton image.arrow {
4450
min-width: 23px;
4451
}
4452
4453
button.dzlmenubuttonitem {
4454
color: #FFFFFF;
4455
font-weight: normal;
4456
}
4457
4458
button.dzlmenubuttonitem:disabled {
4459
color: rgba(255, 255, 255, 0.5);
4460
}
4461
4462
idelayoutstackheader {
4463
border-bottom: 1px solid rgba(0, 0, 0, 0.26);
4464
}
4465
4466
idelayoutstackheader button:checked {
4467
color: #FFFFFF;
4468
}
4469
4470
ideeditorutilities > dzldockpaned > box > stackswitcher {
4471
padding: 8px 0;
4472
background-color: #212121;
4473
}
4474
4475
ideeditorutilities > dzldockpaned > box > stackswitcher:dir(ltr) {
4476
border-right: 1px solid rgba(0, 0, 0, 0.26);
4477
}
4478
4479
ideeditorutilities > dzldockpaned > box > stackswitcher:dir(rtl) {
4480
border-left: 1px solid rgba(0, 0, 0, 0.26);
4481
}
4482
4483
ideeditorutilities > dzldockpaned > box > stackswitcher button {
4484
border-radius: 0;
4485
outline-offset: -6px;
4486
box-shadow: none;
4487
background-color: transparent;
4488
}
4489
4490
ideeditorutilities > dzldockpaned > box > stackswitcher button:active {
4491
background-image: radial-gradient(circle farthest-corner at center, rgba(51, 141, 214, 0.7) 10%, transparent 0%);
4492
}
4493
4494
ideeditorutilities > dzldockpaned > box > stackswitcher button:checked {
4495
background-color: transparent;
4496
color: #FFFFFF;
4497
}
4498
4499
ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(ltr) {
4500
margin-right: -1px;
4501
}
4502
4503
ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(ltr):hover {
4504
box-shadow: inset -2px 0 rgba(255, 255, 255, 0.3);
4505
}
4506
4507
ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(ltr):active, ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(ltr):checked {
4508
box-shadow: inset -2px 0 #338DD6;
4509
}
4510
4511
ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(rtl) {
4512
margin-left: -1px;
4513
}
4514
4515
ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(rtl):hover {
4516
box-shadow: inset 2px 0 rgba(255, 255, 255, 0.3);
4517
}
4518
4519
ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(rtl):active, ideeditorutilities > dzldockpaned > box > stackswitcher button:dir(rtl):checked {
4520
box-shadow: inset 2px 0 #338DD6;
4521
}
4522
4523
ideeditorsidebar notebook header {
4524
background: transparent;
4525
}
4526
4527
popover.messagepopover list {
4528
border: 1px solid rgba(0, 0, 0, 0.26);
4529
}
4530
4531
popover.messagepopover list row:not(:last-child) {
4532
border-bottom: 1px solid rgba(0, 0, 0, 0.26);
4533
}
4534
4535
/**********
4536
* Photos *
4537
**********/
4538
GdMainIconView.content-view {
4539
-GdMainIconView-icon-size: 48;
4540
}
4541
4542
.documents-counter {
4543
margin: 8px;
4544
border-radius: 9999px;
4545
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
4546
background-color: #009688;
4547
color: #FFFFFF;
4548
font-weight: bold;
4549
}
4550
4551
.documents-scrolledwin.frame {
4552
border-style: none;
4553
}
4554
4555
.documents-scrolledwin.frame frame.content-view > border {
4556
border-style: none;
4557
}
4558
4559
.photos-fade-in {
4560
opacity: 1;
4561
transition: opacity 180ms cubic-bezier(0, 0, 0.2, 1);
4562
}
4563
4564
.photos-fade-out {
4565
opacity: 0;
4566
transition: opacity 180ms cubic-bezier(0, 0, 0.2, 1);
4567
}
4568
4569
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) {
4570
border-style: none none none solid;
4571
}
4572
4573
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(rtl) {
4574
border-style: none solid none none;
4575
}
4576
4577
/*********
4578
* Music *
4579
*********/
4580
.side-panel:dir(ltr) {
4581
border-style: solid;
4582
border-color: rgba(0, 0, 0, 0.26);
4583
}
4584
4585
.side-panel:dir(rtl) {
4586
border-style: solid;
4587
border-color: rgba(0, 0, 0, 0.26);
4588
}
4589
4590
.side-panel .view {
4591
background-image: image(#292929);
4592
}
4593
4594
.side-panel .view:hover {
4595
background-image: image(#343434);
4596
}
4597
4598
.side-panel .view:selected {
4599
background-image: image(#338DD6);
4600
}
4601
4602
.side-panel .view:selected:hover {
4603
background-image: image(#3d93d8);
4604
}
4605
4606
.songs-list:hover {
4607
background-image: image(alpha(currentColor, 0.05));
4608
}
4609
4610
frame.documents-dropdown {
4611
margin: 8px;
4612
}
4613
4614
frame.documents-dropdown > border {
4615
border: none;
4616
}
4617
4618
box.vertical > revealer > toolbar.search-bar {
4619
border-bottom: 1px solid rgba(0, 0, 0, 0.26);
4620
background-clip: border-box;
4621
}
4622
4623
box.vertical > revealer > toolbar.search-bar button > widget {
4624
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4625
}
4626
4627
/*********
4628
* To Do *
4629
*********/
4630
taskrow {
4631
transition: all 180ms cubic-bezier(0, 0, 0.2, 1);
4632
margin: 0 -8px;
4633
}
4634
4635
taskrow:hover {
4636
transition: none;
4637
}
4638
4639
taskrow label {
4640
margin: 0 8px;
4641
}
4642
4643
taskrow image {
4644
min-width: 16px;
4645
}
4646
4647
task-list-view > box > revealer > box > button {
4648
margin: -4px;
4649
}
4650
4651
/*******
4652
* eog *
4653
*******/
4654
#eog-thumb-nav scrolledwindow {
4655
border-top: none;
4656
}
4657
4658
#eog-thumb-nav button {
4659
-gtk-outline-radius: 2px;
4660
}
4661
4662
/*************
4663
* Evolution *
4664
*************/
4665
frame.taskbar > border {
4666
border-style: solid none none;
4667
}
4668
4669
box.vertical > paned.horizontal notebook widget .frame {
4670
border-style: none;
4671
}
4672
4673
/********
4674
* gitg *
4675
********/
4676
frame.commit-frame > border {
4677
border-style: solid none none;
4678
}
4679
4680
/**************
4681
* Characters *
4682
**************/
4683
box.dialog-vbox scrolledwindow.related {
4684
border: 1px solid rgba(0, 0, 0, 0.26);
4685
}
4686
4687
list.categories {
4688
background-image: image(#292929);
4689
}
4690
4691
/*********
4692
* Boxes *
4693
*********/
4694
.transparent-bg + stack overlay > label {
4695
min-height: 24px;
4696
padding: 0 4px;
4697
border-radius: 2px;
4698
background-color: rgba(0, 0, 0, 0.3);
4699
color: #FFFFFF;
4700
}
4701
4702
/**************
4703
* Calculator *
4704
**************/
4705
button.title label {
4706
min-height: 32px;
4707
}
4708
4709
/*********
4710
* Geary *
4711
*********/
4712
.geary-titlebar-left:dir(ltr) {
4713
margin-right: 5px;
4714
padding-right: 0;
4715
}
4716
4717
.geary-titlebar-left:dir(rtl) {
4718
margin-left: 5px;
4719
padding-left: 0;
4720
}
4721
4722
.geary-titlebar-left > separator {
4723
background-color: rgba(0, 0, 0, 0.05);
4724
}
4725
4726
.geary-titlebar-right:dir(ltr) {
4727
margin-left: -5px;
4728
}
4729
4730
.geary-titlebar-right:dir(rtl) {
4731
margin-right: -5px;
4732
}
4733
4734
/*********
4735
* Tilix *
4736
*********/
4737
overlay > revealer.left > scrolledwindow.frame,
4738
overlay > revealer.right > scrolledwindow.frame {
4739
border-style: none;
4740
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22);
4741
}
4742
4743
overlay > revealer.left > scrolledwindow.frame {
4744
margin-right: 32px;
4745
}
4746
4747
overlay > revealer.right > scrolledwindow.frame {
4748
margin-left: 32px;
4749
}
4750
4751
.terminix-session-sidebar,
4752
.tilix-session-sidebar {
4753
background-image: image(#424242);
4754
}
4755
4756
button.image-button.session-new-button {
4757
min-width: 28px;
4758
}
4759
4760
/***********
4761
* Eclipse *
4762
***********/
4763
window.background > box.vertical > scrolledwindow > widget toolbar {
4764
padding: 2px;
4765
}
4766
4767
window.background > box.vertical > scrolledwindow > widget toolbar separator,
4768
window.background > box.vertical > scrolledwindow > widget toolbar button {
4769
margin: 2px;
4770
}
4771
4772
window.background > box.vertical > scrolledwindow > widget toolbar button {
4773
border-radius: 2px;
4774
}
4775
4776
/************
4777
* Chromium *
4778
************/
4779
tooltip.chromium {
4780
background-color: #424242;
4781
}
4782
4783
/***********
4784
* Firefox *
4785
***********/
4786
window.background:not(.csd) > widget > separator {
4787
color: rgba(0, 0, 0, 0.26);
4788
}
4789
4790
window.background:not(.csd) > widget > scrollbar {
4791
background-clip: border-box;
4792
}
4793
4794
window.background:not(.csd) > widget > scrollbar,
4795
window.background:not(.csd) > widget > frame > border {
4796
border-color: rgba(0, 0, 0, 0.26);
4797
}
4798
4799
window.background:not(.csd) > widget > entry,
4800
window.background:not(.csd) > widget > button > button {
4801
border: 1px solid rgba(0, 0, 0, 0.26);
4802
border-radius: 3px;
4803
box-shadow: none;
4804
}
4805
4806
window.background:not(.csd) > widget > entry {
4807
min-height: 30px;
4808
}
4809
4810
window.background:not(.csd) > widget > entry:focus {
4811
border-color: #338DD6;
4812
}
4813
4814
window.background:not(.csd) > widget > button > button {
4815
padding: 4px 8px;
4816
background-size: auto;
4817
}
4818
4819
window.background:not(.csd) > widget > button > button:hover {
4820
background-image: image(alpha(currentColor, 0.05));
4821
}
4822
4823
window.background:not(.csd) > widget > button > button:active {
4824
background-image: image(alpha(currentColor, 0.1));
4825
}
4826
4827
window.background:not(.csd) > widget > checkbutton > check:not(:checked),
4828
window.background:not(.csd) > widget > radiobutton > radio:not(:checked) {
4829
color: #757575;
4830
}
4831
4832
window.background:not(.csd) > widget > checkbutton > check:not(:checked):hover, window.background:not(.csd) > widget > checkbutton > check:not(:checked):active,
4833
window.background:not(.csd) > widget > radiobutton > radio:not(:checked):hover,
4834
window.background:not(.csd) > widget > radiobutton > radio:not(:checked):active {
4835
color: #212121;
4836
}
4837
4838
window.background:not(.csd) > widget > checkbutton > check:not(:checked):disabled,
4839
window.background:not(.csd) > widget > radiobutton > radio:not(:checked):disabled {
4840
color: rgba(117, 117, 117, 0.5);
4841
}
4842
4843
window.background:not(.csd) > window > menu,
4844
window.background:not(.csd) > menu > menu {
4845
border: none;
4846
}
4847
4848
window.background:not(.csd) > widget > menubar {
4849
color: rgba(255, 255, 255, 0.7);
4850
}
4851
4852
window.background:not(.csd) > widget > menubar:hover {
4853
color: #FFFFFF;
4854
}
4855
4856
window.background:not(.csd) > widget > menubar:disabled {
4857
color: rgba(255, 255, 255, 0.3);
4858
}
4859
4860
window.background:not(.csd) > widget > frame {
4861
color: rgba(0, 0, 0, 0.26);
4862
}
4863
4864
window.background:not(.csd) > widget > checkbutton > check,
4865
window.background:not(.csd) > widget > radiobutton > radio {
4866
margin: 0;
4867
padding: 0;
4868
}
4869
4870
window.background:not(.csd) > window.background > menu > separator {
4871
color: rgba(0, 0, 0, 0.26);
4872
}
4873
4874
/************
4875
* Inkscape *
4876
************/
4877
#ToolboxCommon > #AuxToolbox #StyleSwatch {
4878
font-size: smaller;
4879
}
4880
4881
#ToolboxCommon > #AuxToolbox #Kludge {
4882
padding: 0;
4883
}
4884
4885
#ToolboxCommon > #AuxToolbox spinbutton,
4886
#ToolboxCommon > #AuxToolbox entry {
4887
min-height: 32px;
4888
}
4889
4890
#ToolboxCommon > #AuxToolbox button:not(.up):not(.down) {
4891
min-height: 24px;
4892
min-width: 16px;
4893
padding: 4px 8px;
4894
border-radius: 2px;
4895
-gtk-outline-radius: 2px;
4896
}
4897
4898
#ToolboxCommon > #AuxToolbox spinbutton button {
4899
border-width: 4px;
4900
}
4901
4902
#ToolboxCommon > toolbar.vertical {
4903
margin-top: -4px;
4904
}
4905
4906
#ToolboxCommon > toolbar.vertical button {
4907
min-height: 24px;
4908
min-width: 24px;
4909
padding: 4px;
4910
border-radius: 2px;
4911
-gtk-outline-radius: 2px;
4912
}
4913
4914
#CanvasTable button {
4915
min-height: 16px;
4916
min-width: 16px;
4917
padding: 0;
4918
}
4919
4920
#CanvasTable #HorizontalScrollbar {
4921
border-top: 1px solid rgba(0, 0, 0, 0.26);
4922
}
4923
4924
#CanvasTable #VerticalScrollbar:dir(ltr) {
4925
border-left: 1px solid rgba(0, 0, 0, 0.26);
4926
}
4927
4928
#CanvasTable #VerticalScrollbar:dir(rtl) {
4929
border-right: 1px solid rgba(0, 0, 0, 0.26);
4930
}
4931
4932
#Canvas_and_Dock frame > border {
4933
border: none;
4934
}
4935
4936
#Canvas_and_Dock widget > widget > button.flat {
4937
min-height: 16px;
4938
min-width: 16px;
4939
padding: 4px;
4940
}
4941
4942
#Canvas_and_Dock widget > widget > box.horizontal image {
4943
padding: 4px;
4944
}
4945
4946
#Canvas_and_Dock box.horizontal > box.vertical > button.flat {
4947
min-height: 16px;
4948
min-width: 24px;
4949
padding: 8px 4px;
4950
}
4951
4952
/***********
4953
* Synapse *
4954
***********/
4955
box.vertical > widget > widget:selected {
4956
background-color: #338DD6;
4957
}
4958
4959
/*********
4960
* Unity *
4961
*********/
4962
UnityDecoration {
4963
-UnityDecoration-extents: 28px 0 0 0;
4964
-UnityDecoration-input-extents: 8px;
4965
-UnityDecoration-shadow-offset-x: 0;
4966
-UnityDecoration-shadow-offset-y: 3px;
4967
-UnityDecoration-active-shadow-color: rgba(0, 0, 0, 0.48);
4968
-UnityDecoration-active-shadow-radius: 18px;
4969
-UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32);
4970
-UnityDecoration-inactive-shadow-radius: 6px;
4971
-UnityDecoration-glow-size: 8px;
4972
-UnityDecoration-glow-color: #338DD6;
4973
-UnityDecoration-title-indent: 4px;
4974
-UnityDecoration-title-fade: 32px;
4975
-UnityDecoration-title-alignment: 0.0;
4976
}
4977
4978
UnityDecoration .top {
4979
padding: 0 2px;
4980
border-style: none;
4981
border-radius: 2px 2px 0 0;
4982
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
4983
background-color: #303030;
4984
color: #FFFFFF;
4985
}
4986
4987
UnityDecoration .top:backdrop {
4988
color: rgba(255, 255, 255, 0.7);
4989
}
4990
4991
UnityDecoration .menuitem {
4992
color: rgba(255, 255, 255, 0.7);
4993
}
4994
4995
UnityDecoration .menuitem:hover {
4996
box-shadow: inset 0 -2px currentColor;
4997
background-color: transparent;
4998
color: #FFFFFF;
4999
}
5000
5001
.background:not(.csd) headerbar:not(.titlebar) {
5002
border-radius: 0;
5003
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
5004
}
5005
5006
.background:not(.csd) headerbar:not(.titlebar).inline-toolbar {
5007
border-style: none;
5008
}
5009
5010
UnityPanelWidget,
5011
.unity-panel {
5012
background-color: #212121;
5013
color: #FFFFFF;
5014
}
5015
5016
UnityPanelWidget:backdrop,
5017
.unity-panel:backdrop {
5018
color: rgba(255, 255, 255, 0.7);
5019
}
5020
5021
.unity-panel.menuitem,
5022
.unity-panel .menuitem {
5023
color: rgba(255, 255, 255, 0.7);
5024
}
5025
5026
.unity-panel.menubar.menuitem:hover,
5027
.unity-panel.menubar .menuitem *:hover {
5028
box-shadow: inset 0 -2px currentColor;
5029
background-color: transparent;
5030
color: #FFFFFF;
5031
}
5032
5033
.menu IdoPlaybackMenuItem.menuitem:active {
5034
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
5035
animation: spin 1s linear infinite;
5036
color: #338DD6;
5037
}
5038
5039
/**************
5040
* Mate-Panel *
5041
**************/
5042
.mate-panel-menu-bar menubar,
5043
#PanelApplet-window-menu-applet-button {
5044
background-color: transparent;
5045
}
5046
5047
.mate-panel-menu-bar {
5048
background-color: #212121;
5049
font-weight: 500;
5050
}
5051
5052
.mate-panel-menu-bar:not(.popup) {
5053
color: rgba(255, 255, 255, 0.7);
5054
}
5055
5056
.mate-panel-menu-bar button {
5057
min-height: 16px;
5058
min-width: 16px;
5059
padding: 0;
5060
border-radius: 0;
5061
}
5062
5063
.mate-panel-menu-bar button:checked {
5064
background-color: rgba(255, 255, 255, 0.12);
5065
}
5066
5067
PanelToplevel.horizontal > grid > button {
5068
min-width: 24px;
5069
}
5070
5071
PanelToplevel.vertical > grid > button {
5072
min-height: 24px;
5073
}
5074
5075
PanelSeparator {
5076
color: rgba(255, 255, 255, 0.12);
5077
}
5078
5079
MatePanelAppletFrameDBus {
5080
border-style: solid;
5081
border-color: rgba(255, 255, 255, 0.12);
5082
}
5083
5084
.mate-panel-menu-bar.horizontal MatePanelAppletFrameDBus {
5085
border-width: 0 1px;
5086
}
5087
5088
.mate-panel-menu-bar.vertical MatePanelAppletFrameDBus {
5089
border-width: 1px 0;
5090
}
5091
5092
.mate-panel-menu-bar menubar > menuitem {
5093
color: rgba(255, 255, 255, 0.7);
5094
}
5095
5096
.mate-panel-menu-bar menubar > menuitem:hover {
5097
background-color: rgba(255, 255, 255, 0.12);
5098
color: #FFFFFF;
5099
}
5100
5101
.mate-panel-menu-bar menubar > menuitem:disabled {
5102
color: rgba(255, 255, 255, 0.3);
5103
}
5104
5105
.mate-panel-menu-bar.horizontal menubar > menuitem {
5106
padding: 0 8px;
5107
}
5108
5109
.mate-panel-menu-bar.vertical menubar > menuitem {
5110
padding: 8px 0;
5111
}
5112
5113
.mate-panel-menu-bar menubar menu > menuitem {
5114
min-height: 28px;
5115
padding: 0 6px;
5116
}
5117
5118
.mate-panel-menu-bar #PanelApplet button {
5119
-GtkWidget-window-dragging: true;
5120
}
5121
5122
.mate-panel-menu-bar #tasklist-button {
5123
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px;
5124
}
5125
5126
.mate-panel-menu-bar #tasklist-button:checked {
5127
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
5128
}
5129
5130
.mate-panel-menu-bar #tasklist-button image:dir(ltr), .mate-panel-menu-bar #tasklist-button label:dir(rtl) {
5131
padding-left: 4px;
5132
}
5133
5134
.mate-panel-menu-bar #tasklist-button label:dir(ltr), .mate-panel-menu-bar #tasklist-button image:dir(rtl) {
5135
padding-right: 4px;
5136
}
5137
5138
.mate-panel-menu-bar.vertical #tasklist-button {
5139
min-height: 32px;
5140
}
5141
5142
.mate-panel-menu-bar.horizontal #showdesktop-button image {
5143
min-width: 24px;
5144
padding: 0 4px;
5145
}
5146
5147
.mate-panel-menu-bar.vertical #showdesktop-button image {
5148
min-height: 24px;
5149
padding: 4px 0;
5150
}
5151
5152
PanelApplet.wnck-applet .wnck-pager {
5153
background-color: transparent;
5154
color: #40C4FF;
5155
}
5156
5157
PanelApplet.wnck-applet .wnck-pager:hover {
5158
background-color: rgba(255, 255, 255, 0.12);
5159
}
5160
5161
PanelApplet.wnck-applet .wnck-pager:active {
5162
background-color: rgba(255, 255, 255, 0.3);
5163
}
5164
5165
PanelApplet.wnck-applet .wnck-pager:selected {
5166
background-color: #338DD6;
5167
}
5168
5169
.mate-panel-menu-bar.horizontal #clock-applet-button label {
5170
padding: 0 8px;
5171
}
5172
5173
.mate-panel-menu-bar.vertical #clock-applet-button label {
5174
padding: 8px 0;
5175
}
5176
5177
#MatePanelPopupWindow {
5178
border: 1px solid rgba(0, 0, 0, 0.26);
5179
border-radius: 3px;
5180
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
5181
}
5182
5183
#MatePanelPopupWindow frame > border {
5184
border-style: none;
5185
}
5186
5187
#MatePanelPopupWindow button {
5188
padding: 4px 16px;
5189
}
5190
5191
#MatePanelPopupWindow ClockMap {
5192
border: 1px solid rgba(0, 0, 0, 0.26);
5193
}
5194
5195
#MatePanelPopupWindow widget {
5196
color: rgba(0, 0, 0, 0.26);
5197
}
5198
5199
na-tray-applet {
5200
-NaTrayApplet-icon-padding: 3px;
5201
-NaTrayApplet-icon-size: 16;
5202
}
5203
5204
.mate-panel-menu-bar {
5205
-PanelMenuBar-icon-visible: true;
5206
}
5207
5208
.mate-panel-applet-slider {
5209
border: 1px solid rgba(0, 0, 0, 0.26);
5210
border-radius: 3px;
5211
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
5212
background-color: #212121;
5213
}
5214
5215
.mate-panel-applet-slider frame > border {
5216
border-style: none;
5217
}
5218
5219
#PanelApplet:not(:selected) > box {
5220
transition: all 180ms cubic-bezier(0, 0, 0.2, 1);
5221
}
5222
5223
#PanelApplet:selected > box {
5224
background-color: rgba(255, 255, 255, 0.12);
5225
color: #FFFFFF;
5226
}
5227
5228
#mate-menu {
5229
border: 1px solid rgba(0, 0, 0, 0.26);
5230
}
5231
5232
#mate-menu button {
5233
min-height: 24px;
5234
min-width: 24px;
5235
padding: 4px 0;
5236
color: #FFFFFF;
5237
font-weight: normal;
5238
}
5239
5240
#mate-menu button label:not(:first-child) {
5241
color: rgba(255, 255, 255, 0.7);
5242
}
5243
5244
#mate-menu entry {
5245
margin: 0 0 8px;
5246
}
5247
5248
#mate-menu entry image {
5249
margin: 0;
5250
}
5251
5252
#mate-menu entry + button {
5253
margin: 0 4px 8px;
5254
padding: 4px;
5255
}
5256
5257
/*********************
5258
* CAJA File manager *
5259
*********************/
5260
.caja-navigation-window button.toggle.image-button {
5261
border-radius: 2px;
5262
}
5263
5264
.caja-pathbar button {
5265
margin: 0 -1px 0 -2px;
5266
}
5267
5268
.caja-pathbar button > widget {
5269
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
5270
-GtkArrow-arrow-scaling: 1;
5271
}
5272
5273
.caja-side-pane notebook viewport.frame,
5274
.caja-side-pane notebook widget .vertical {
5275
background-color: #303030;
5276
}
5277
5278
.caja-side-pane notebook,
5279
.caja-notebook {
5280
border-top: 1px solid rgba(0, 0, 0, 0.26);
5281
}
5282
5283
.caja-side-pane notebook .frame,
5284
.caja-notebook .frame {
5285
border-style: none;
5286
}
5287
5288
.caja-navigation-window statusbar {
5289
margin: 0 -10px;
5290
padding: 0 4px;
5291
border-top: 1px solid rgba(0, 0, 0, 0.26);
5292
}
5293
5294
.caja-notebook frame > border {
5295
border-style: none;
5296
}
5297
5298
#caja-extra-view-widget {
5299
border-bottom: 1px solid rgba(0, 0, 0, 0.26);
5300
background-color: #212121;
5301
}
5302
5303
#caja-extra-view-widget > box > box > label {
5304
font-weight: bold;
5305
}
5306
5307
/*********
5308
* Pluma *
5309
*********/
5310
.pluma-window statusbar {
5311
margin: 0 -10px;
5312
padding: 0 4px;
5313
border-top: 1px solid rgba(0, 0, 0, 0.26);
5314
}
5315
5316
.pluma-window statusbar frame > border {
5317
border-style: none;
5318
}
5319
5320
.pluma-window statusbar frame button.flat {
5321
padding: 0 4px;
5322
border-radius: 0;
5323
}
5324
5325
.pluma-window statusbar frame button.flat widget {
5326
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
5327
-GtkArrow-arrow-scaling: 1;
5328
}
5329
5330
.pluma-print-preview toolbar {
5331
border-bottom: 1px solid rgba(0, 0, 0, 0.26);
5332
}
5333
5334
.pluma-window paned.horizontal box.vertical box.horizontal button.flat {
5335
margin: 1px;
5336
}
5337
5338
.pluma-window paned.horizontal box.vertical .frame {
5339
border-style: none;
5340
}
5341
5342
.pluma-window paned.horizontal box.vertical notebook.frame {
5343
margin-top: -1px;
5344
border-top: 1px solid rgba(0, 0, 0, 0.26);
5345
}
5346
5347
.pluma-window paned.horizontal box.vertical notebook.frame box.vertical toolbar.horizontal {
5348
border-bottom: 1px solid rgba(0, 0, 0, 0.26);
5349
}
5350
5351
/*********
5352
* Atril *
5353
*********/
5354
.atril-window paned.horizontal box.vertical .frame {
5355
border-style: none;
5356
}
5357
5358
.atril-window paned.horizontal box.vertical notebook .frame {
5359
border-top: 1px solid rgba(0, 0, 0, 0.26);
5360
}
5361
5362
/* mate-screensaver lock dialog */
5363
.lock-dialog {
5364
border-radius: 2px;
5365
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.1);
5366
}
5367
5368
.lock-dialog frame > border {
5369
border-style: none;
5370
}
5371
5372
/******************
5373
* Budgie Desktop *
5374
******************/
5375
.budgie-container {
5376
background-color: transparent;
5377
}
5378
5379
.budgie-settings-window buttonbox.inline-toolbar {
5380
border-style: none none solid;
5381
}
5382
5383
.budgie-settings-window buttonbox.inline-toolbar button {
5384
border-radius: 2px;
5385
-gtk-outline-radius: 2px;
5386
}
5387
5388
.budgie-popover {
5389
border-style: solid;
5390
border-width: 1px;
5391
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3);
5392
border-radius: 3px;
5393
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
5394
background-color: #424242;
5395
}
5396
5397
.budgie-popover .container {
5398
padding: 2px;
5399
}
5400
5401
.budgie-popover border {
5402
border: none;
5403
}
5404
5405
.budgie-popover list {
5406
background-color: transparent;
5407
}
5408
5409
.budgie-popover row {
5410
padding: 0;
5411
}
5412
5413
.budgie-popover row:hover {
5414
box-shadow: none;
5415
}
5416
5417
.budgie-popover:not(.budgie-menu) button.flat:not(.image-button) {
5418
min-height: 28px;
5419
padding: 0 8px;
5420
color: #FFFFFF;
5421
font-weight: normal;
5422
}
5423
5424
.budgie-popover:not(.budgie-menu) button.flat:not(.image-button):disabled {
5425
color: rgba(255, 255, 255, 0.5);
5426
}
5427
5428
.budgie-popover.budgie-menu .container {
5429
padding: 0;
5430
}
5431
5432
.budgie-popover.user-menu .container {
5433
padding: 8px;
5434
}
5435
5436
.budgie-popover.user-menu separator {
5437
margin: 4px 0;
5438
}
5439
5440
.budgie-popover.sound-popover separator {
5441
margin: 3px 0;
5442
}
5443
5444
.budgie-popover.night-light-indicator .container {
5445
padding: 8px;
5446
}
5447
5448
.budgie-popover.places-menu .container {
5449
padding: 8px;
5450
}
5451
5452
.budgie-popover.places-menu .places-list:not(.always-expand) {
5453
margin-top: 4px;
5454
padding-top: 4px;
5455
border-top: 1px solid rgba(0, 0, 0, 0.26);
5456
}
5457
5458
.budgie-popover.places-menu .alternative-label {
5459
padding: 3px;
5460
font-size: 15px;
5461
}
5462
5463
.budgie-popover.workspace-popover .container {
5464
padding: 2px 8px 8px;
5465
}
5466
5467
.budgie-popover.workspace-popover separator {
5468
margin: 4px 0;
5469
}
5470
5471
.budgie-popover.workspace-popover flowboxchild {
5472
padding: 0;
5473
}
5474
5475
.workspace-switcher .workspace-layout {
5476
border: 0 solid rgba(255, 255, 255, 0.12);
5477
}
5478
5479
.top .workspace-switcher .workspace-layout:dir(ltr),
5480
.bottom .workspace-switcher .workspace-layout:dir(ltr) {
5481
border-left-width: 1px;
5482
}
5483
5484
.top .workspace-switcher .workspace-layout:dir(rtl),
5485
.bottom .workspace-switcher .workspace-layout:dir(rtl) {
5486
border-right-width: 1px;
5487
}
5488
5489
.left .workspace-switcher .workspace-layout,
5490
.right .workspace-switcher .workspace-layout {
5491
border-top-width: 1px;
5492
}
5493
5494
.workspace-switcher .workspace-item,
5495
.workspace-switcher .workspace-add-button {
5496
border: 0 solid rgba(255, 255, 255, 0.12);
5497
}
5498
5499
.top .workspace-switcher .workspace-item:dir(ltr),
5500
.bottom .workspace-switcher .workspace-item:dir(ltr), .top
5501
.workspace-switcher .workspace-add-button:dir(ltr),
5502
.bottom
5503
.workspace-switcher .workspace-add-button:dir(ltr) {
5504
border-right-width: 1px;
5505
}
5506
5507
.top .workspace-switcher .workspace-item:dir(rtl),
5508
.bottom .workspace-switcher .workspace-item:dir(rtl), .top
5509
.workspace-switcher .workspace-add-button:dir(rtl),
5510
.bottom
5511
.workspace-switcher .workspace-add-button:dir(rtl) {
5512
border-left-width: 1px;
5513
}
5514
5515
.left .workspace-switcher .workspace-item,
5516
.right .workspace-switcher .workspace-item, .left
5517
.workspace-switcher .workspace-add-button,
5518
.right
5519
.workspace-switcher .workspace-add-button {
5520
border-bottom-width: 1px;
5521
}
5522
5523
.workspace-switcher .workspace-item {
5524
transition: all 180ms cubic-bezier(0, 0, 0.2, 1);
5525
}
5526
5527
.workspace-switcher .workspace-item.current-workspace {
5528
background-color: rgba(255, 255, 255, 0.12);
5529
}
5530
5531
.workspace-switcher .workspace-add-button:hover {
5532
box-shadow: none;
5533
}
5534
5535
.workspace-switcher .workspace-add-button:active {
5536
background-image: none;
5537
}
5538
5539
.workspace-switcher .workspace-add-button:active image {
5540
margin: 1px 0 -1px;
5541
}
5542
5543
.budgie-panel .workspace-switcher .workspace-icon-button {
5544
min-height: 24px;
5545
min-width: 24px;
5546
padding: 0;
5547
border-radius: 2px;
5548
}
5549
5550
.budgie-menu.background {
5551
padding: 0;
5552
background-color: #303030;
5553
}
5554
5555
.budgie-menu scrollbar,
5556
.budgie-menu entry.search {
5557
background-color: transparent;
5558
}
5559
5560
.budgie-menu entry.search {
5561
border-bottom: 1px solid rgba(0, 0, 0, 0.26);
5562
border-radius: 0;
5563
box-shadow: none;
5564
font-size: 120%;
5565
}
5566
5567
.budgie-menu .categories:dir(ltr) {
5568
border-bottom-left-radius: 2px;
5569
}
5570
5571
.budgie-menu .categories:dir(rtl) {
5572
border-bottom-right-radius: 2px;
5573
}
5574
5575
.budgie-menu button {
5576
min-height: 32px;
5577
padding: 0 8px;
5578
border-radius: 0;
5579
color: #FFFFFF;
5580
font-weight: normal;
5581
}
5582
5583
.budgie-menu button:disabled {
5584
color: rgba(255, 255, 255, 0.5);
5585
}
5586
5587
.budgie-menu button:checked:disabled {
5588
background-color: #338DD6;
5589
}
5590
5591
.budgie-menu row {
5592
padding: 0;
5593
}
5594
5595
.budgie-menu row:hover {
5596
box-shadow: none;
5597
}
5598
5599
popover.background.user-menu {
5600
padding: 8px;
5601
}
5602
5603
popover.background.user-menu .content-box {
5604
background-color: transparent;
5605
}
5606
5607
popover.background.user-menu separator {
5608
margin: 4px 0;
5609
}
5610
5611
popover.background.user-menu row {
5612
padding: 0;
5613
box-shadow: none;
5614
background-image: none;
5615
}
5616
5617
popover.background.places-menu {
5618
padding: 8px;
5619
}
5620
5621
popover.background.places-menu .name-button.text-button {
5622
padding-left: 8px;
5623
padding-right: 8px;
5624
}
5625
5626
popover.background.places-menu .name-button.text-button image:dir(ltr) {
5627
margin-right: 3px;
5628
}
5629
5630
popover.background.places-menu .name-button.text-button image:dir(rtl) {
5631
margin-left: 3px;
5632
}
5633
5634
popover.background.places-menu .places-section-header > image:dir(ltr) {
5635
margin: 0 -2px 0 5px;
5636
}
5637
5638
popover.background.places-menu .places-section-header > image:dir(rtl) {
5639
margin: 0 5px 0 -2px;
5640
}
5641
5642
popover.background.places-menu .places-list {
5643
margin-top: 4px;
5644
padding-top: 4px;
5645
border-top: 1px solid rgba(0, 0, 0, 0.26);
5646
background-color: transparent;
5647
}
5648
5649
popover.background.places-menu row {
5650
padding: 0;
5651
box-shadow: none;
5652
background-image: none;
5653
}
5654
5655
.budgie-panel {
5656
transition: background-color 270ms cubic-bezier(0, 0, 0.2, 1);
5657
background-color: #212121;
5658
color: rgba(255, 255, 255, 0.7);
5659
font-weight: 500;
5660
}
5661
5662
.budgie-panel.transparent {
5663
background-color: rgba(0, 0, 0, 0.6);
5664
}
5665
5666
.budgie-panel button {
5667
min-height: 16px;
5668
min-width: 16px;
5669
padding: 0;
5670
border-radius: 0;
5671
}
5672
5673
.budgie-panel button:checked {
5674
background-color: rgba(255, 255, 255, 0.12);
5675
}
5676
5677
.budgie-panel.horizontal button {
5678
padding: 0 4px;
5679
}
5680
5681
.budgie-panel.vertical button {
5682
padding: 4px 0;
5683
}
5684
5685
.budgie-panel separator {
5686
background-color: rgba(255, 255, 255, 0.3);
5687
}
5688
5689
.budgie-panel .alert {
5690
color: #FF5252;
5691
}
5692
5693
.budgie-panel #tasklist-button {
5694
padding: 0 4px;
5695
}
5696
5697
.budgie-panel.vertical #tasklist-button {
5698
min-height: 32px;
5699
}
5700
5701
.budgie-panel button.flat.launcher {
5702
padding: 0;
5703
}
5704
5705
.budgie-panel button.flat.launcher:not(:checked) {
5706
color: rgba(255, 255, 255, 0.5);
5707
}
5708
5709
.budgie-panel button.flat.launcher:not(:checked):hover, .budgie-panel button.flat.launcher:not(:checked):active {
5710
color: rgba(255, 255, 255, 0.7);
5711
}
5712
5713
.budgie-panel button.flat.launcher:not(:checked):disabled {
5714
color: rgba(255, 255, 255, 0.3);
5715
}
5716
5717
.top .budgie-panel #tasklist-button, .budgie-panel .top #tasklist-button, .top .budgie-panel button.flat.launcher, .budgie-panel .top button.flat.launcher {
5718
border-image: radial-gradient(circle closest-corner at center calc(1px), currentColor 0%, transparent 0%) 0 0 0 0/0 0 0 0;
5719
}
5720
5721
.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
5722
.budgie-panel .pinned button.flat.launcher.running,
5723
.budgie-panel .pinned .top button.flat.launcher.running {
5724
border-image: radial-gradient(circle closest-corner at center calc(1px), currentColor 100%, transparent 0%) 2 0 0 0/2px 0 0 0;
5725
}
5726
5727
.bottom .budgie-panel #tasklist-button, .budgie-panel .bottom #tasklist-button, .bottom .budgie-panel button.flat.launcher, .budgie-panel .bottom button.flat.launcher {
5728
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0 0/0 0 0 0;
5729
}
5730
5731
.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
5732
.budgie-panel .pinned button.flat.launcher.running,
5733
.budgie-panel .pinned .bottom button.flat.launcher.running {
5734
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2 0/0 0 2px 0;
5735
}
5736
5737
.left .budgie-panel #tasklist-button, .budgie-panel .left #tasklist-button, .left .budgie-panel button.flat.launcher, .budgie-panel .left button.flat.launcher {
5738
border-image: radial-gradient(circle closest-corner at calc(1px) center, currentColor 0%, transparent 0%) 0 0 0 0/0 0 0 0;
5739
}
5740
5741
.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
5742
.budgie-panel .pinned button.flat.launcher.running,
5743
.budgie-panel .pinned .left button.flat.launcher.running {
5744
border-image: radial-gradient(circle closest-corner at calc(1px) center, currentColor 100%, transparent 0%) 0 0 0 2/0 0 0 2px;
5745
}
5746
5747
.right .budgie-panel #tasklist-button, .budgie-panel .right #tasklist-button, .right .budgie-panel button.flat.launcher, .budgie-panel .right button.flat.launcher {
5748
border-image: radial-gradient(circle closest-corner at calc(100% - 1px) center, currentColor 0%, transparent 0%) 0 0 0 0/0 0 0 0;
5749
}
5750
5751
.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
5752
.budgie-panel .pinned button.flat.launcher.running,
5753
.budgie-panel .pinned .right button.flat.launcher.running {
5754
border-image: radial-gradient(circle closest-corner at calc(100% - 1px) center, currentColor 100%, transparent 0%) 0 2 0 0/0 2px 0 0;
5755
}
5756
5757
frame.raven-frame > border {
5758
border-style: none;
5759
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22);
5760
}
5761
5762
.top frame.raven-frame > border {
5763
margin-bottom: 32px;
5764
}
5765
5766
.bottom frame.raven-frame > border {
5767
margin-top: 32px;
5768
}
5769
5770
.left frame.raven-frame > border {
5771
margin-right: 32px;
5772
}
5773
5774
.right frame.raven-frame > border {
5775
margin-left: 32px;
5776
}
5777
5778
.raven {
5779
background-color: #424242;
5780
}
5781
5782
.raven > box {
5783
margin-bottom: -10px;
5784
}
5785
5786
.raven > stack {
5787
margin-bottom: -10px;
5788
}
5789
5790
.raven stackswitcher.linked > button {
5791
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FFA726 0%, transparent 0%) 0 0 0/0 0 0px;
5792
border-radius: 0;
5793
}
5794
5795
.raven stackswitcher.linked > button:checked {
5796
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FFA726 100%, transparent 0%) 0 0 2/0 0 2px;
5797
background-color: transparent;
5798
}
5799
5800
.raven .raven-header {
5801
min-height: 32px;
5802
padding: 3px;
5803
}
5804
5805
.raven .raven-header:not(.top) {
5806
margin-top: -6px;
5807
}
5808
5809
.raven .raven-header.top {
5810
padding: 2px 0;
5811
background-color: #338DD6;
5812
color: #FFFFFF;
5813
}
5814
5815
.raven .raven-header.top stackswitcher button {
5816
margin: -6px 0;
5817
min-height: 32px;
5818
}
5819
5820
.raven .raven-header.top button.image-button:dir(ltr) {
5821
margin-right: 2px;
5822
}
5823
5824
.raven .raven-header.top button.image-button:dir(rtl) {
5825
margin-left: 2px;
5826
}
5827
5828
.raven .raven-header.top > image {
5829
margin: 0 8px;
5830
}
5831
5832
.raven .raven-header.top > label {
5833
margin: 0 -8px;
5834
font-weight: bold;
5835
}
5836
5837
.raven .raven-header.bottom {
5838
border-top: 1px solid rgba(0, 0, 0, 0.26);
5839
}
5840
5841
.raven viewport.frame .raven-header {
5842
margin-top: -8px;
5843
}
5844
5845
.raven .raven-background {
5846
border-style: solid none;
5847
border-width: 1px;
5848
border-color: rgba(0, 0, 0, 0.26);
5849
background-color: #303030;
5850
}
5851
5852
.raven .raven-background.frame {
5853
border-style: solid none;
5854
}
5855
5856
.raven .raven-background > overlay > widget > image {
5857
color: rgba(255, 255, 255, 0.12);
5858
}
5859
5860
.raven .raven-background grid > label:first-child {
5861
min-height: 32px;
5862
}
5863
5864
.raven scrolledwindow.raven-background {
5865
border-bottom-style: none;
5866
}
5867
5868
.raven .raven-header.top + .raven-background {
5869
border-style: none;
5870
background-color: #338DD6;
5871
color: #FFFFFF;
5872
}
5873
5874
.raven .raven-header.top + .raven-background stackswitcher button {
5875
margin: -4px 0;
5876
}
5877
5878
.raven .powerstrip button {
5879
margin: 2px 0 1px;
5880
padding: 10px;
5881
}
5882
5883
.raven .option-subtitle {
5884
font-size: smaller;
5885
}
5886
5887
calendar.raven-calendar {
5888
border-style: none;
5889
background-color: transparent;
5890
}
5891
5892
calendar.raven-calendar:selected {
5893
border-radius: 2px;
5894
background-color: #338DD6;
5895
}
5896
5897
.raven-mpris {
5898
background-color: rgba(0, 0, 0, 0.6);
5899
color: #FFFFFF;
5900
}
5901
5902
.raven-mpris label {
5903
min-height: 24px;
5904
}
5905
5906
.raven-mpris button.image-button {
5907
padding: 10px;
5908
}
5909
5910
.budgie-notification-window, .budgie-osd-window, .budgie-switcher-window {
5911
background-color: transparent;
5912
}
5913
5914
.budgie-notification .notification-title, .budgie-switcher .notification-title {
5915
font-size: 120%;
5916
}
5917
5918
.budgie-osd .budgie-osd-text {
5919
font-size: 120%;
5920
}
5921
5922
.drop-shadow {
5923
margin: 5px 9px;
5924
padding: 3px;
5925
border-radius: 2px;
5926
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.1);
5927
background-color: #424242;
5928
}
5929
5930
.drop-shadow .linked > button {
5931
border-radius: 2px;
5932
}
5933
5934
.budgie-session-dialog, .budgie-polkit-dialog, .budgie-run-dialog {
5935
border-radius: 2px;
5936
background-color: #424242;
5937
}
5938
5939
.budgie-session-dialog decoration, .budgie-polkit-dialog decoration, .budgie-run-dialog decoration {
5940
border-radius: 2px;
5941
}
5942
5943
.budgie-session-dialog label:not(:last-child),
5944
.budgie-session-dialog .dialog-title {
5945
font-size: 120%;
5946
}
5947
5948
.budgie-session-dialog .linked.horizontal > button {
5949
padding: 8px 16px;
5950
border-top: 1px solid rgba(0, 0, 0, 0.26);
5951
border-radius: 0;
5952
}
5953
5954
.budgie-session-dialog .linked.horizontal > button:first-child {
5955
border-bottom-left-radius: 2px;
5956
}
5957
5958
.budgie-session-dialog .linked.horizontal > button:last-child {
5959
border-bottom-right-radius: 2px;
5960
}
5961
5962
.budgie-polkit-dialog .message {
5963
color: rgba(255, 255, 255, 0.5);
5964
}
5965
5966
.budgie-polkit-dialog .failure {
5967
color: #FF5252;
5968
}
5969
5970
.budgie-run-dialog {
5971
background-color: #303030;
5972
}
5973
5974
.budgie-run-dialog entry.search {
5975
font-size: 120%;
5976
padding: 6px 14px;
5977
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
5978
background-color: transparent;
5979
}
5980
5981
.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
5982
headerbar .subtitle,
5983
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 {
5984
opacity: 1;
5985
}
5986
5987
.budgie-run-dialog scrolledwindow {
5988
border-top: 1px solid rgba(0, 0, 0, 0.26);
5989
}
5990
5991
/************************
5992
* LightDM GTK+ Greeter *
5993
************************/
5994
#panel_window {
5995
background-color: rgba(0, 0, 0, 0.3);
5996
color: #FFFFFF;
5997
}
5998
5999
#panel_window menubar,
6000
#panel_window separator {
6001
background-color: transparent;
6002
}
6003
6004
#panel_window separator {
6005
padding: 0 4px;
6006
}
6007
6008
#panel_window separator:first-child {
6009
padding: 0 8px;
6010
}
6011
6012
#panel_window menubar > menuitem {
6013
color: rgba(255, 255, 255, 0.7);
6014
}
6015
6016
#panel_window menubar > menuitem:hover {
6017
color: #FFFFFF;
6018
}
6019
6020
#panel_window menubar > menuitem:disabled label {
6021
color: rgba(255, 255, 255, 0.3);
6022
}
6023
6024
#login_window,
6025
#shutdown_dialog,
6026
#restart_dialog {
6027
margin: 8px;
6028
border-radius: 2px;
6029
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.1);
6030
background-color: #424242;
6031
}
6032
6033
#content_frame {
6034
padding-bottom: 20px;
6035
border-bottom: 1px solid rgba(0, 0, 0, 0.26);
6036
}
6037
6038
#buttonbox_frame {
6039
padding-top: 24px;
6040
}
6041
6042
#buttonbox_frame button {
6043
margin: -16px;
6044
}
6045
6046
#greeter_infobar {
6047
margin-top: -1px;
6048
}
6049
6050
/* GTK NAMED COLORS
6051
----------------
6052
use responsibly! */
6053
/*
6054
widget text/foreground color */
6055
@define-color theme_fg_color #FFFFFF;
6056
/*
6057
text color for entries, views and content in general */
6058
@define-color theme_text_color #FFFFFF;
6059
/*
6060
widget base background color */
6061
@define-color theme_bg_color #212121;
6062
/*
6063
text widgets and the like base background color */
6064
@define-color theme_base_color #303030;
6065
/*
6066
base background color of selections */
6067
@define-color theme_selected_bg_color #338DD6;
6068
/*
6069
text/foreground color of selections */
6070
@define-color theme_selected_fg_color #FFFFFF;
6071
/*
6072
base background color of insensitive widgets */
6073
@define-color insensitive_bg_color #212121;
6074
/*
6075
text foreground color of insensitive widgets */
6076
@define-color insensitive_fg_color rgba(255, 255, 255, 0.5);
6077
/*
6078
insensitive text widgets and the like base background color */
6079
@define-color insensitive_base_color #292929;
6080
/*
6081
widget text/foreground color on backdrop windows */
6082
@define-color theme_unfocused_fg_color #FFFFFF;
6083
/*
6084
text color for entries, views and content in general on backdrop windows */
6085
@define-color theme_unfocused_text_color #FFFFFF;
6086
/*
6087
widget base background color on backdrop windows */
6088
@define-color theme_unfocused_bg_color #212121;
6089
/*
6090
text widgets and the like base background color on backdrop windows */
6091
@define-color theme_unfocused_base_color #303030;
6092
/*
6093
base background color of selections on backdrop windows */
6094
@define-color theme_unfocused_selected_bg_color #338DD6;
6095
/*
6096
text/foreground color of selections on backdrop windows */
6097
@define-color theme_unfocused_selected_fg_color #FFFFFF;
6098
/*
6099
insensitive color on backdrop windows */
6100
@define-color unfocused_insensitive_color rgba(255, 255, 255, 0.5);
6101
/*
6102
widgets main borders color */
6103
@define-color borders rgba(0, 0, 0, 0.26);
6104
/*
6105
widgets main borders color on backdrop windows */
6106
@define-color unfocused_borders rgba(0, 0, 0, 0.26);
6107
/*
6108
these are pretty self explicative */
6109
@define-color warning_color #FF6D00;
6110
@define-color error_color #DD2C00;
6111
@define-color success_color #00C853;
6112
/*
6113
FIXME this is really an API */
6114
@define-color content_view_bg #303030;
6115
@define-color placeholder_text_color #c1c1c1;
6116