A fork of the Materia GTK theme.

Important information: Google announced that, from September 2026, Android devices will require ALL apps to be signed by Google, effectively leading to an iOS situation. Value your right to a computer that does what you want; do not tolerate this monopolistic practice! Contact me if you don't understand why it is bad. Click to learn more.

 gtk-dark-compact.css

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