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