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

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