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