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