ASCII text, with very long lines (417)
1
@keyframes ripple_effect {
2
to {
3
background-size: 1000% 1000%;
4
}
5
}
6
@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
* {
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
switch:focus slider,
35
notebook:focus tab,
36
*:focus {
37
outline-color: alpha(currentColor, 0.3);
38
}
39
/***************
41
* Base States *
42
***************/
43
.background {
44
background-color: #44545c;
45
color: #FFFFFF;
46
}
47
/*
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
.gtkstyle-fallback {
59
background-color: #44545c;
60
color: #FFFFFF;
61
}
62
.gtkstyle-fallback:hover {
64
background-color: #39474d;
65
color: #FFFFFF;
66
}
67
.gtkstyle-fallback:active {
69
background-color: #2e393f;
70
color: #FFFFFF;
71
}
72
.gtkstyle-fallback:disabled {
74
background-color: #44545c;
75
color: rgba(255, 255, 255, 0.4);
76
}
77
.gtkstyle-fallback:selected {
79
background-color: #42A5F5;
80
color: #FFFFFF;
81
}
82
.view {
84
background-color: #50636c;
85
color: #FFFFFF;
86
}
87
.view:disabled {
89
color: rgba(255, 255, 255, 0.4);
90
}
91
textview text {
93
background-color: #50636c;
94
}
95
textview border {
97
background-color: #4a5c64;
98
}
99
iconview, .nautilus-canvas-item, .caja-canvas-item {
101
border-radius: 2px;
102
}
103
.rubberband,
105
rubberband,
106
flowbox rubberband,
107
treeview.view rubberband,
108
.content-view rubberband,
109
.content-view .rubberband {
110
border: 1px solid #40C4FF;
111
background-color: rgba(64, 196, 255, 0.3);
112
}
113
flowbox flowboxchild {
115
padding: 4px;
116
border-radius: 2px;
117
}
118
.content-view .tile:selected {
120
background-color: transparent;
121
color: inherit;
122
}
123
label {
125
caret-color: currentColor;
126
}
127
label.separator {
129
color: #FFFFFF;
130
}
131
label selection {
133
background-color: #42A5F5;
134
color: #FFFFFF;
135
}
136
label:disabled {
138
color: rgba(255, 255, 255, 0.4);
139
}
140
tab label:disabled,
142
button label:disabled {
143
color: inherit;
144
}
145
.dim-label, label.separator, .titlebar:not(headerbar) .subtitle,
147
headerbar .subtitle {
148
opacity: 0.6;
149
}
150
assistant .sidebar {
152
padding: 4px 0;
153
}
154
assistant .sidebar label {
156
min-height: 36px;
157
padding: 0 12px;
158
color: rgba(255, 255, 255, 0.6);
159
font-weight: 500;
160
}
161
assistant .sidebar label.highlight {
163
color: #FFFFFF;
164
}
165
popover.background.touch-selection, popover.background.magnifier, popover.background.osd, .app-notification, .osd .scale-popup, .nautilus-window .floating-bar, .osd {
167
opacity: 0.9;
168
}
169
/*********************
171
* Spinner Animation *
172
*********************/
173
@keyframes spin {
174
to {
175
-gtk-icon-transform: rotate(1turn);
176
}
177
}
178
@keyframes spin_colors {
180
1% {
181
color: #66BB6A;
182
}
183
25% {
184
color: #66BB6A;
185
}
186
26% {
187
color: #42A5F5;
188
}
189
50% {
190
color: #42A5F5;
191
}
192
51% {
193
color: #FFA726;
194
}
195
75% {
196
color: #FFA726;
197
}
198
76% {
199
color: #EF5350;
200
}
201
100% {
202
color: #EF5350;
203
}
204
}
205
spinner {
207
background: none;
208
opacity: 0;
209
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
210
}
211
spinner:checked {
213
opacity: 1;
214
animation: spin 1s linear infinite, spin_colors 4s linear infinite;
215
}
216
spinner:checked:disabled {
218
opacity: 0.4;
219
}
220
/****************
222
* Text Entries *
223
****************/
224
spinbutton:not(.vertical),
225
entry {
226
min-height: 36px;
227
padding: 0 8px;
228
border-radius: 2px;
229
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
230
border-image: none;
231
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
232
background-color: #50636c;
233
color: #FFFFFF;
234
}
235
spinbutton:focus:not(.vertical),
237
entry:focus {
238
border-image: none;
239
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
240
}
241
spinbutton:disabled:not(.vertical),
243
entry:disabled {
244
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
245
background-color: #4a5c64;
246
color: rgba(255, 255, 255, 0.4);
247
}
248
spinbutton.flat:not(.vertical), notebook > stack:not(:only-child) entry:not(.search),
250
notebook > stack:not(:only-child) spinbutton:not(.vertical), colorchooser .popover.osd spinbutton:not(.vertical), entry.preferences-search, layoutpane entry.search, editortweak entry.search, #login_window entry,
251
entry.flat {
252
border-radius: 0;
253
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
254
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
255
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
256
background-color: transparent;
257
color: #FFFFFF;
258
}
259
spinbutton.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry:focus:not(.search),
261
notebook > stack:not(:only-child) spinbutton:focus:not(.vertical), colorchooser .popover.osd spinbutton:focus:not(.vertical), entry.preferences-search:focus, layoutpane entry.search:focus, editortweak entry.search:focus, #login_window entry:focus,
262
entry.flat:focus {
263
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
264
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
265
}
266
spinbutton.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry:disabled:not(.search),
268
notebook > stack:not(:only-child) spinbutton:disabled:not(.vertical), colorchooser .popover.osd spinbutton:disabled:not(.vertical), entry.preferences-search:disabled, layoutpane entry.search:disabled, editortweak entry.search:disabled, #login_window entry:disabled,
269
entry.flat:disabled {
270
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
271
background-color: transparent;
272
color: rgba(255, 255, 255, 0.4);
273
}
274
spinbutton:not(.vertical) image,
276
entry image {
277
color: alpha(currentColor, 0.75);
278
}
279
spinbutton:not(.vertical) image:hover, spinbutton:not(.vertical) image:active,
281
entry image:hover,
282
entry image:active {
283
color: currentColor;
284
}
285
spinbutton:not(.vertical) image:disabled,
287
entry image:disabled {
288
color: alpha(currentColor, 0.6);
289
}
290
spinbutton:not(.vertical) image.left,
292
entry image.left {
293
margin-left: 2px;
294
margin-right: 6px;
295
}
296
spinbutton:not(.vertical) image.right,
298
entry image.right {
299
margin-left: 6px;
300
margin-right: 2px;
301
}
302
spinbutton:not(.vertical) undershoot.left,
304
entry undershoot.left {
305
background-color: transparent;
306
background-image: linear-gradient(to top, rgba(80, 99, 108, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
307
padding-left: 1px;
308
background-size: 1px 12px;
309
background-repeat: repeat-y;
310
background-origin: content-box;
311
background-position: left top;
312
}
313
spinbutton:not(.vertical) undershoot.right,
315
entry undershoot.right {
316
background-color: transparent;
317
background-image: linear-gradient(to top, rgba(80, 99, 108, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
318
padding-right: 1px;
319
background-size: 1px 12px;
320
background-repeat: repeat-y;
321
background-origin: content-box;
322
background-position: right top;
323
}
324
spinbutton.error:not(.vertical),
326
entry.error {
327
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
328
border-image: none;
329
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
330
background-color: #DD2C00;
331
color: #FFFFFF;
332
}
333
spinbutton.error:focus:not(.vertical),
335
entry.error:focus {
336
border-image: none;
337
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
338
}
339
spinbutton.error:disabled:not(.vertical),
341
entry.error:disabled {
342
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
343
background-color: #4a5c64;
344
color: rgba(255, 255, 255, 0.4);
345
}
346
spinbutton.error.flat:not(.vertical), notebook > stack:not(:only-child) entry.error:not(.search),
348
notebook > stack:not(:only-child) spinbutton.error:not(.vertical), colorchooser .popover.osd spinbutton.error:not(.vertical), entry.error.preferences-search, layoutpane entry.error.search, editortweak entry.error.search, #login_window entry.error,
349
entry.error.flat {
350
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
351
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #DD2C00 0%, transparent 0%) 0 0 0/0 0 0px;
352
box-shadow: inset 0 -1px #DD2C00;
353
background-color: transparent;
354
color: #FFFFFF;
355
}
356
spinbutton.error.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry.error:focus:not(.search),
358
notebook > stack:not(:only-child) spinbutton.error:focus:not(.vertical), colorchooser .popover.osd spinbutton.error:focus:not(.vertical), entry.error.preferences-search:focus, layoutpane entry.error.search:focus, editortweak entry.error.search:focus, #login_window entry.error:focus,
359
entry.error.flat:focus {
360
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #DD2C00 100%, transparent 0%) 0 0 2/0 0 2px;
361
box-shadow: inset 0 -1px #DD2C00;
362
}
363
spinbutton.error.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry.error:disabled:not(.search),
365
notebook > stack:not(:only-child) spinbutton.error:disabled:not(.vertical), colorchooser .popover.osd spinbutton.error:disabled:not(.vertical), entry.error.preferences-search:disabled, layoutpane entry.error.search:disabled, editortweak entry.error.search:disabled, #login_window entry.error:disabled,
366
entry.error.flat:disabled {
367
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
368
background-color: transparent;
369
color: rgba(255, 255, 255, 0.4);
370
}
371
spinbutton.warning:not(.vertical),
373
entry.warning {
374
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
375
border-image: none;
376
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
377
background-color: #FF6D00;
378
color: #FFFFFF;
379
}
380
spinbutton.warning:focus:not(.vertical),
382
entry.warning:focus {
383
border-image: none;
384
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
385
}
386
spinbutton.warning:disabled:not(.vertical),
388
entry.warning:disabled {
389
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
390
background-color: #4a5c64;
391
color: rgba(255, 255, 255, 0.4);
392
}
393
spinbutton.warning.flat:not(.vertical), notebook > stack:not(:only-child) entry.warning:not(.search),
395
notebook > stack:not(:only-child) spinbutton.warning:not(.vertical), colorchooser .popover.osd spinbutton.warning:not(.vertical), entry.warning.preferences-search, layoutpane entry.warning.search, editortweak entry.warning.search, #login_window entry.warning,
396
entry.warning.flat {
397
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
398
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FF6D00 0%, transparent 0%) 0 0 0/0 0 0px;
399
box-shadow: inset 0 -1px #FF6D00;
400
background-color: transparent;
401
color: #FFFFFF;
402
}
403
spinbutton.warning.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry.warning:focus:not(.search),
405
notebook > stack:not(:only-child) spinbutton.warning:focus:not(.vertical), colorchooser .popover.osd spinbutton.warning:focus:not(.vertical), entry.warning.preferences-search:focus, layoutpane entry.warning.search:focus, editortweak entry.warning.search:focus, #login_window entry.warning:focus,
406
entry.warning.flat:focus {
407
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FF6D00 100%, transparent 0%) 0 0 2/0 0 2px;
408
box-shadow: inset 0 -1px #FF6D00;
409
}
410
spinbutton.warning.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry.warning:disabled:not(.search),
412
notebook > stack:not(:only-child) spinbutton.warning:disabled:not(.vertical), colorchooser .popover.osd spinbutton.warning:disabled:not(.vertical), entry.warning.preferences-search:disabled, layoutpane entry.warning.search:disabled, editortweak entry.warning.search:disabled, #login_window entry.warning:disabled,
413
entry.warning.flat:disabled {
414
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
415
background-color: transparent;
416
color: rgba(255, 255, 255, 0.4);
417
}
418
spinbutton:not(.vertical) progress,
420
entry progress {
421
margin: 2px -6px;
422
border-bottom: 2px solid #42A5F5;
423
background-color: transparent;
424
}
425
.linked:not(.vertical) > spinbutton.flat:not(.vertical), notebook > stack:not(:only-child) .linked:not(.vertical) > entry:not(.search),
427
notebook > stack:not(:only-child) .linked:not(.vertical) > spinbutton:not(.vertical), colorchooser .popover.osd .linked:not(.vertical) > spinbutton:not(.vertical), .linked:not(.vertical) > entry.preferences-search, layoutpane .linked:not(.vertical) > entry.search, editortweak .linked:not(.vertical) > entry.search, #login_window .linked:not(.vertical) > entry,
428
.linked.vertical > spinbutton.flat:not(.vertical), notebook > stack:not(:only-child)
429
.linked.vertical > entry:not(.search),
430
notebook > stack:not(:only-child)
431
.linked.vertical > spinbutton:not(.vertical), colorchooser .popover.osd
432
.linked.vertical > spinbutton:not(.vertical),
433
.linked.vertical > entry.preferences-search, layoutpane
434
.linked.vertical > entry.search, editortweak
435
.linked.vertical > entry.search, #login_window
436
.linked.vertical > entry, .linked:not(.vertical) >
437
entry.flat,
438
.linked.vertical >
439
entry.flat {
440
border-radius: 0;
441
}
442
treeview entry.flat, treeview entry {
444
min-height: 0;
445
padding: 2px;
446
border-radius: 0;
447
background-color: #50636c;
448
}
449
treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:focus {
451
border-image: none;
452
box-shadow: none;
453
}
454
/***********
456
* Buttons *
457
***********/
458
@keyframes needs_attention {
459
from {
460
background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent));
461
}
462
to {
463
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#FF4081), to(transparent));
464
}
465
}
466
button {
469
min-height: 24px;
470
min-width: 16px;
471
padding: 6px 10px;
472
border-radius: 2px;
473
font-weight: 500;
474
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);
475
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;
476
background-color: #596e79;
477
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
478
background-repeat: no-repeat;
479
background-position: center;
480
background-size: 1000% 1000%;
481
color: rgba(255, 255, 255, 0.75);
482
}
483
button:hover {
486
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;
487
color: #FFFFFF;
488
}
489
button:active {
492
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
493
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
494
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);
495
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
496
background-size: 0% 0%;
497
color: #FFFFFF;
498
}
499
button:disabled {
502
box-shadow: none;
503
background-color: alpha(currentColor, 0.3);
504
color: rgba(255, 255, 255, 0.3);
505
}
506
button:checked {
509
background-color: #42A5F5;
510
color: #FFFFFF;
511
}
512
button:checked:disabled {
515
background-color: alpha(currentColor, 0.3);
516
color: rgba(66, 165, 245, 0.4);
517
}
518
modelbutton.flat,
520
.menuitem.button.flat, spinbutton:not(.vertical) button, spinbutton.vertical button, popover.background.menu button,
521
popover.background button.model, notebook > header > tabs > arrow, scrollbar button, check,
522
radio, calendar.button, messagedialog.csd .dialog-action-area button, button.sidebar-button, .gedit-search-slider button, popover.messagepopover .popover-action-area button, PanelToplevel > widget > button, .lightdm-gtk-greeter button, :not(headerbar) .caja-pathbar button, .caja-pathbar :not(headerbar) button, :not(headerbar)
523
.path-bar button, layouttabbar button, .mate-panel-menu-bar #PanelApplet button:not(.flat), toolbar button, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
524
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,
525
button.flat {
526
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);
527
box-shadow: inset 0 0 0 9999px transparent;
528
background-color: transparent;
529
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
530
background-repeat: no-repeat;
531
background-position: center;
532
background-size: 1000% 1000%;
533
color: alpha(currentColor, 0.75);
534
}
535
modelbutton.flat:hover,
537
.menuitem.button.flat:hover, spinbutton:not(.vertical) button:hover, spinbutton.vertical button:hover, popover.background.menu button:hover,
538
popover.background button.model:hover, notebook > header > tabs > arrow:hover, scrollbar button:hover, check:hover,
539
radio:hover, calendar.button:hover, messagedialog.csd .dialog-action-area button:hover, button.sidebar-button:hover, .gedit-search-slider button:hover, popover.messagepopover .popover-action-area button:hover, PanelToplevel > widget > button:hover, .lightdm-gtk-greeter button:hover, :not(headerbar) .caja-pathbar button:hover, .caja-pathbar :not(headerbar) button:hover, :not(headerbar)
540
.path-bar button:hover, layouttabbar button:hover, .mate-panel-menu-bar #PanelApplet button:hover:not(.flat), toolbar button:hover, .titlebar:not(headerbar) button:hover:not(.suggested-action):not(.destructive-action),
541
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,
542
button.flat:hover {
543
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
544
color: currentColor;
545
}
546
modelbutton.flat:active,
548
.menuitem.button.flat:active, spinbutton:not(.vertical) button:active, spinbutton.vertical button:active, popover.background.menu button:active,
549
popover.background button.model:active, notebook > header > tabs > arrow:active, scrollbar button:active, check:active,
550
radio:active, calendar.button:active, messagedialog.csd .dialog-action-area button:active, button.sidebar-button:active, .gedit-search-slider button:active, popover.messagepopover .popover-action-area button:active, PanelToplevel > widget > button:active, .lightdm-gtk-greeter button:active, :not(headerbar) .caja-pathbar button:active, .caja-pathbar :not(headerbar) button:active, :not(headerbar)
551
.path-bar button:active, layouttabbar button:active, .mate-panel-menu-bar #PanelApplet button:active:not(.flat), toolbar button:active, .titlebar:not(headerbar) button:active:not(.suggested-action):not(.destructive-action),
552
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,
553
button.flat:active {
554
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
555
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
556
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
557
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
558
background-size: 0% 0%;
559
color: currentColor;
560
}
561
modelbutton.flat:disabled,
563
.menuitem.button.flat:disabled, spinbutton:not(.vertical) button:disabled, spinbutton.vertical button:disabled, popover.background.menu button:disabled,
564
popover.background button.model:disabled, notebook > header > tabs > arrow:disabled, scrollbar button:disabled, check:disabled,
565
radio:disabled, calendar.button:disabled, messagedialog.csd .dialog-action-area button:disabled, button.sidebar-button:disabled, .gedit-search-slider button:disabled, popover.messagepopover .popover-action-area button:disabled, PanelToplevel > widget > button:disabled, .lightdm-gtk-greeter button:disabled, :not(headerbar) .caja-pathbar button:disabled, .caja-pathbar :not(headerbar) button:disabled, :not(headerbar)
566
.path-bar button:disabled, layouttabbar button:disabled, .mate-panel-menu-bar #PanelApplet button:disabled:not(.flat), toolbar button:disabled, .titlebar:not(headerbar) button:disabled:not(.suggested-action):not(.destructive-action),
567
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,
568
button.flat:disabled {
569
box-shadow: none;
570
background-color: transparent;
571
color: alpha(currentColor, 0.3);
572
}
573
:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar)
575
.path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar #PanelApplet button:checked:not(.flat), toolbar button:checked, .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action),
576
headerbar button:checked:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked,
577
button.flat:checked {
578
background-color: alpha(currentColor, 0.3);
579
color: currentColor;
580
}
581
:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar)
583
.path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar #PanelApplet button:checked:disabled:not(.flat), toolbar button:checked:disabled, .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action),
584
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,
585
button.flat:checked:disabled {
586
background-color: alpha(currentColor, 0.3);
587
color: alpha(currentColor, 0.4);
588
}
589
button.text-button {
592
padding-left: 16px;
593
padding-right: 16px;
594
}
595
button.image-button {
598
min-width: 24px;
599
padding: 6px;
600
}
601
button.text-button.image-button label:first-child {
604
margin-left: 10px;
605
}
606
button.text-button.image-button label:last-child {
609
margin-right: 10px;
610
}
611
button.text-button.image-button image:not(:only-child) {
614
margin: 0 4px;
615
}
616
toolbar .linked > button, .titlebar:not(headerbar) .linked > button:not(.suggested-action):not(.destructive-action),
618
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
619
.linked.vertical > button, .titlebar:not(headerbar)
620
.linked.vertical > button:not(.suggested-action):not(.destructive-action),
621
headerbar
622
.linked.vertical > button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box
623
.linked.vertical > button:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification
624
.linked.vertical > button, .linked >
625
button.flat,
626
.linked.vertical >
627
button.flat {
628
border-radius: 2px;
629
}
630
infobar.info button:disabled, infobar.question button:disabled, infobar.warning button:disabled, infobar.error button:disabled, row:selected
632
button:disabled {
633
color: rgba(255, 255, 255, 0.3);
634
}
635
button.osd {
638
padding: 12px 16px;
639
}
640
button.osd.image-button {
643
padding: 12px;
644
}
645
button.osd:disabled {
648
opacity: 0;
649
}
650
button.suggested-action {
653
background-color: #FF4081;
654
color: #FFFFFF;
655
}
656
button.suggested-action:disabled {
659
box-shadow: none;
660
background-color: alpha(currentColor, 0.3);
661
color: rgba(255, 255, 255, 0.4);
662
}
663
button.suggested-action:checked {
666
background-color: #ff79a7;
667
}
668
button.suggested-action.flat {
671
background-color: transparent;
672
color: #FF4081;
673
}
674
button.suggested-action.flat:disabled {
677
box-shadow: none;
678
background-color: transparent;
679
color: alpha(currentColor, 0.4);
680
}
681
button.suggested-action.flat:checked {
684
background-color: alpha(currentColor, 0.3);
685
}
686
button.destructive-action {
689
background-color: #FF5252;
690
color: #FFFFFF;
691
}
692
button.destructive-action:disabled {
695
box-shadow: none;
696
background-color: alpha(currentColor, 0.3);
697
color: rgba(255, 255, 255, 0.4);
698
}
699
button.destructive-action:checked {
702
background-color: #ff8686;
703
}
704
button.destructive-action.flat {
707
background-color: transparent;
708
color: #FF5252;
709
}
710
button.destructive-action.flat:disabled {
713
box-shadow: none;
714
background-color: transparent;
715
color: alpha(currentColor, 0.4);
716
}
717
button.destructive-action.flat:checked {
720
background-color: alpha(currentColor, 0.3);
721
}
722
.stack-switcher >
724
button {
725
outline-offset: -4px;
726
}
727
.stack-switcher >
729
button > label {
730
padding-left: 6px;
731
padding-right: 6px;
732
}
733
.stack-switcher >
735
button > image {
736
padding-left: 6px;
737
padding-right: 6px;
738
padding-top: 3px;
739
padding-bottom: 3px;
740
}
741
.stack-switcher >
743
button.text-button {
744
padding-left: 10px;
745
padding-right: 10px;
746
}
747
.stack-switcher >
749
button.image-button {
750
padding-left: 4px;
751
padding-right: 4px;
752
}
753
.stack-switcher >
755
button.needs-attention:checked > label,
756
.stack-switcher >
757
button.needs-attention:checked > image {
758
animation: none;
759
background-image: none;
760
}
761
button separator {
764
min-width: 0;
765
min-height: 0;
766
background-color: transparent;
767
}
768
.primary-toolbar
770
button {
771
-gtk-icon-shadow: none;
772
}
773
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),
776
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
777
.linked.vertical > button.image-button:not(.text-button),
778
headerbar
779
.linked.vertical > button.image-button:not(.text-button):not(.suggested-action):not(.destructive-action), .app-notification
780
.linked.vertical > button.image-button:not(.text-button), .linked > button.flat.image-button:not(.text-button),
781
.linked.vertical > button.flat.image-button:not(.text-button), .inline-toolbar button:not(.text-button), check,
782
radio, button.titlebutton, .nautilus-window headerbar > revealer > button,
783
button.close,
784
button.circular {
785
border-radius: 9999px;
786
-gtk-outline-radius: 9999px;
787
}
788
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 {
790
min-height: 24px;
791
min-width: 24px;
792
padding: 0;
793
border-radius: 9999px;
794
-gtk-outline-radius: 9999px;
795
}
796
.stack-switcher >
798
button.needs-attention > label,
799
.stack-switcher >
800
button.needs-attention > image, stacksidebar row.needs-attention > label {
801
animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
802
background-repeat: no-repeat;
803
background-position: right 3px;
804
background-size: 6px 6px;
805
}
806
.stack-switcher >
808
button.needs-attention > label:dir(rtl),
809
.stack-switcher >
810
button.needs-attention > image:dir(rtl), stacksidebar row.needs-attention > label:dir(rtl) {
811
background-position: left 3px;
812
}
813
.linked:not(.vertical) > combobox:not(:only-child) > box > button.combo, .linked:not(.vertical) > spinbutton:not(:only-child):not(.vertical), .linked:not(.vertical) > entry:not(:only-child), .linked > button:not(:only-child) {
815
border-radius: 0;
816
-gtk-outline-radius: 2px;
817
}
818
.linked:not(.vertical) > combobox:not(:only-child):first-child > box > button.combo, .linked:not(.vertical) > spinbutton:not(:only-child):first-child:not(.vertical), .linked:not(.vertical) > entry:not(:only-child):first-child, .linked > button:not(:only-child):first-child, combobox.linked button:not(:only-child):nth-child(2):dir(rtl) {
820
border-radius: 2px 0 0 2px;
821
}
822
.linked:not(.vertical) > combobox:not(:only-child):last-child > box > button.combo, .linked:not(.vertical) > spinbutton:not(:only-child):last-child:not(.vertical), .linked:not(.vertical) > entry:not(:only-child):last-child, .linked > button:not(:only-child):last-child, combobox.linked button:not(:only-child):nth-child(2):dir(ltr) {
824
border-radius: 0 2px 2px 0;
825
}
826
.linked.vertical > combobox:not(:only-child) > box > button.combo, .linked.vertical > spinbutton:not(:only-child):not(.vertical), .linked.vertical > entry:not(:only-child), .linked.vertical > button:not(:only-child) {
828
border-radius: 0;
829
-gtk-outline-radius: 2px;
830
}
831
.linked.vertical > combobox:not(:only-child):first-child > box > button.combo, .linked.vertical > spinbutton:not(:only-child):first-child:not(.vertical), .linked.vertical > entry:not(:only-child):first-child, .linked.vertical > button:not(:only-child):first-child {
833
border-radius: 2px 2px 0 0;
834
}
835
.linked.vertical > combobox:not(:only-child):last-child > box > button.combo, .linked.vertical > spinbutton:not(:only-child):last-child:not(.vertical), .linked.vertical > entry:not(:only-child):last-child, .linked.vertical > button:not(:only-child):last-child {
837
border-radius: 0 0 2px 2px;
838
}
839
/* menu buttons */
841
modelbutton.flat,
842
.menuitem.button.flat {
843
min-height: 28px;
844
padding: 0 8px;
845
border-radius: 2px;
846
color: inherit;
847
}
848
modelbutton.flat check,
850
modelbutton.flat radio,
851
.menuitem.button.flat check,
852
.menuitem.button.flat radio {
853
box-shadow: none;
854
background-image: none;
855
}
856
modelbutton.flat check:not(:checked):not(:indeterminate),
858
modelbutton.flat radio:not(:checked):not(:indeterminate),
859
.menuitem.button.flat check:not(:checked):not(:indeterminate),
860
.menuitem.button.flat radio:not(:checked):not(:indeterminate) {
861
color: alpha(currentColor, 0.6);
862
}
863
modelbutton.flat check:last-child,
865
modelbutton.flat radio:last-child,
866
.menuitem.button.flat check:last-child,
867
.menuitem.button.flat radio:last-child {
868
margin-left: -8px;
869
margin-right: -16px;
870
}
871
modelbutton.flat check:first-child,
873
modelbutton.flat radio:first-child,
874
.menuitem.button.flat check:first-child,
875
.menuitem.button.flat radio:first-child {
876
margin-left: -16px;
877
margin-right: -8px;
878
}
879
modelbutton.flat arrow {
881
background: none;
882
}
883
modelbutton.flat arrow:hover {
885
background: none;
886
}
887
modelbutton.flat arrow.left {
889
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
890
}
891
modelbutton.flat arrow.right {
893
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
894
}
895
button.color {
897
min-height: 24px;
898
min-width: 24px;
899
padding: 6px;
900
}
901
/*********
903
* Links *
904
*********/
905
*:link, button:link,
906
button:visited, *:link:hover, button:hover:link,
907
button:hover:visited, *:link:active, button:active:link,
908
button:active:visited {
909
color: #42A5F5;
910
}
911
*:link:visited,
913
button:visited, *:link:visited:hover,
914
button:visited:hover, *:link:visited:active,
915
button:visited:active {
916
color: #E040FB;
917
}
918
infobar.info *:link, infobar.info button:link, infobar.info
920
button:visited, infobar.question *:link, infobar.question button:link, infobar.question
921
button:visited, infobar.warning *:link, infobar.warning button:link, infobar.warning
922
button:visited, infobar.error *:link, infobar.error button:link, infobar.error
923
button:visited, *:link:selected, button:selected:link,
924
button:selected:visited, .selection-mode.titlebar:not(headerbar) .subtitle:link,
925
headerbar.selection-mode .subtitle:link,
926
*:selected *:link,
927
*:selected button:link,
928
*:selected
929
button:visited {
930
color: #FFFFFF;
931
}
932
button:link > label,
934
button:visited > label {
935
text-decoration-line: underline;
936
}
937
/*****************
939
* GtkSpinButton *
940
*****************/
941
spinbutton:not(.vertical) {
942
padding: 0;
943
}
944
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,
946
spinbutton:not(.vertical) entry {
947
min-width: 32px;
948
margin: 0;
949
border-image: none;
950
border-radius: 0;
951
box-shadow: none;
952
background-color: transparent;
953
}
954
spinbutton:not(.vertical) button {
956
border: solid 6px transparent;
957
}
958
spinbutton:not(.vertical) button.up:dir(ltr), spinbutton:not(.vertical) button.down:dir(rtl) {
960
margin-left: -3px;
961
}
962
spinbutton:not(.vertical) button.up:dir(rtl), spinbutton:not(.vertical) button.down:dir(ltr) {
964
margin-right: -3px;
965
}
966
spinbutton.vertical:disabled {
968
color: rgba(255, 255, 255, 0.4);
969
}
970
spinbutton.vertical:drop(active) {
972
box-shadow: none;
973
}
974
spinbutton.vertical entry {
976
min-height: 36px;
977
min-width: 48px;
978
padding: 0;
979
}
980
spinbutton.vertical button {
982
min-height: 36px;
983
min-width: 48px;
984
padding: 0;
985
}
986
spinbutton.vertical button.up {
988
border-radius: 2px 2px 0 0;
989
}
990
spinbutton.vertical button.down {
992
border-radius: 0 0 2px 2px;
993
}
994
treeview spinbutton:not(.vertical) {
996
min-height: 0;
997
border-style: none;
998
border-radius: 0;
999
}
1000
treeview spinbutton:not(.vertical) entry {
1002
min-height: 0;
1003
padding: 1px 2px;
1004
}
1005
/**************
1007
* ComboBoxes *
1008
**************/
1009
combobox arrow {
1010
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1011
min-height: 16px;
1012
min-width: 16px;
1013
}
1014
combobox decoration,
1016
combobox button.combo:checked {
1017
transition: none;
1018
}
1019
combobox button.combo cellview:dir(ltr) {
1021
margin-left: -2px;
1022
}
1023
combobox button.combo cellview:dir(rtl) {
1025
margin-right: -2px;
1026
}
1027
combobox #gtk-combobox-popup-menu {
1029
padding: 2px 0;
1030
}
1031
combobox #gtk-combobox-popup-menu menuitem {
1033
min-height: 32px;
1034
padding: 0 8px;
1035
}
1036
combobox:drop(active) {
1038
box-shadow: none;
1039
}
1040
notebook > stack:not(:only-child) button.combo, #login_window #user_combobox button {
1042
border-radius: 0;
1043
background-image: none;
1044
font-weight: inherit;
1045
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1046
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1047
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
1048
background-color: transparent;
1049
color: #FFFFFF;
1050
}
1051
notebook > stack:not(:only-child) button.combo:hover, #login_window #user_combobox button:hover {
1053
box-shadow: inset 0 -2px alpha(currentColor, 0.3);
1054
}
1055
notebook > stack:not(:only-child) button.combo:checked, #login_window #user_combobox button:checked {
1057
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1058
}
1059
notebook > stack:not(:only-child) button.combo:disabled, #login_window #user_combobox button:disabled {
1061
color: rgba(255, 255, 255, 0.4);
1062
}
1063
/************
1065
* Toolbars *
1066
************/
1067
toolbar {
1068
-GtkWidget-window-dragging: true;
1069
padding: 3px;
1070
background-color: #44545c;
1071
}
1072
.osd toolbar {
1074
background-color: transparent;
1075
}
1076
toolbar.osd, .app-notification, frame.documents-dropdown {
1078
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1079
padding: 6px;
1080
border-radius: 2px;
1081
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);
1082
background-color: #50636c;
1083
}
1084
toolbar.osd:backdrop, .app-notification:backdrop, frame.documents-dropdown:backdrop {
1086
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);
1087
}
1088
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 {
1090
border-radius: 0;
1091
}
1092
toolbar.horizontal separator {
1094
margin: 3px;
1095
}
1096
toolbar.vertical separator {
1098
margin: 3px;
1099
}
1100
toolbar:not(.inline-toolbar):not(.osd) scale,
1102
toolbar:not(.inline-toolbar):not(.osd) entry,
1103
toolbar:not(.inline-toolbar):not(.osd) spinbutton,
1104
toolbar:not(.inline-toolbar):not(.osd) button {
1105
margin: 3px;
1106
}
1107
toolbar:not(.inline-toolbar):not(.osd) .linked entry:not(:first-child),
1109
toolbar:not(.inline-toolbar):not(.osd) .linked spinbutton:not(:first-child),
1110
toolbar:not(.inline-toolbar):not(.osd) .linked button:not(:first-child) {
1111
margin-left: 0;
1112
}
1113
toolbar:not(.inline-toolbar):not(.osd) .linked entry:not(:last-child),
1115
toolbar:not(.inline-toolbar):not(.osd) .linked spinbutton:not(:last-child),
1116
toolbar:not(.inline-toolbar):not(.osd) .linked button:not(:last-child) {
1117
margin-right: 0;
1118
}
1119
toolbar:not(.inline-toolbar):not(.osd) switch {
1121
margin: 9px 3px;
1122
}
1123
.inline-toolbar {
1125
padding: 6px;
1126
border-style: solid;
1127
border-width: 0 1px 1px;
1128
border-color: rgba(0, 0, 0, 0.2);
1129
background-color: #4a5c64;
1130
}
1131
searchbar,
1133
.location-bar {
1134
padding: 6px;
1135
border-style: solid;
1136
border-width: 0 0 1px;
1137
border-color: rgba(0, 0, 0, 0.2);
1138
background-color: #44545c;
1139
background-clip: border-box;
1140
}
1141
/***************
1143
* Header bars *
1144
***************/
1145
.titlebar:not(headerbar),
1146
headerbar {
1147
transition: background-color 0.2s cubic-bezier(0, 0, 0.2, 1);
1148
min-height: 48px;
1149
padding: 0 6px;
1150
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);
1151
background-color: #37474F;
1152
color: #FFFFFF;
1153
}
1154
.titlebar:disabled:not(headerbar) :not(button) > label,
1156
headerbar:disabled :not(button) > label {
1157
color: rgba(255, 255, 255, 0.4);
1158
}
1159
.titlebar:backdrop:not(headerbar),
1161
headerbar:backdrop {
1162
color: rgba(255, 255, 255, 0.75);
1163
}
1164
.titlebar:backdrop:disabled:not(headerbar) :not(button) > label,
1166
headerbar:backdrop:disabled :not(button) > label {
1167
color: rgba(255, 255, 255, 0.3);
1168
}
1169
.titlebar:not(headerbar) .title,
1171
headerbar .title {
1172
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1173
padding: 0 12px;
1174
font-weight: bold;
1175
}
1176
.titlebar:not(headerbar) .subtitle,
1178
headerbar .subtitle {
1179
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1180
padding: 0 12px;
1181
font-size: smaller;
1182
}
1183
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
1185
headerbar button:not(.suggested-action):not(.destructive-action) {
1186
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px;
1187
}
1188
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1190
headerbar button:not(.suggested-action):not(.destructive-action):checked {
1191
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
1192
}
1193
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1195
headerbar button:not(.suggested-action):not(.destructive-action):checked,
1196
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled {
1197
background-color: transparent;
1198
}
1199
.titlebar:not(headerbar) button.suggested-action:disabled, .titlebar:not(headerbar) button.destructive-action:disabled,
1201
headerbar button.suggested-action:disabled,
1202
headerbar button.destructive-action:disabled {
1203
color: alpha(currentColor, 0.4);
1204
}
1205
.selection-mode.titlebar:not(headerbar),
1207
headerbar.selection-mode {
1208
transition: background-color 0.00001s 0.3s;
1209
animation: header_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1);
1210
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2);
1211
background-color: #42A5F5;
1212
color: #FFFFFF;
1213
}
1214
.selection-mode.titlebar:backdrop:not(headerbar),
1216
headerbar.selection-mode:backdrop {
1217
color: rgba(255, 255, 255, 0.75);
1218
}
1219
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
1221
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action) {
1222
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px;
1223
color: currentColor;
1224
}
1225
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled,
1227
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled {
1228
color: alpha(currentColor, 0.4);
1229
}
1230
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1232
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked {
1233
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
1234
color: currentColor;
1235
}
1236
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1238
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled {
1239
color: alpha(currentColor, 0.4);
1240
}
1241
.selection-mode.titlebar:not(headerbar) .selection-menu,
1243
headerbar.selection-mode .selection-menu {
1244
padding-left: 16px;
1245
padding-right: 16px;
1246
}
1247
.selection-mode.titlebar:not(headerbar) .selection-menu GtkArrow,
1249
headerbar.selection-mode .selection-menu GtkArrow {
1250
-GtkArrow-arrow-scaling: 1;
1251
}
1252
.selection-mode.titlebar:not(headerbar) .selection-menu .arrow,
1254
headerbar.selection-mode .selection-menu .arrow {
1255
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1256
}
1257
.fullscreen .titlebar:not(headerbar),
1259
.tiled .titlebar:not(headerbar),
1260
.maximized .titlebar:not(headerbar), .fullscreen
1261
headerbar,
1262
.tiled
1263
headerbar,
1264
.maximized
1265
headerbar {
1266
border-radius: 0;
1267
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1268
}
1269
.default-decoration.titlebar:not(headerbar),
1271
headerbar.default-decoration {
1272
min-height: 24px;
1273
padding: 6px;
1274
box-shadow: inset 0 1px rgba(255, 255, 255, 0.15);
1275
}
1276
.fullscreen .default-decoration.titlebar:not(headerbar),
1278
.tiled .default-decoration.titlebar:not(headerbar),
1279
.maximized .default-decoration.titlebar:not(headerbar), .fullscreen
1280
headerbar.default-decoration,
1281
.tiled
1282
headerbar.default-decoration,
1283
.maximized
1284
headerbar.default-decoration {
1285
box-shadow: none;
1286
}
1287
.default-decoration.titlebar:not(headerbar) button.titlebutton,
1289
headerbar.default-decoration button.titlebutton {
1290
min-height: 24px;
1291
min-width: 24px;
1292
margin: 0;
1293
padding: 0;
1294
}
1295
.background:not(.csd) .default-decoration.titlebar:not(headerbar) button.titlebutton:active, .background:not(.csd)
1297
headerbar.default-decoration button.titlebutton:active {
1298
background-size: 1000% 1000%;
1299
}
1300
headerbar entry,
1302
headerbar spinbutton,
1303
headerbar button {
1304
margin-top: 6px;
1305
margin-bottom: 6px;
1306
}
1307
headerbar switch {
1309
margin-top: 12px;
1310
margin-bottom: 12px;
1311
}
1312
headerbar spinbutton button {
1314
margin-top: 0;
1315
margin-bottom: 0;
1316
}
1317
.background:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) .titlebar {
1319
border-top-left-radius: 2px;
1320
border-top-right-radius: 2px;
1321
}
1322
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) separator:first-child + headerbar,
1324
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) headerbar:first-child {
1325
border-top-left-radius: 2px;
1326
}
1327
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) headerbar:last-child {
1329
border-top-right-radius: 2px;
1330
}
1331
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 {
1333
border-top-left-radius: 2px;
1334
border-top-right-radius: 2px;
1335
}
1336
window.csd > .titlebar:not(headerbar) {
1338
padding: 0;
1339
background-color: transparent;
1340
background-image: none;
1341
border-style: none;
1342
box-shadow: none;
1343
}
1344
.titlebar:not(headerbar) > separator {
1346
background-color: #37474F;
1347
background-image: image(rgba(0, 0, 0, 0.2));
1348
}
1349
/************
1351
* Pathbars *
1352
************/
1353
.caja-pathbar button,
1354
.path-bar button {
1355
padding-left: 6px;
1356
padding-right: 6px;
1357
}
1358
.caja-pathbar button label:not(:only-child):first-child,
1360
.path-bar button label:not(:only-child):first-child {
1361
margin-left: 4px;
1362
}
1363
.caja-pathbar button label:not(:only-child):last-child,
1365
.path-bar button label:not(:only-child):last-child {
1366
margin-right: 4px;
1367
}
1368
.caja-pathbar button.slider-button,
1370
.path-bar button.slider-button {
1371
padding-left: 4px;
1372
padding-right: 4px;
1373
}
1374
:not(headerbar) .caja-pathbar button, .caja-pathbar :not(headerbar) button, :not(headerbar)
1376
.path-bar button {
1377
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1378
border-radius: 2px;
1379
}
1380
:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar)
1382
.path-bar button:checked {
1383
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1384
}
1385
: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)
1387
.path-bar button:checked, :not(headerbar)
1388
.path-bar button:checked:disabled {
1389
background-color: transparent;
1390
}
1391
/**************
1393
* Tree Views *
1394
**************/
1395
treeview.view {
1396
border-left-color: alpha(currentColor, 0.3);
1397
border-top-color: rgba(0, 0, 0, 0.2);
1398
}
1399
* {
1401
-GtkTreeView-horizontal-separator: 4;
1402
-GtkTreeView-grid-line-width: 1;
1403
-GtkTreeView-grid-line-pattern: '';
1404
-GtkTreeView-tree-line-width: 1;
1405
-GtkTreeView-tree-line-pattern: '';
1406
-GtkTreeView-expander-size: 16;
1407
}
1408
treeview.view.separator {
1410
min-height: 5px;
1411
color: rgba(0, 0, 0, 0.2);
1412
}
1413
treeview.view:drop(active) {
1415
border-style: solid none;
1416
border-width: 1px;
1417
border-color: #FF4081;
1418
}
1419
treeview.view:drop(active).after {
1421
border-top-style: none;
1422
}
1423
treeview.view:drop(active).before {
1425
border-bottom-style: none;
1426
}
1427
treeview.view.expander {
1429
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1430
-gtk-icon-transform: rotate(-90deg);
1431
color: rgba(255, 255, 255, 0.75);
1432
}
1433
treeview.view.expander:dir(rtl) {
1435
-gtk-icon-transform: rotate(90deg);
1436
}
1437
treeview.view.expander:checked {
1439
-gtk-icon-transform: unset;
1440
}
1441
treeview.view.expander:hover, treeview.view.expander:active {
1443
color: #FFFFFF;
1444
}
1445
treeview.view.expander:disabled {
1447
color: rgba(255, 255, 255, 0.3);
1448
}
1449
treeview.view.expander:selected {
1451
color: rgba(255, 255, 255, 0.75);
1452
}
1453
treeview.view.expander:selected:hover, treeview.view.expander:selected:active {
1455
color: #FFFFFF;
1456
}
1457
treeview.view.expander:selected:disabled {
1459
color: rgba(255, 255, 255, 0.3);
1460
}
1461
treeview.view.progressbar {
1463
border-bottom: 4px solid #42A5F5;
1464
box-shadow: none;
1465
background-color: transparent;
1466
}
1467
treeview.view.progressbar:selected {
1469
border-bottom-color: currentColor;
1470
}
1471
treeview.view.trough {
1473
border-bottom: 4px solid rgba(66, 165, 245, 0.3);
1474
box-shadow: none;
1475
background-color: transparent;
1476
}
1477
treeview.view.trough:selected {
1479
border-bottom-color: alpha(currentColor, 0.3);
1480
}
1481
treeview.view header button {
1483
padding: 2px 6px;
1484
border-style: none solid solid none;
1485
border-width: 1px;
1486
border-color: rgba(0, 0, 0, 0.2);
1487
border-radius: 0;
1488
background-clip: border-box;
1489
}
1490
treeview.view header button, treeview.view header button:hover, treeview.view header button:active {
1492
box-shadow: none;
1493
}
1494
treeview.view header button, treeview.view header button:disabled {
1496
background-color: #50636c;
1497
}
1498
treeview.view header button:last-child {
1500
border-right-style: none;
1501
}
1502
treeview.view button.dnd,
1504
treeview.view header.button.dnd {
1505
padding: 2px 6px;
1506
border-style: none solid solid;
1507
border-width: 1px;
1508
border-color: rgba(0, 0, 0, 0.2);
1509
border-radius: 0;
1510
box-shadow: none;
1511
background-color: #50636c;
1512
background-clip: border-box;
1513
color: #42A5F5;
1514
}
1515
treeview.view acceleditor > label {
1517
background-color: #42A5F5;
1518
}
1519
/*********
1521
* Menus *
1522
*********/
1523
menubar,
1524
.menubar {
1525
-GtkWidget-window-dragging: true;
1526
padding: 0;
1527
background-color: #37474F;
1528
}
1529
menubar > menuitem,
1531
.menubar > menuitem {
1532
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
1533
min-height: 20px;
1534
padding: 4px 8px;
1535
color: rgba(255, 255, 255, 0.75);
1536
}
1537
menubar > menuitem:hover,
1539
.menubar > menuitem:hover {
1540
transition: none;
1541
background-color: alpha(currentColor, 0.15);
1542
color: #FFFFFF;
1543
}
1544
menubar > menuitem:disabled,
1546
.menubar > menuitem:disabled {
1547
color: rgba(255, 255, 255, 0.3);
1548
}
1549
.csd.popup {
1551
border-radius: 2px;
1552
}
1553
menu,
1555
.menu,
1556
.context-menu {
1557
margin: 4px 0;
1558
padding: 4px 0;
1559
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
1560
background-color: #50636c;
1561
border: 1px solid rgba(0, 0, 0, 0.2);
1562
}
1563
.csd menu, .csd
1565
.menu, .csd
1566
.context-menu {
1567
border: none;
1568
border-radius: 2px;
1569
}
1570
menu menuitem,
1572
.menu menuitem,
1573
.context-menu menuitem {
1574
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
1575
min-height: 20px;
1576
min-width: 40px;
1577
padding: 4px 8px;
1578
font: initial;
1579
text-shadow: none;
1580
}
1581
menu menuitem:hover,
1583
.menu menuitem:hover,
1584
.context-menu menuitem:hover {
1585
transition: none;
1586
background-color: alpha(currentColor, 0.15);
1587
}
1588
menu menuitem:disabled,
1590
.menu menuitem:disabled,
1591
.context-menu menuitem:disabled {
1592
color: rgba(255, 255, 255, 0.4);
1593
}
1594
menu menuitem arrow,
1596
.menu menuitem arrow,
1597
.context-menu menuitem arrow {
1598
min-height: 16px;
1599
min-width: 16px;
1600
}
1601
menu menuitem arrow:dir(ltr),
1603
.menu menuitem arrow:dir(ltr),
1604
.context-menu menuitem arrow:dir(ltr) {
1605
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1606
margin-left: 8px;
1607
}
1608
menu menuitem arrow:dir(rtl),
1610
.menu menuitem arrow:dir(rtl),
1611
.context-menu menuitem arrow:dir(rtl) {
1612
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl");
1613
margin-right: 8px;
1614
}
1615
menu menuitem label:dir(rtl), menu menuitem label:dir(ltr),
1617
.menu menuitem label:dir(rtl),
1618
.menu menuitem label:dir(ltr),
1619
.context-menu menuitem label:dir(rtl),
1620
.context-menu menuitem label:dir(ltr) {
1621
color: inherit;
1622
}
1623
menu > arrow,
1625
.menu > arrow,
1626
.context-menu > arrow {
1627
min-height: 16px;
1628
min-width: 16px;
1629
padding: 4px;
1630
border-radius: 0;
1631
background-color: #50636c;
1632
color: rgba(255, 255, 255, 0.75);
1633
}
1634
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
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
1641
}
1642
menu > arrow.bottom,
1644
.menu > arrow.bottom,
1645
.context-menu > arrow.bottom {
1646
margin-bottom: -4px;
1647
border-top: 1px solid rgba(0, 0, 0, 0.2);
1648
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1649
}
1650
menu > arrow:hover,
1652
.menu > arrow:hover,
1653
.context-menu > arrow:hover {
1654
background-image: image(alpha(currentColor, 0.15));
1655
color: #FFFFFF;
1656
}
1657
menu > arrow:disabled,
1659
.menu > arrow:disabled,
1660
.context-menu > arrow:disabled {
1661
border-color: transparent;
1662
background-color: transparent;
1663
color: transparent;
1664
}
1665
menu separator,
1667
.menu separator,
1668
.context-menu separator {
1669
margin: 4px 0;
1670
}
1671
menuitem accelerator {
1673
color: alpha(currentColor, 0.6);
1674
}
1675
menuitem check:dir(ltr),
1677
menuitem radio:dir(ltr) {
1678
margin-right: -8px;
1679
margin-left: -16px;
1680
}
1681
menuitem check:dir(rtl),
1683
menuitem radio:dir(rtl) {
1684
margin-right: -16px;
1685
margin-left: -8px;
1686
}
1687
.popup:not(.csd) menu menuitem {
1689
color: #FFFFFF;
1690
}
1691
.popup:not(.csd) menu menuitem:hover {
1693
background-color: #6a7a82;
1694
}
1695
.popup:not(.csd) menu menuitem:disabled {
1697
color: #96a1a7;
1698
}
1699
.popup:not(.csd) menu accelerator {
1701
color: #b9c1c4;
1702
}
1703
/************
1705
* Popovers *
1706
************/
1707
popover.background {
1708
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1709
padding: 2px;
1710
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
1711
background-color: #596e79;
1712
}
1713
popover.background:backdrop {
1715
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1716
}
1717
popover.background, .csd popover.background {
1719
border-style: solid;
1720
border-width: 1px;
1721
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3);
1722
border-radius: 3px;
1723
}
1724
popover.background > stack {
1726
margin: -4px;
1727
}
1728
popover.background > toolbar {
1730
margin: -2px;
1731
}
1732
popover.background > list,
1734
popover.background > .view,
1735
popover.background > toolbar {
1736
border-style: none;
1737
box-shadow: none;
1738
background-color: transparent;
1739
}
1740
popover.background.menu button,
1742
popover.background button.model {
1743
min-height: 32px;
1744
padding: 0 8px;
1745
border-radius: 2px;
1746
}
1747
popover.background separator {
1749
margin: 4px 0;
1750
}
1751
popover.background list separator {
1753
margin: 0;
1754
}
1755
/*************
1757
* Notebooks *
1758
*************/
1759
notebook > header {
1760
border-width: 1px;
1761
border-color: rgba(0, 0, 0, 0.2);
1762
background-color: #44545c;
1763
background-clip: border-box;
1764
}
1765
notebook > header.top {
1767
border-bottom-style: solid;
1768
}
1769
notebook > header.top > tabs {
1771
margin-bottom: -1px;
1772
}
1773
notebook > header.top > tabs > tab:hover {
1775
box-shadow: inset 0 -2px alpha(currentColor, 0.3);
1776
}
1777
notebook > header.top > tabs > tab:checked {
1779
box-shadow: inset 0 -2px #42A5F5;
1780
}
1781
notebook > header.bottom {
1783
border-top-style: solid;
1784
}
1785
notebook > header.bottom > tabs {
1787
margin-top: -1px;
1788
}
1789
notebook > header.bottom > tabs > tab:hover {
1791
box-shadow: inset 0 2px alpha(currentColor, 0.3);
1792
}
1793
notebook > header.bottom > tabs > tab:checked {
1795
box-shadow: inset 0 2px #42A5F5;
1796
}
1797
notebook > header.left {
1799
border-right-style: solid;
1800
}
1801
notebook > header.left > tabs {
1803
margin-right: -1px;
1804
}
1805
notebook > header.left > tabs > tab:hover {
1807
box-shadow: inset -2px 0 alpha(currentColor, 0.3);
1808
}
1809
notebook > header.left > tabs > tab:checked {
1811
box-shadow: inset -2px 0 #42A5F5;
1812
}
1813
notebook > header.right {
1815
border-left-style: solid;
1816
}
1817
notebook > header.right > tabs {
1819
margin-left: -1px;
1820
}
1821
notebook > header.right > tabs > tab:hover {
1823
box-shadow: inset 2px 0 alpha(currentColor, 0.3);
1824
}
1825
notebook > header.right > tabs > tab:checked {
1827
box-shadow: inset 2px 0 #42A5F5;
1828
}
1829
notebook > header.top > tabs > arrow {
1831
border-top-style: none;
1832
}
1833
notebook > header.bottom > tabs > arrow {
1835
border-bottom-style: none;
1836
}
1837
notebook > header.top > tabs > arrow, notebook > header.bottom > tabs > arrow {
1839
padding-left: 4px;
1840
padding-right: 4px;
1841
}
1842
notebook > header.top > tabs > arrow.down, notebook > header.bottom > tabs > arrow.down {
1844
margin-left: -8px;
1845
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
1846
}
1847
notebook > header.top > tabs > arrow.up, notebook > header.bottom > tabs > arrow.up {
1849
margin-right: -8px;
1850
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1851
}
1852
notebook > header.left > tabs > arrow {
1854
border-left-style: none;
1855
}
1856
notebook > header.right > tabs > arrow {
1858
border-right-style: none;
1859
}
1860
notebook > header.left > tabs > arrow, notebook > header.right > tabs > arrow {
1862
padding-top: 4px;
1863
padding-bottom: 4px;
1864
}
1865
notebook > header.left > tabs > arrow.down, notebook > header.right > tabs > arrow.down {
1867
margin-top: -8px;
1868
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
1869
}
1870
notebook > header.left > tabs > arrow.up, notebook > header.right > tabs > arrow.up {
1872
margin-bottom: -8px;
1873
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1874
}
1875
notebook > header > tabs > arrow {
1877
min-height: 16px;
1878
min-width: 16px;
1879
border-radius: 0;
1880
}
1881
notebook > header tab {
1883
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
1884
min-height: 24px;
1885
min-width: 24px;
1886
padding: 6px 12px;
1887
outline-offset: -6px;
1888
border-width: 1px;
1889
border-color: transparent;
1890
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 10%, transparent 0%);
1891
background-repeat: no-repeat;
1892
background-position: center;
1893
background-size: 0% 0%;
1894
color: rgba(255, 255, 255, 0.75);
1895
font-weight: 500;
1896
}
1897
notebook > header tab:hover {
1899
color: #FFFFFF;
1900
}
1901
notebook > header tab:hover.reorderable-page {
1903
border-color: rgba(0, 0, 0, 0.2);
1904
background-color: #4a5c64;
1905
}
1906
notebook > header tab:disabled {
1908
color: rgba(255, 255, 255, 0.3);
1909
}
1910
notebook > header tab:checked {
1912
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);
1913
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
1914
background-size: 1000% 1000%;
1915
color: #FFFFFF;
1916
}
1917
notebook > header tab:checked:disabled {
1919
color: rgba(255, 255, 255, 0.4);
1920
}
1921
notebook > header tab:checked.reorderable-page {
1923
border-color: rgba(0, 0, 0, 0.2);
1924
background-color: #50636c;
1925
}
1926
notebook > header tab button.flat:last-child {
1928
margin-left: 6px;
1929
margin-right: -6px;
1930
}
1931
notebook > header tab button.flat:first-child {
1933
margin-left: -6px;
1934
margin-right: 6px;
1935
}
1936
notebook > header.top tabs, notebook > header.bottom tabs {
1938
padding-left: 8px;
1939
padding-right: 8px;
1940
}
1941
notebook > header.top tabs:not(:only-child):first-child, notebook > header.bottom tabs:not(:only-child):first-child {
1943
margin-left: 0;
1944
}
1945
notebook > header.top tabs:not(:only-child):last-child, notebook > header.bottom tabs:not(:only-child):last-child {
1947
margin-right: 0;
1948
}
1949
notebook > header.top tabs tab.reorderable-page, notebook > header.bottom tabs tab.reorderable-page {
1951
margin: 0 -1px;
1952
border-style: none solid;
1953
}
1954
notebook > header.left tabs, notebook > header.right tabs {
1956
padding-top: 8px;
1957
padding-bottom: 8px;
1958
}
1959
notebook > header.left tabs:not(:only-child):first-child, notebook > header.right tabs:not(:only-child):first-child {
1961
margin-top: 0;
1962
}
1963
notebook > header.left tabs:not(:only-child):last-child, notebook > header.right tabs:not(:only-child):last-child {
1965
margin-bottom: 0;
1966
}
1967
notebook > header.left tabs tab.reorderable-page, notebook > header.right tabs tab.reorderable-page {
1969
margin: -1px 0;
1970
border-style: solid none;
1971
}
1972
notebook > stack:not(:only-child) {
1974
background-color: #50636c;
1975
}
1976
/**************
1978
* Scrollbars *
1979
**************/
1980
scrollbar {
1981
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1982
background-color: #50636c;
1983
background-clip: border-box;
1984
}
1985
* {
1987
-GtkScrollbar-has-backward-stepper: false;
1988
-GtkScrollbar-has-forward-stepper: false;
1989
}
1990
scrollbar.top {
1992
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
1993
}
1994
scrollbar.bottom {
1996
border-top: 1px solid rgba(0, 0, 0, 0.2);
1997
}
1998
scrollbar.left {
2000
border-right: 1px solid rgba(0, 0, 0, 0.2);
2001
}
2002
scrollbar.right {
2004
border-left: 1px solid rgba(0, 0, 0, 0.2);
2005
}
2006
scrollbar slider {
2008
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0;
2009
min-width: 8px;
2010
min-height: 8px;
2011
border: 4px solid transparent;
2012
border-radius: 9999px;
2013
background-clip: padding-box;
2014
background-color: rgba(255, 255, 255, 0.6);
2015
}
2016
scrollbar slider:hover {
2018
background-color: rgba(255, 255, 255, 0.75);
2019
}
2020
scrollbar slider:active {
2022
background-color: #FFFFFF;
2023
}
2024
scrollbar slider:disabled {
2026
background-color: rgba(255, 255, 255, 0.24);
2027
}
2028
scrollbar.fine-tune slider {
2030
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0, min-width 0, min-height 0;
2031
min-width: 4px;
2032
min-height: 4px;
2033
}
2034
scrollbar.fine-tune.horizontal slider {
2036
margin: 2px 0;
2037
}
2038
scrollbar.fine-tune.vertical slider {
2040
margin: 0 2px;
2041
}
2042
scrollbar.overlay-indicator:not(.dragging):not(.hovering) {
2044
border-color: transparent;
2045
background-color: transparent;
2046
}
2047
scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider {
2049
min-width: 4px;
2050
min-height: 4px;
2051
margin: 3px;
2052
border: 1px solid rgba(80, 99, 108, 0.3);
2053
}
2054
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button {
2056
min-width: 4px;
2057
min-height: 4px;
2058
margin: 3px;
2059
border: 1px solid rgba(80, 99, 108, 0.3);
2060
border-radius: 9999px;
2061
background-color: rgba(255, 255, 255, 0.6);
2062
background-clip: padding-box;
2063
-gtk-icon-source: none;
2064
}
2065
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled {
2067
background-color: rgba(255, 255, 255, 0.24);
2068
}
2069
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider {
2071
min-width: 24px;
2072
}
2073
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal button {
2075
min-width: 8px;
2076
}
2077
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider {
2079
min-height: 24px;
2080
}
2081
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button {
2083
min-height: 8px;
2084
}
2085
scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering {
2087
background-color: rgba(80, 99, 108, 0.9);
2088
}
2089
scrollbar.horizontal slider {
2091
min-width: 24px;
2092
}
2093
scrollbar.vertical slider {
2095
min-height: 24px;
2096
}
2097
scrollbar button {
2099
min-width: 16px;
2100
min-height: 16px;
2101
padding: 0;
2102
border-radius: 0;
2103
}
2104
scrollbar.vertical button.down {
2106
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
2107
}
2108
scrollbar.vertical button.up {
2110
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
2111
}
2112
scrollbar.horizontal button.down {
2114
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
2115
}
2116
scrollbar.horizontal button.up {
2118
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
2119
}
2120
/**********
2122
* Switch *
2123
**********/
2124
switch {
2125
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2126
margin: 6px 0;
2127
border: 4px solid transparent;
2128
border-radius: 9999px;
2129
background-color: alpha(currentColor, 0.3);
2130
background-clip: padding-box;
2131
font-size: 0;
2132
}
2133
switch:disabled {
2135
color: alpha(currentColor, 0.4);
2136
}
2137
switch:checked {
2139
background-color: rgba(255, 64, 129, 0.5);
2140
}
2141
switch:checked:disabled {
2143
background-color: rgba(255, 64, 129, 0.2);
2144
color: rgba(255, 255, 255, 0.4);
2145
}
2146
switch slider {
2148
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
2149
border-image: none;
2150
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2151
background-color: #50636c;
2152
color: #FFFFFF;
2153
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0;
2154
min-width: 24px;
2155
min-height: 24px;
2156
margin: -4px 0 -4px -4px;
2157
border-radius: 9999px;
2158
-gtk-outline-radius: 9999px;
2159
}
2160
switch:hover slider {
2162
border-image: none;
2163
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2164
}
2165
switch:checked slider {
2167
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;
2168
animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1);
2169
margin: -4px -4px -4px 0;
2170
background-color: #FF4081;
2171
color: #FFFFFF;
2172
}
2173
switch:disabled slider {
2175
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2176
background-color: #4a5c64;
2177
color: rgba(255, 255, 255, 0.4);
2178
}
2179
switch:checked:disabled slider {
2181
animation: none;
2182
}
2183
/*************************
2185
* Check and Radio items *
2186
*************************/
2187
.view.content-view.check:not(list),
2188
.content-view .tile check:not(list) {
2189
min-height: 40px;
2190
min-width: 40px;
2191
margin: 0;
2192
padding: 0;
2193
box-shadow: none;
2194
background-color: transparent;
2195
background-image: none;
2196
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2197
}
2198
.view.content-view.check:not(list):hover, .view.content-view.check:not(list):active,
2200
.content-view .tile check:not(list):hover,
2201
.content-view .tile check:not(list):active {
2202
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2203
}
2204
.view.content-view.check:not(list),
2206
.content-view .tile check:not(list) {
2207
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-unchecked-dark.png"), url("assets/selectionmode-checkbox-unchecked-dark@2.png"));
2208
}
2209
.view.content-view.check:not(list):checked,
2211
.content-view .tile check:not(list):checked {
2212
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-checked-dark.png"), url("assets/selectionmode-checkbox-checked-dark@2.png"));
2213
}
2214
checkbutton.text-button,
2216
radiobutton.text-button {
2217
padding: 2px;
2218
outline-offset: 0;
2219
}
2220
checkbutton.text-button label:not(:only-child),
2222
radiobutton.text-button label:not(:only-child) {
2223
margin: 0 4px;
2224
}
2225
check,
2227
radio {
2228
min-height: 24px;
2229
min-width: 24px;
2230
margin: -12px;
2231
padding: 12px;
2232
}
2233
check:checked, check:indeterminate,
2235
radio:checked,
2236
radio:indeterminate {
2237
color: #FF4081;
2238
}
2239
check:checked:disabled, check:indeterminate:disabled,
2241
radio:checked:disabled,
2242
radio:indeterminate:disabled {
2243
color: rgba(255, 64, 129, 0.4);
2244
}
2245
row check:not(:checked):not(:indeterminate), row
2247
radio:not(:checked):not(:indeterminate) {
2248
color: alpha(currentColor, 0.75);
2249
}
2250
row check:not(:checked):not(:indeterminate):hover, row check:not(:checked):not(:indeterminate):active, row
2252
radio:not(:checked):not(:indeterminate):hover, row
2253
radio:not(:checked):not(:indeterminate):active {
2254
color: currentColor;
2255
}
2256
row check:not(:checked):not(:indeterminate):disabled, row
2258
radio:not(:checked):not(:indeterminate):disabled {
2259
color: alpha(currentColor, 0.3);
2260
}
2261
menu menuitem check, menu menuitem
2263
radio {
2264
transition: none;
2265
margin: -16px;
2266
}
2267
menu menuitem check:not(:checked):not(:indeterminate), menu menuitem
2269
radio:not(:checked):not(:indeterminate) {
2270
color: alpha(currentColor, 0.6);
2271
}
2272
menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem
2274
radio, menu menuitem
2275
radio:hover, menu menuitem
2276
radio:disabled {
2277
box-shadow: none;
2278
}
2279
check {
2282
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.symbolic.png")));
2283
}
2284
check:checked {
2287
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.symbolic.png")));
2288
}
2289
check:indeterminate {
2292
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.symbolic.png")));
2293
}
2294
radio {
2297
border-image-slice: 24;
2298
border-image-width: 24px;
2299
}
2300
radio {
2303
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.symbolic.png")));
2304
}
2305
radio:indeterminate {
2308
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-mixed-symbolic.symbolic.png")));
2309
}
2310
radio {
2313
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent));
2314
}
2315
radio:checked:not(:indeterminate) {
2318
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.10417, to(#FF4081), to(transparent));
2319
}
2320
radio:checked:not(:indeterminate):disabled {
2323
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.10417, to(rgba(255, 64, 129, 0.4)), to(transparent));
2324
}
2325
check:not(:checked):active {
2327
-gtk-icon-transform: rotate(90deg);
2328
}
2329
check:not(:checked):indeterminate:active,
2331
radio:not(:checked):indeterminate:active {
2332
-gtk-icon-transform: scaleX(-1);
2333
}
2334
check:not(:checked),
2336
radio:not(:checked) {
2337
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;
2338
}
2339
check:not(:checked):active,
2341
radio:not(:checked):active {
2342
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0, -gtk-icon-transform 0;
2343
}
2344
menu menuitem check:not(:checked), menu menuitem
2346
radio:not(:checked) {
2347
transition: none;
2348
}
2349
treeview.view check,
2351
treeview.view radio {
2352
padding: 0;
2353
}
2354
treeview.view check:hover,
2356
treeview.view radio:hover {
2357
box-shadow: inset 0 0 0 9999px alpha(#FFFFFF, 0.05);
2358
}
2359
treeview.view check:hover:disabled,
2361
treeview.view radio:hover:disabled {
2362
box-shadow: none;
2363
}
2364
treeview.view check:hover:selected,
2366
treeview.view radio:hover:selected {
2367
box-shadow: inset 0 0 0 9999px alpha(#FFFFFF, 0.05);
2368
}
2369
treeview.view check,
2371
treeview.view radio {
2372
color: rgba(255, 255, 255, 0.75);
2373
}
2374
treeview.view check:hover, treeview.view check:active,
2376
treeview.view radio:hover,
2377
treeview.view radio:active {
2378
color: #FFFFFF;
2379
}
2380
treeview.view check:disabled,
2382
treeview.view radio:disabled {
2383
color: rgba(255, 255, 255, 0.3);
2384
}
2385
treeview.view check:checked, treeview.view check:indeterminate,
2387
treeview.view radio:checked,
2388
treeview.view radio:indeterminate {
2389
color: #FF4081;
2390
}
2391
treeview.view check:checked:disabled, treeview.view check:indeterminate:disabled,
2393
treeview.view radio:checked:disabled,
2394
treeview.view radio:indeterminate:disabled {
2395
color: rgba(255, 64, 129, 0.4);
2396
}
2397
treeview.view check:selected,
2399
treeview.view radio:selected {
2400
color: rgba(255, 255, 255, 0.75);
2401
}
2402
treeview.view check:selected:hover, treeview.view check:selected:active,
2404
treeview.view radio:selected:hover,
2405
treeview.view radio:selected:active {
2406
color: #FFFFFF;
2407
}
2408
treeview.view check:selected:disabled,
2410
treeview.view radio:selected:disabled {
2411
color: rgba(255, 255, 255, 0.3);
2412
}
2413
treeview.view check:selected:checked, treeview.view check:selected:indeterminate,
2415
treeview.view radio:selected:checked,
2416
treeview.view radio:selected:indeterminate {
2417
color: #FF4081;
2418
}
2419
treeview.view check:selected:checked:disabled, treeview.view check:selected:indeterminate:disabled,
2421
treeview.view radio:selected:checked:disabled,
2422
treeview.view radio:selected:indeterminate:disabled {
2423
color: rgba(255, 64, 129, 0.4);
2424
}
2425
treeview.view radio:checked {
2427
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-checked-symbolic.symbolic.png")));
2428
border-image: none;
2429
}
2430
/************
2432
* GtkScale *
2433
************/
2434
scale {
2435
min-height: 12px;
2436
min-width: 12px;
2437
padding: 12px;
2438
}
2439
scale * {
2441
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2442
}
2443
scale slider {
2445
min-height: 24px;
2446
min-width: 24px;
2447
margin: -10px;
2448
}
2449
scale trough {
2451
outline-offset: 2px;
2452
background-color: alpha(currentColor, 0.3);
2453
}
2454
scale trough:disabled {
2456
color: rgba(255, 255, 255, 0.4);
2457
}
2458
scale highlight {
2460
background-color: #FF4081;
2461
}
2462
scale highlight:disabled {
2464
background-color: transparent;
2465
}
2466
scale fill {
2468
background-color: alpha(currentColor, 0.3);
2469
}
2470
scale fill:disabled {
2472
background-color: transparent;
2473
}
2474
scale slider {
2476
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
2477
background-repeat: no-repeat;
2478
background-position: center;
2479
background-size: calc(100% - 8px);
2480
}
2481
scale slider {
2483
background-image: -gtk-scaled(url("assets/scale-slider-dark.png"), url("assets/scale-slider-dark@2.png"));
2484
}
2485
scale slider:disabled {
2487
background-image: -gtk-scaled(url("assets/scale-slider-disabled-dark.png"), url("assets/scale-slider-disabled-dark@2.png"));
2488
}
2489
scale slider:hover {
2491
background-size: calc(100% - 4px);
2492
}
2493
scale slider:active {
2495
background-size: calc(100% - 0px);
2496
}
2497
scale.fine-tune slider {
2499
background-size: calc(100% - 12px);
2500
}
2501
scale value {
2503
color: alpha(currentColor, 0.6);
2504
}
2505
scale marks {
2507
color: alpha(currentColor, 0.3);
2508
}
2509
scale marks.top {
2511
margin-bottom: 8px;
2512
margin-top: -16px;
2513
}
2514
scale marks.bottom {
2516
margin-top: 8px;
2517
margin-bottom: -16px;
2518
}
2519
scale marks.top {
2521
margin-right: 8px;
2522
margin-left: -16px;
2523
}
2524
scale marks.bottom {
2526
margin-left: 8px;
2527
margin-right: -16px;
2528
}
2529
scale.horizontal indicator {
2531
min-height: 8px;
2532
min-width: 1px;
2533
}
2534
scale.vertical indicator {
2536
min-height: 1px;
2537
min-width: 8px;
2538
}
2539
scale.horizontal.marks-before:not(.marks-after) slider {
2541
min-height: 30px;
2542
min-width: 24px;
2543
margin-top: -16px;
2544
background-position: center calc(100% - 4px);
2545
}
2546
scale.horizontal.marks-before:not(.marks-after) slider {
2548
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider-dark.png"), url("assets/scale-horz-marks-before-slider-dark@2.png"));
2549
}
2550
scale.horizontal.marks-before:not(.marks-after) slider:disabled {
2552
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"));
2553
}
2554
scale.horizontal.marks-before:not(.marks-after) slider:hover {
2556
background-position: center calc(100% - 2px);
2557
}
2558
scale.horizontal.marks-before:not(.marks-after) slider:active {
2560
background-position: center calc(100% - 0px);
2561
}
2562
scale.horizontal.marks-before:not(.marks-after).fine-tune slider {
2564
background-position: center calc(100% - 6px);
2565
}
2566
scale.horizontal.marks-after:not(.marks-before) slider {
2568
min-height: 30px;
2569
min-width: 24px;
2570
margin-bottom: -16px;
2571
background-position: center calc(4px);
2572
}
2573
scale.horizontal.marks-after:not(.marks-before) slider {
2575
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider-dark.png"), url("assets/scale-horz-marks-after-slider-dark@2.png"));
2576
}
2577
scale.horizontal.marks-after:not(.marks-before) slider:disabled {
2579
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"));
2580
}
2581
scale.horizontal.marks-after:not(.marks-before) slider:hover {
2583
background-position: center calc(2px);
2584
}
2585
scale.horizontal.marks-after:not(.marks-before) slider:active {
2587
background-position: center calc(0px);
2588
}
2589
scale.horizontal.marks-after:not(.marks-before).fine-tune slider {
2591
background-position: center calc(6px);
2592
}
2593
scale.vertical.marks-before:not(.marks-after) slider {
2595
min-height: 24px;
2596
min-width: 30px;
2597
margin-left: -16px;
2598
background-position: calc(4px) center;
2599
}
2600
scale.vertical.marks-before:not(.marks-after) slider {
2602
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider-dark.png"), url("assets/scale-vert-marks-before-slider-dark@2.png"));
2603
}
2604
scale.vertical.marks-before:not(.marks-after) slider:disabled {
2606
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"));
2607
}
2608
scale.vertical.marks-before:not(.marks-after) slider:hover {
2610
background-position: calc(2px) center;
2611
}
2612
scale.vertical.marks-before:not(.marks-after) slider:active {
2614
background-position: calc(0px) center;
2615
}
2616
scale.vertical.marks-before:not(.marks-after).fine-tune slider {
2618
background-position: calc(6px) center;
2619
}
2620
scale.vertical.marks-after:not(.marks-before) slider {
2622
min-height: 24px;
2623
min-width: 30px;
2624
margin-right: -16px;
2625
background-position: calc(100% - 4px) center;
2626
}
2627
scale.vertical.marks-after:not(.marks-before) slider {
2629
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider-dark.png"), url("assets/scale-vert-marks-after-slider-dark@2.png"));
2630
}
2631
scale.vertical.marks-after:not(.marks-before) slider:disabled {
2633
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"));
2634
}
2635
scale.vertical.marks-after:not(.marks-before) slider:hover {
2637
background-position: calc(100% - 2px) center;
2638
}
2639
scale.vertical.marks-after:not(.marks-before) slider:active {
2641
background-position: calc(100% - 0px) center;
2642
}
2643
scale.vertical.marks-after:not(.marks-before).fine-tune slider {
2645
background-position: calc(100% - 6px) center;
2646
}
2647
scale.color {
2649
min-height: 0;
2650
min-width: 0;
2651
}
2652
scale.color.horizontal {
2654
padding: 0 0 12px 0;
2655
}
2656
scale.color.horizontal slider:dir(ltr), scale.color.horizontal slider:dir(rtl) {
2658
margin-bottom: -12px;
2659
margin-top: -2px;
2660
}
2661
scale.color.vertical:dir(ltr) {
2663
padding: 0 0 0 12px;
2664
}
2665
scale.color.vertical:dir(ltr) slider {
2667
margin-left: -12px;
2668
margin-right: -2px;
2669
}
2670
scale.color.vertical:dir(rtl) {
2672
padding: 0 12px 0 0;
2673
}
2674
scale.color.vertical:dir(rtl) slider {
2676
margin-right: -12px;
2677
margin-left: -2px;
2678
}
2679
/*****************
2681
* Progress bars *
2682
*****************/
2683
progressbar {
2684
color: rgba(255, 255, 255, 0.6);
2685
font-size: smaller;
2686
}
2687
progressbar.horizontal trough,
2689
progressbar.horizontal progress {
2690
min-height: 4px;
2691
}
2692
progressbar.vertical trough,
2694
progressbar.vertical progress {
2695
min-width: 4px;
2696
}
2697
progressbar trough {
2699
background-color: rgba(66, 165, 245, 0.3);
2700
}
2701
progressbar progress {
2703
background-color: #42A5F5;
2704
}
2705
progressbar trough.empty progress {
2707
all: unset;
2708
}
2709
/*************
2711
* Level Bar *
2712
*************/
2713
levelbar block {
2714
min-width: 36px;
2715
min-height: 4px;
2716
}
2717
levelbar.vertical block {
2719
min-width: 4px;
2720
min-height: 36px;
2721
}
2722
levelbar trough {
2724
padding: 2px;
2725
border-radius: 2px;
2726
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
2727
border-image: none;
2728
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2729
background-color: #50636c;
2730
color: #FFFFFF;
2731
}
2732
levelbar trough:disabled {
2734
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2735
background-color: #4a5c64;
2736
color: rgba(255, 255, 255, 0.4);
2737
}
2738
levelbar.horizontal.discrete block {
2740
margin: 0 1px;
2741
}
2742
levelbar.horizontal.discrete trough {
2744
padding: 2px 1px;
2745
}
2746
levelbar.vertical.discrete block {
2748
margin: 1px 0;
2749
}
2750
levelbar.vertical.discrete trough {
2752
padding: 1px 2px;
2753
}
2754
levelbar block.low {
2756
background-color: #FF6D00;
2757
}
2758
levelbar block.high, levelbar block:not(.empty) {
2760
background-color: #42A5F5;
2761
}
2762
levelbar block.full {
2764
background-color: #00C853;
2765
}
2766
levelbar block.empty {
2768
background-color: alpha(currentColor, 0.3);
2769
color: rgba(255, 255, 255, 0.4);
2770
}
2771
/****************
2773
* Print dialog *
2774
*****************/
2775
printdialog paper {
2776
padding: 0;
2777
border: 1px solid rgba(0, 0, 0, 0.2);
2778
background-color: #50636c;
2779
color: #FFFFFF;
2780
}
2781
printdialog .dialog-action-box {
2783
margin: 12px;
2784
}
2785
/**********
2787
* Frames *
2788
**********/
2789
frame > border,
2790
.frame {
2791
margin: 0;
2792
padding: 0;
2793
border: 1px solid rgba(0, 0, 0, 0.2);
2794
border-radius: 0;
2795
box-shadow: none;
2796
}
2797
frame > border.flat,
2799
.frame.flat,
2800
frame.flat > border {
2801
border-style: none;
2802
}
2803
actionbar > revealer > box {
2805
padding: 6px;
2806
border-top: 1px solid rgba(0, 0, 0, 0.2);
2807
}
2808
scrolledwindow viewport.frame {
2810
border-style: none;
2811
}
2812
overshoot.top {
2814
background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2815
background-repeat: no-repeat;
2816
background-position: center top;
2817
background-color: transparent;
2818
border: none;
2819
box-shadow: none;
2820
}
2821
overshoot.bottom {
2823
background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2824
background-repeat: no-repeat;
2825
background-position: center bottom;
2826
background-color: transparent;
2827
border: none;
2828
box-shadow: none;
2829
}
2830
overshoot.left {
2832
background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2833
background-repeat: no-repeat;
2834
background-position: left center;
2835
background-color: transparent;
2836
border: none;
2837
box-shadow: none;
2838
}
2839
overshoot.right {
2841
background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2842
background-repeat: no-repeat;
2843
background-position: right center;
2844
background-color: transparent;
2845
border: none;
2846
box-shadow: none;
2847
}
2848
undershoot.top {
2850
background-color: transparent;
2851
background-image: linear-gradient(to left, rgba(80, 99, 108, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
2852
padding-top: 1px;
2853
background-size: 12px 1px;
2854
background-repeat: repeat-x;
2855
background-origin: content-box;
2856
background-position: left top;
2857
}
2858
undershoot.bottom {
2860
background-color: transparent;
2861
background-image: linear-gradient(to left, rgba(80, 99, 108, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
2862
padding-bottom: 1px;
2863
background-size: 12px 1px;
2864
background-repeat: repeat-x;
2865
background-origin: content-box;
2866
background-position: left bottom;
2867
}
2868
undershoot.left {
2870
background-color: transparent;
2871
background-image: linear-gradient(to top, rgba(80, 99, 108, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
2872
padding-left: 1px;
2873
background-size: 1px 12px;
2874
background-repeat: repeat-y;
2875
background-origin: content-box;
2876
background-position: left top;
2877
}
2878
undershoot.right {
2880
background-color: transparent;
2881
background-image: linear-gradient(to top, rgba(80, 99, 108, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
2882
padding-right: 1px;
2883
background-size: 1px 12px;
2884
background-repeat: repeat-y;
2885
background-origin: content-box;
2886
background-position: right top;
2887
}
2888
junction {
2890
border-style: solid none none solid;
2891
border-width: 1px;
2892
border-color: rgba(0, 0, 0, 0.2);
2893
background-color: #50636c;
2894
}
2895
junction:dir(rtl) {
2897
border-style: solid solid none none;
2898
}
2899
separator {
2901
min-width: 1px;
2902
min-height: 1px;
2903
background-color: rgba(0, 0, 0, 0.2);
2904
}
2905
/*********
2907
* Lists *
2908
*********/
2909
list {
2910
border-color: rgba(0, 0, 0, 0.2);
2911
background-color: #50636c;
2912
}
2913
list row {
2915
padding: 2px;
2916
}
2917
row.activatable, .view, treeview.view header button {
2919
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);
2920
box-shadow: inset 0 0 0 9999px transparent;
2921
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
2922
background-repeat: no-repeat;
2923
background-position: center;
2924
background-size: 1000% 1000%;
2925
}
2926
row.activatable:hover, .view:hover, treeview.view header button:hover {
2928
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);
2929
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.05);
2930
}
2931
row.activatable.has-open-popup, .has-open-popup.view, treeview.view header button.has-open-popup, row.activatable:active, .view:active, treeview.view header button:active {
2933
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, background-size 0, background-image 0;
2934
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
2935
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
2936
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
2937
background-size: 0% 0%;
2938
}
2939
/*********************
2941
* App Notifications *
2942
*********************/
2943
.app-notification {
2944
margin: 8px;
2945
}
2946
.app-notification.frame,
2948
.app-notification border {
2949
border-style: none;
2950
}
2951
/*************
2953
* Expanders *
2954
*************/
2955
expander arrow {
2956
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
2957
min-width: 16px;
2958
min-height: 16px;
2959
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
2960
-gtk-icon-transform: rotate(-90deg);
2961
color: rgba(255, 255, 255, 0.75);
2962
}
2963
expander arrow:dir(rtl) {
2965
-gtk-icon-transform: rotate(90deg);
2966
}
2967
expander arrow:checked {
2969
-gtk-icon-transform: unset;
2970
}
2971
expander arrow:hover, expander arrow:active {
2973
color: #FFFFFF;
2974
}
2975
expander arrow:disabled {
2977
color: rgba(255, 255, 255, 0.3);
2978
}
2979
expander arrow:selected {
2981
color: rgba(255, 255, 255, 0.75);
2982
}
2983
expander arrow:selected:hover, expander arrow:selected:active {
2985
color: #FFFFFF;
2986
}
2987
expander arrow:selected:disabled {
2989
color: rgba(255, 255, 255, 0.3);
2990
}
2991
/************
2993
* Calendar *
2994
************/
2995
calendar {
2996
padding: 1px;
2997
border: 1px solid rgba(0, 0, 0, 0.2);
2998
color: #FFFFFF;
2999
}
3000
calendar:disabled {
3002
color: rgba(255, 255, 255, 0.4);
3003
}
3004
calendar:selected {
3006
border-radius: 3px;
3007
}
3008
calendar.header {
3010
border-style: none none solid;
3011
border-radius: 0;
3012
}
3013
calendar.highlight {
3015
color: alpha(currentColor, 0.6);
3016
font-weight: 500;
3017
}
3018
calendar:indeterminate {
3020
color: alpha(currentColor, 0.4);
3021
}
3022
/***********
3024
* Dialogs *
3025
***********/
3026
messagedialog.background {
3027
background-color: #596e79;
3028
}
3029
messagedialog .titlebar {
3031
min-height: 24px;
3032
border-style: none;
3033
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
3034
background-color: #596e79;
3035
color: #FFFFFF;
3036
}
3037
messagedialog .titlebar:backdrop {
3039
color: rgba(255, 255, 255, 0.75);
3040
}
3041
messagedialog.csd.background {
3043
border-bottom-left-radius: 2px;
3044
border-bottom-right-radius: 2px;
3045
}
3046
messagedialog.csd .dialog-action-area button {
3048
padding: 8px 16px;
3049
border-top: 1px solid rgba(0, 0, 0, 0.2);
3050
border-radius: 0;
3051
}
3052
messagedialog.csd .dialog-action-area button:first-child {
3054
border-bottom-left-radius: 2px;
3055
}
3056
messagedialog.csd .dialog-action-area button:last-child {
3058
border-bottom-right-radius: 2px;
3059
}
3060
filechooser .dialog-action-box {
3062
border-top: 1px solid rgba(0, 0, 0, 0.2);
3063
}
3064
filechooser #pathbarbox {
3066
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
3067
background-color: #44545c;
3068
}
3069
filechooserbutton:drop(active) {
3071
box-shadow: none;
3072
}
3073
/***********
3075
* Sidebar *
3076
***********/
3077
.sidebar {
3078
border-style: none;
3079
background-color: #596e79;
3080
}
3081
stacksidebar.sidebar:dir(ltr) list, stacksidebar.sidebar.left list, stacksidebar.sidebar.left:dir(rtl) list, .sidebar:dir(ltr), .sidebar.left, .sidebar.left:dir(rtl) {
3083
border-right: 1px solid rgba(0, 0, 0, 0.2);
3084
border-left-style: none;
3085
}
3086
stacksidebar.sidebar:dir(rtl) list, stacksidebar.sidebar.right list, .sidebar:dir(rtl), .sidebar.right {
3088
border-left: 1px solid rgba(0, 0, 0, 0.2);
3089
border-right-style: none;
3090
}
3091
.sidebar list {
3093
background-color: transparent;
3094
}
3095
paned .sidebar.left, paned .sidebar.right, paned .sidebar.left:dir(rtl), paned .sidebar:dir(rtl), paned .sidebar:dir(ltr), paned .sidebar {
3097
border-style: none;
3098
}
3099
stacksidebar row {
3101
padding: 10px 4px;
3102
}
3103
stacksidebar row > label {
3105
padding-left: 6px;
3106
padding-right: 6px;
3107
}
3108
/****************
3110
* File chooser *
3111
****************/
3112
placessidebar > viewport.frame {
3113
border-style: none;
3114
}
3115
placessidebar list {
3117
padding: 1px 0 4px;
3118
}
3119
placessidebar row {
3121
min-height: 32px;
3122
margin: -1px 0;
3123
padding: 0;
3124
}
3125
placessidebar row > revealer {
3127
padding: 0 12px;
3128
}
3129
placessidebar row:selected {
3131
color: #FFFFFF;
3132
}
3133
placessidebar row:disabled {
3135
color: rgba(255, 255, 255, 0.4);
3136
}
3137
placessidebar row image.sidebar-icon {
3139
opacity: 0.6;
3140
}
3141
placessidebar row image.sidebar-icon:dir(ltr) {
3143
padding-right: 8px;
3144
}
3145
placessidebar row image.sidebar-icon:dir(rtl) {
3147
padding-left: 8px;
3148
}
3149
placessidebar row label.sidebar-label:dir(ltr) {
3151
padding-right: 2px;
3152
}
3153
placessidebar row label.sidebar-label:dir(rtl) {
3155
padding-left: 2px;
3156
}
3157
placessidebar row.sidebar-placeholder-row {
3159
min-height: 2px;
3160
padding: 0 8px;
3161
background-image: image(#FF4081);
3162
background-clip: content-box;
3163
}
3164
placessidebar row.sidebar-new-bookmark-row {
3166
color: #FF4081;
3167
}
3168
placessidebar row:drop(active):not(:disabled) {
3170
box-shadow: inset 0 0 0 2px #FF4081;
3171
}
3172
placesview .server-list-button > image {
3174
-gtk-icon-transform: rotate(0turn);
3175
}
3176
placesview .server-list-button:checked > image {
3178
-gtk-icon-transform: rotate(-0.5turn);
3179
}
3180
placesview > actionbar > revealer > box > label {
3182
padding-left: 8px;
3183
padding-right: 8px;
3184
}
3185
/*********
3187
* Paned *
3188
*********/
3189
paned > separator {
3190
min-width: 1px;
3191
min-height: 1px;
3192
-gtk-icon-source: none;
3193
border-style: none;
3194
background-color: transparent;
3195
background-image: image(rgba(0, 0, 0, 0.2));
3196
background-size: 1px 1px;
3197
background-clip: content-box;
3198
}
3199
paned > separator.wide {
3201
min-width: 6px;
3202
min-height: 6px;
3203
background-color: #44545c;
3204
background-image: image(rgba(0, 0, 0, 0.2)), image(rgba(0, 0, 0, 0.2));
3205
background-size: 1px 1px, 1px 1px;
3206
}
3207
paned.horizontal > separator {
3209
background-repeat: repeat-y;
3210
}
3211
paned.horizontal > separator:dir(ltr) {
3213
margin: 0 -8px 0 0;
3214
padding: 0 8px 0 0;
3215
background-position: left;
3216
}
3217
paned.horizontal > separator:dir(rtl) {
3219
margin: 0 0 0 -8px;
3220
padding: 0 0 0 8px;
3221
background-position: right;
3222
}
3223
paned.horizontal > separator.wide {
3225
margin: 0;
3226
padding: 0;
3227
background-repeat: repeat-y, repeat-y;
3228
background-position: left, right;
3229
}
3230
paned.vertical > separator {
3232
margin: 0 0 -8px 0;
3233
padding: 0 0 8px 0;
3234
background-repeat: repeat-x;
3235
background-position: top;
3236
}
3237
paned.vertical > separator.wide {
3239
margin: 0;
3240
padding: 0;
3241
background-repeat: repeat-x, repeat-x;
3242
background-position: bottom, top;
3243
}
3244
/**************
3246
* GtkInfoBar *
3247
**************/
3248
infobar {
3249
border-style: none;
3250
}
3251
infobar.info {
3253
background-color: #66BB6A;
3254
}
3255
infobar.question {
3257
background-color: #42A5F5;
3258
}
3259
infobar.warning {
3261
background-color: #FFA726;
3262
}
3263
infobar.error {
3265
background-color: #EF5350;
3266
}
3267
infobar.info > label, infobar.info, infobar.question > label, infobar.question, infobar.warning > label, infobar.warning, infobar.error > label, infobar.error {
3269
color: #FFFFFF;
3270
}
3271
/************
3273
* Tooltips *
3274
************/
3275
tooltip {
3276
border-radius: 2px;
3277
box-shadow: none;
3278
}
3279
tooltip.background {
3281
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
3282
background-color: rgba(80, 99, 108, 0.9);
3283
}
3284
tooltip:not(.csd):not(.unity-csd) {
3286
border: 1px solid rgba(0, 0, 0, 0.2);
3287
border-radius: 3px;
3288
background-clip: border-box;
3289
}
3290
tooltip decoration {
3292
background-color: transparent;
3293
}
3294
tooltip label {
3296
min-height: 20px;
3297
padding: 0 2px;
3298
}
3299
/*****************
3301
* Color Chooser *
3302
*****************/
3303
colorswatch.top {
3304
border-top-left-radius: 2.5px;
3305
border-top-right-radius: 2.5px;
3306
}
3307
colorswatch.top overlay {
3309
border-top-left-radius: 2px;
3310
border-top-right-radius: 2px;
3311
}
3312
colorswatch.bottom {
3314
border-bottom-left-radius: 2.5px;
3315
border-bottom-right-radius: 2.5px;
3316
}
3317
colorswatch.bottom overlay {
3319
border-bottom-left-radius: 2px;
3320
border-bottom-right-radius: 2px;
3321
}
3322
colorswatch.left, colorswatch:first-child:not(.top) {
3324
border-top-left-radius: 2.5px;
3325
border-bottom-left-radius: 2.5px;
3326
}
3327
colorswatch.left overlay, colorswatch:first-child:not(.top) overlay {
3329
border-top-left-radius: 2px;
3330
border-bottom-left-radius: 2px;
3331
}
3332
colorswatch.right, colorswatch:last-child:not(.bottom) {
3334
border-top-right-radius: 2.5px;
3335
border-bottom-right-radius: 2.5px;
3336
}
3337
colorswatch.right overlay, colorswatch:last-child:not(.bottom) overlay {
3339
border-top-right-radius: 2px;
3340
border-bottom-right-radius: 2px;
3341
}
3342
colorswatch.dark overlay {
3344
color: #FFFFFF;
3345
}
3346
colorswatch.light overlay {
3348
color: rgba(0, 0, 0, 0.8);
3349
}
3350
colorswatch.dark {
3352
color: #FFFFFF;
3353
}
3354
colorswatch.light {
3356
color: rgba(0, 0, 0, 0.8);
3357
}
3358
colorswatch:drop(active) {
3360
box-shadow: none;
3361
}
3362
colorswatch:drop(active).light overlay {
3364
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;
3365
}
3366
colorswatch:drop(active).dark overlay {
3368
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;
3369
}
3370
colorswatch overlay {
3372
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3373
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3374
}
3375
colorswatch overlay:hover {
3377
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3378
}
3379
colorswatch#add-color-button {
3381
border-radius: 2px 2px 0 0;
3382
color: #FFFFFF;
3383
}
3384
colorswatch#add-color-button:only-child {
3386
border-radius: 2px;
3387
}
3388
colorswatch#add-color-button overlay {
3390
background-image: linear-gradient(to right, #EF5350 25%, #FFA726 25%, #FFA726 50%, #66BB6A 50%, #66BB6A 75%, #42A5F5 75%);
3391
color: #FFFFFF;
3392
}
3393
colorswatch:disabled {
3395
opacity: 0.4;
3396
}
3397
colorswatch:disabled overlay {
3399
box-shadow: none;
3400
}
3401
colorswatch#editor-color-sample {
3403
border-radius: 2.5px;
3404
}
3405
colorswatch#editor-color-sample overlay {
3407
border-radius: 2px;
3408
}
3409
colorchooser .popover.osd {
3411
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3412
border-radius: 2px;
3413
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);
3414
background-color: #50636c;
3415
}
3416
colorchooser .popover.osd:backdrop {
3418
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);
3419
}
3420
/********
3422
* Misc *
3423
********/
3424
.content-view {
3425
background-color: #44545c;
3426
}
3427
/**********************
3429
* Window Decorations *
3430
**********************/
3431
decoration {
3432
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3433
border-radius: 2px 2px 0 0;
3434
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent;
3435
margin: 8px;
3436
}
3437
decoration:backdrop {
3439
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent;
3440
}
3441
.maximized decoration,
3443
.fullscreen decoration,
3444
.tiled decoration {
3445
border-radius: 0;
3446
}
3447
.popup decoration {
3449
box-shadow: none;
3450
}
3451
.ssd decoration {
3453
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16);
3454
}
3455
.csd.popup decoration {
3457
border-radius: 2px;
3458
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3459
}
3460
tooltip.csd decoration {
3462
border-radius: 2px;
3463
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3464
}
3465
messagedialog.csd decoration {
3467
border-radius: 2px;
3468
}
3469
.solid-csd decoration {
3471
margin: 0;
3472
border-radius: 0;
3473
box-shadow: none;
3474
background-color: #37474F;
3475
}
3476
.view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3478
entry selection, modelbutton.flat:selected,
3479
.menuitem.button.flat:selected, popover.background.menu button:checked,
3480
popover.background button.model:checked, row:selected, calendar:selected, text:selected {
3481
background-color: #42A5F5;
3482
}
3483
row:selected label, label:selected, .view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3485
entry selection, modelbutton.flat:selected,
3486
.menuitem.button.flat:selected, popover.background.menu button:checked,
3487
popover.background button.model:checked, row:selected, calendar:selected, text:selected {
3488
color: #FFFFFF;
3489
}
3490
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,
3492
entry selection:disabled, modelbutton.flat:disabled:selected,
3493
.menuitem.button.flat:disabled:selected, popover.background.menu button:disabled:checked,
3494
popover.background button.model:disabled:checked, row:disabled:selected, calendar:disabled:selected, text:disabled:selected {
3495
color: rgba(255, 255, 255, 0.4);
3496
}
3497
.monospace {
3499
font-family: monospace;
3500
}
3501
/**********************
3503
* Touch Copy & Paste *
3504
**********************/
3505
cursor-handle {
3506
border-radius: 9999px;
3507
background-color: #FF4081;
3508
background-image: none;
3509
}
3510
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) {
3512
padding-left: 6px;
3513
border-top-right-radius: 0;
3514
}
3515
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) {
3517
padding-right: 6px;
3518
border-top-left-radius: 0;
3519
}
3520
cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) {
3522
-GtkWidget-text-handle-width: 24;
3523
-GtkWidget-text-handle-height: 30;
3524
-gtk-icon-source: -gtk-scaled(url("assets/scale-horz-marks-before-slider-dark.png"), url("assets/scale-horz-marks-before-slider-dark@2.png"));
3525
}
3526
.context-menu {
3528
font: initial;
3529
}
3530
.keycap {
3532
min-width: 12px;
3533
min-height: 26px;
3534
margin-top: 2px;
3535
padding-bottom: 2px;
3536
padding-left: 8px;
3537
padding-right: 8px;
3538
border: solid 1px rgba(0, 0, 0, 0.2);
3539
border-radius: 3px;
3540
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.2);
3541
background-color: #50636c;
3542
color: #FFFFFF;
3543
font-size: smaller;
3544
}
3545
:not(decoration):not(window):drop(active) {
3547
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
3548
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;
3549
caret-color: #FF4081;
3550
}
3551
stackswitcher button.text-button {
3553
min-width: 100px;
3554
}
3555
stackswitcher button.circular,
3557
stackswitcher button.text-button.circular {
3558
min-width: 36px;
3559
min-height: 36px;
3560
padding: 0;
3561
}
3562
/************
3564
* Nautilus *
3565
************/
3566
.nautilus-window,
3567
.nautilus-window notebook,
3568
.nautilus-window notebook > stack {
3569
background-color: #50636c;
3570
}
3571
.nautilus-desktop.nautilus-canvas-item:not(:selected), .caja-desktop.caja-canvas-item:not(:selected) {
3573
color: #FFFFFF;
3574
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3575
}
3576
@keyframes needs_attention_keyframes {
3578
to {
3579
background-color: alpha(currentColor, 0.3);
3580
}
3581
}
3582
.nautilus-operations-button-needs-attention {
3584
animation: needs_attention_keyframes 0.3s cubic-bezier(0.4, 0, 0.2, 1) 2 alternate;
3585
}
3586
.nautilus-operations-button-needs-attention-multiple {
3588
animation: needs_attention_keyframes 0.3s cubic-bezier(0.4, 0, 0.2, 1) 4 alternate;
3589
}
3590
.nautilus-window .floating-bar {
3592
min-height: 32px;
3593
padding: 0;
3594
border-style: solid solid none;
3595
border-width: 1px;
3596
border-color: rgba(0, 0, 0, 0.2);
3597
border-radius: 3px 3px 0 0;
3598
background-color: #50636c;
3599
background-clip: border-box;
3600
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), border-width 0;
3601
}
3602
.nautilus-window .floating-bar.bottom.left {
3604
margin-right: 7px;
3605
border-left-style: none;
3606
border-top-left-radius: 0;
3607
}
3608
.nautilus-window .floating-bar.bottom.right {
3610
margin-left: 7px;
3611
border-right-style: none;
3612
border-top-right-radius: 0;
3613
}
3614
.nautilus-window .floating-bar button {
3616
margin: 4px;
3617
}
3618
.disk-space-display.unknown {
3620
background-color: #FF6D00;
3621
}
3622
.disk-space-display.used {
3624
background-color: #42A5F5;
3625
}
3626
.disk-space-display.free {
3628
background-color: alpha(currentColor, 0.3);
3629
color: rgba(255, 255, 255, 0.4);
3630
}
3631
.documents-entry-tag, .photos-entry-tag {
3633
margin: 3px -2px 3px 8px;
3634
padding: 0 8px;
3635
border-radius: 9999px;
3636
box-shadow: none;
3637
background-color: #42A5F5;
3638
color: #FFFFFF;
3639
}
3640
.documents-entry-tag:hover, .photos-entry-tag:hover {
3642
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3643
}
3644
.documents-entry-tag.button, .button.photos-entry-tag {
3646
margin: 0 -2px;
3647
padding: 4px;
3648
border-radius: 9999px;
3649
box-shadow: none;
3650
color: rgba(255, 255, 255, 0.75);
3651
}
3652
.documents-entry-tag.button:hover, .button.photos-entry-tag:hover, .documents-entry-tag.button:active, .button.photos-entry-tag:active {
3654
color: #FFFFFF;
3655
}
3656
.nautilus-window searchbar {
3658
border-top: 1px solid rgba(0, 0, 0, 0.2);
3659
}
3660
.nautilus-window .searchbar-container {
3662
margin-top: -1px;
3663
}
3664
.conflict-row:not(:selected) {
3666
background-color: #85664c;
3667
}
3668
.nautilus-window flowboxchild > widget > .icon-item-background {
3670
padding: 4px;
3671
border-radius: 2px;
3672
}
3673
.nautilus-window flowboxchild:selected {
3675
background-color: transparent;
3676
}
3677
.nautilus-window flowboxchild:selected > widget > .icon-item-background {
3679
background-color: #42A5F5;
3680
}
3681
dialog.background > box.dialog-vbox.vertical > grid.horizontal > scrolledwindow.frame {
3683
border-style: none;
3684
}
3685
dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal:last-child {
3687
margin: -6px 0 0 -6px;
3688
border-top: 1px solid rgba(0, 0, 0, 0.2);
3689
}
3690
dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal:last-child > label {
3692
margin: 0 8px;
3693
}
3694
dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal:last-child > box > button {
3696
border-radius: 0;
3697
}
3698
.nautilus-window > popover.menu:not(:last-child) {
3700
padding: 3px;
3701
}
3702
.nautilus-window > popover.menu:not(:last-child) > stack > box > box > box {
3704
margin-top: -6px;
3705
}
3706
.nautilus-window > popover.menu:not(:last-child) > stack > box > box > box > box {
3708
margin-bottom: -6px;
3709
}
3710
.nautilus-window > popover.menu:not(:last-child) > stack > box > box > box > box.linked {
3712
margin-top: 1px;
3713
}
3714
.nautilus-window > popover.menu:not(:last-child) separator {
3716
margin-bottom: -2px;
3717
}
3718
.nautilus-menu-sort-heading {
3720
margin: 1px 3px;
3721
font-weight: 500;
3722
}
3723
.nautilus-menu-sort-heading:disabled {
3725
color: rgba(255, 255, 255, 0.6);
3726
}
3727
.nautilus-window paned > separator {
3729
background-color: #44545c;
3730
}
3731
/*********
3733
* gedit *
3734
*********/
3735
.open-document-selector-name-label {
3736
font-weight: bold;
3737
}
3738
.open-document-selector-path-label {
3740
color: alpha(currentColor, 0.6);
3741
font-size: smaller;
3742
}
3743
.gedit-document-panel {
3745
background-color: #596e79;
3746
}
3747
.gedit-document-panel row button.flat {
3749
margin-top: 8px;
3750
margin-bottom: 8px;
3751
}
3752
.gedit-document-panel-group-row:not(:first-child) {
3754
border-top: 1px solid rgba(0, 0, 0, 0.2);
3755
}
3756
.gedit-side-panel-paned statusbar {
3758
border-top: 1px solid rgba(0, 0, 0, 0.2);
3759
}
3760
.gedit-search-slider {
3762
margin: 4px 4px 8px;
3763
}
3764
.gedit-search-slider entry:dir(ltr), .gedit-search-slider entry:dir(rtl) {
3766
border-radius: 2px;
3767
}
3768
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag, .gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
3770
all: unset;
3771
color: alpha(currentColor, 0.6);
3772
}
3773
.gedit-search-slider entry:dir(ltr) {
3775
margin-right: -66px;
3776
padding-right: 66px;
3777
}
3778
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag {
3780
margin-left: 6px;
3781
}
3782
.gedit-search-slider entry:dir(ltr) image.right {
3784
margin-right: 0;
3785
}
3786
.gedit-search-slider entry:dir(rtl) {
3788
margin-left: -66px;
3789
padding-left: 66px;
3790
}
3791
.gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
3793
margin-right: 6px;
3794
}
3795
.gedit-search-slider entry:dir(rtl) image.left {
3797
margin-left: 0;
3798
}
3799
.gedit-search-slider entry.error ~ button {
3801
color: rgba(255, 255, 255, 0.75);
3802
}
3803
.gedit-search-slider entry.error ~ button:hover, .gedit-search-slider entry.error ~ button:active {
3805
color: #FFFFFF;
3806
}
3807
.gedit-search-slider entry.error ~ button:disabled {
3809
color: rgba(255, 255, 255, 0.3);
3810
}
3811
.gedit-search-slider button {
3813
border: solid 6px transparent;
3814
}
3815
.gedit-search-slider button:last-child:dir(ltr), .gedit-search-slider button:not(:first-child):dir(rtl) {
3817
margin-left: -3px;
3818
}
3819
.gedit-search-slider button:first-child:dir(rtl), .gedit-search-slider button:not(:last-child):dir(ltr) {
3821
margin-right: -3px;
3822
}
3823
frame.gedit-map-frame > border:dir(ltr) {
3825
border-style: none none none solid;
3826
}
3827
frame.gedit-map-frame > border:dir(rtl) {
3829
border-style: none solid none none;
3830
}
3831
/**************
3833
* Tweak Tool *
3834
**************/
3835
.tweak-categories {
3836
background-image: image(#596e79);
3837
}
3838
.tweak-categories separator {
3840
min-width: 0;
3841
min-height: 0;
3842
background-color: transparent;
3843
}
3844
.tweak {
3846
padding: 3px;
3847
}
3848
.tweak.title:hover {
3850
box-shadow: none;
3851
}
3852
.tweak-group-white,
3854
.tweak-white,
3855
.tweak-white:hover {
3856
background-image: image(#50636c);
3857
}
3858
.tweak-startup,
3860
.tweak-startup:hover {
3861
background-image: image(#50636c);
3862
}
3863
.tweak-group-startup {
3865
background-image: image(#50636c);
3866
border: 1px solid rgba(0, 0, 0, 0.2);
3867
}
3868
/***********
3870
* Builder *
3871
***********/
3872
layouttabbar {
3873
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
3874
background-color: #44545c;
3875
}
3876
layouttabbar > box > button {
3878
margin: 2px 0;
3879
}
3880
layouttab {
3882
margin: 0 8px;
3883
border-style: none solid;
3884
border-width: 1px;
3885
border-color: rgba(0, 0, 0, 0.2);
3886
box-shadow: inset 0 -2px #42A5F5;
3887
background-color: #50636c;
3888
}
3889
layouttab separator.vertical {
3891
margin: 8px 4px;
3892
}
3893
layouttab button.text-button, layouttab button.image-button, layouttab button {
3895
margin-top: 8px;
3896
margin-bottom: 8px;
3897
padding: 0 4px;
3898
}
3899
layout {
3901
border: 1px solid rgba(0, 0, 0, 0.2);
3902
-PnlDockBin-handle-size: 1;
3903
}
3904
entry.search-missing {
3906
background-color: #DD2C00;
3907
color: #FFFFFF;
3908
}
3909
window.workbench treeview.image {
3911
color: alpha(currentColor, 0.6);
3912
}
3913
window.workbench treeview.image:selected {
3915
color: rgba(255, 255, 255, 0.6);
3916
}
3917
popover.popover-selector list {
3919
padding: 6px;
3920
}
3921
popover.popover-selector list row {
3923
border-radius: 2px;
3924
}
3925
popover.popover-selector list row image:dir(ltr) {
3927
margin-right: 6px;
3928
}
3929
popover.popover-selector list row image:dir(rtl) {
3931
margin-left: 6px;
3932
}
3933
popover.popover-selector list row .accel:dir(ltr) {
3935
margin-left: 6px;
3936
}
3937
popover.popover-selector list row .accel:dir(rtl) {
3939
margin-right: 6px;
3940
}
3941
omnibar.linked:not(.vertical) entry {
3943
border-radius: 2px;
3944
}
3945
omnibar:not(:hover):not(:active) entry {
3947
color: rgba(255, 255, 255, 0.75);
3948
}
3949
popover.omnibar list row:not(:last-child) {
3951
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
3952
}
3953
entry.preferences-search {
3955
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.2);
3956
background-color: #50636c;
3957
}
3958
preferences stacksidebar.sidebar list {
3960
background-color: #596e79;
3961
}
3962
preferences stacksidebar.sidebar:dir(ltr) list, preferences stacksidebar.sidebar:dir(rtl) list {
3964
border-style: none;
3965
}
3966
preferences stacksidebar.sidebar list separator {
3968
min-width: 0;
3969
min-height: 0;
3970
background-color: transparent;
3971
}
3972
preferences > box > box:dir(ltr) {
3974
border-right: 1px solid rgba(0, 0, 0, 0.2);
3975
}
3976
preferences > box > box:dir(rtl) {
3978
border-left: 1px solid rgba(0, 0, 0, 0.2);
3979
}
3980
popover.messagepopover.background {
3982
padding: 0;
3983
}
3984
popover.messagepopover .popover-action-area button {
3986
padding: 8px 16px;
3987
border-top: 1px solid rgba(0, 0, 0, 0.2);
3988
border-radius: 0;
3989
}
3990
popover.messagepopover .popover-action-area button:first-child {
3992
border-bottom-left-radius: 2px;
3993
}
3994
popover.messagepopover .popover-action-area button:last-child {
3996
border-bottom-right-radius: 2px;
3997
}
3998
popover.messagepopover .popover-content-area {
4000
margin: 16px;
4001
}
4002
popover.transfers list {
4004
background-color: transparent;
4005
}
4006
popover.transfers list row:not(:first-child) {
4008
border-top: 1px solid rgba(0, 0, 0, 0.2);
4009
}
4010
popover.transfers list row > box {
4012
padding: 10px;
4013
}
4014
dockbin {
4016
border: 1px solid rgba(0, 0, 0, 0.2);
4017
-PnlDockBin-handle-size: 1;
4018
}
4019
dockpaned {
4021
border: 1px solid rgba(0, 0, 0, 0.2);
4022
}
4023
eggsearchbar box.search-bar {
4025
padding: 0 8px;
4026
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
4027
background-color: #44545c;
4028
}
4029
docktabstrip {
4031
padding: 0 8px;
4032
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
4033
background-color: #44545c;
4034
}
4035
docktab {
4037
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
4038
min-height: 24px;
4039
min-width: 24px;
4040
margin-bottom: -1px;
4041
padding: 6px 6px;
4042
outline-offset: -6px;
4043
border-width: 1px;
4044
border-color: transparent;
4045
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 10%, transparent 0%);
4046
background-repeat: no-repeat;
4047
background-position: center;
4048
background-size: 0% 0%;
4049
color: rgba(255, 255, 255, 0.75);
4050
font-weight: 500;
4051
}
4052
docktab:hover {
4054
box-shadow: inset 0 -2px alpha(currentColor, 0.3);
4055
color: #FFFFFF;
4056
}
4057
docktab:checked {
4059
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);
4060
box-shadow: inset 0 -2px #42A5F5;
4061
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
4062
background-size: 1000% 1000%;
4063
color: #FFFFFF;
4064
}
4065
dockoverlayedge {
4067
background-color: #44545c;
4068
}
4069
dockoverlayedge docktabstrip {
4071
padding: 0;
4072
border: none;
4073
}
4074
dockoverlayedge.left-edge docktab:hover {
4076
box-shadow: inset -2px 0 alpha(currentColor, 0.3);
4077
}
4078
dockoverlayedge.left-edge docktab:checked {
4080
box-shadow: inset -2px 0 #42A5F5;
4081
}
4082
dockoverlayedge.right-edge docktab:hover {
4084
box-shadow: inset 2px 0 alpha(currentColor, 0.3);
4085
}
4086
dockoverlayedge.right-edge docktab:checked {
4088
box-shadow: inset 2px 0 #42A5F5;
4089
}
4090
pillbox {
4092
background-color: #44545c;
4093
border-radius: 2px;
4094
}
4095
layoutpane entry.search {
4097
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.2);
4098
background-color: #50636c;
4099
}
4100
editortweak entry.search {
4102
margin-bottom: -1px;
4103
box-shadow: none;
4104
}
4105
.gb-search-entry-occurrences-tag {
4107
box-shadow: none;
4108
background-color: transparent;
4109
}
4110
docktabstrip {
4112
min-height: 39px;
4113
}
4114
window.workbench preferences preferencesgroup list entry {
4116
padding-top: 8px;
4117
padding-bottom: 8px;
4118
}
4119
button.run-arrow-button {
4121
padding-left: 10px;
4122
padding-right: 10px;
4123
}
4124
/**********
4126
* Photos *
4127
**********/
4128
GdMainIconView.content-view {
4129
-GdMainIconView-icon-size: 48;
4130
}
4131
.documents-counter {
4133
margin: 8px;
4134
border-radius: 9999px;
4135
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
4136
background-color: #FF4081;
4137
color: #FFFFFF;
4138
font-weight: bold;
4139
}
4140
.documents-scrolledwin.frame {
4142
border-style: none;
4143
}
4144
.documents-scrolledwin.frame frame.content-view > border {
4146
border-style: none;
4147
}
4148
.photos-fade-in {
4150
opacity: 1;
4151
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
4152
}
4153
.photos-fade-out {
4155
opacity: 0;
4156
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
4157
}
4158
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) {
4160
border-style: none none none solid;
4161
}
4162
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(rtl) {
4164
border-style: none solid none none;
4165
}
4166
/*********
4168
* Music *
4169
*********/
4170
.side-panel:dir(ltr) {
4171
border-style: solid;
4172
border-color: rgba(0, 0, 0, 0.2);
4173
}
4174
.side-panel:dir(rtl) {
4176
border-style: solid;
4177
border-color: rgba(0, 0, 0, 0.2);
4178
}
4179
.side-panel .view {
4181
background-image: image(#596e79);
4182
}
4183
.side-panel .view:hover {
4185
background-image: image(#617580);
4186
}
4187
.side-panel .view:selected {
4189
background-image: image(#42A5F5);
4190
}
4191
.side-panel .view:selected:hover {
4193
background-image: image(#4baaf6);
4194
}
4195
.songs-list:hover {
4197
background-image: image(alpha(currentColor, 0.05));
4198
}
4199
frame.documents-dropdown {
4201
margin: 8px;
4202
}
4203
frame.documents-dropdown > border {
4205
border: none;
4206
}
4207
box.vertical > revealer > toolbar.search-bar {
4209
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
4210
background-clip: border-box;
4211
}
4212
box.vertical > revealer > toolbar.search-bar button > widget {
4214
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4215
}
4216
/*********
4218
* To Do *
4219
*********/
4220
taskrow {
4221
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
4222
margin: 0 -8px;
4223
}
4224
taskrow:hover {
4226
transition: none;
4227
}
4228
taskrow label {
4230
margin: 0 8px;
4231
}
4232
taskrow image {
4234
min-width: 16px;
4235
}
4236
task-list-view > box > revealer > box > button {
4238
margin: -6px;
4239
}
4240
/*******
4242
* eog *
4243
*******/
4244
#eog-thumb-nav scrolledwindow {
4245
border-top: none;
4246
}
4247
#eog-thumb-nav button {
4249
-gtk-outline-radius: 2px;
4250
}
4251
/*************
4253
* Evolution *
4254
*************/
4255
frame.taskbar > border {
4256
border-style: solid none none;
4257
}
4258
box.vertical > paned.horizontal notebook widget .frame {
4260
border-style: none;
4261
}
4262
/********
4264
* gitg *
4265
********/
4266
frame.commit-frame > border {
4267
border-style: solid none none;
4268
}
4269
/**************
4271
* Characters *
4272
**************/
4273
box.dialog-vbox scrolledwindow.related {
4274
border: 1px solid rgba(0, 0, 0, 0.2);
4275
}
4276
list.categories {
4278
background-image: image(#596e79);
4279
}
4280
/**************
4282
* Calculator *
4283
**************/
4284
button.title label {
4285
min-height: 36px;
4286
}
4287
/*********
4289
* Tilix *
4290
*********/
4291
overlay > revealer.left > scrolledwindow.frame,
4292
overlay > revealer.right > scrolledwindow.frame {
4293
border-style: none;
4294
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22);
4295
}
4296
overlay > revealer.left > scrolledwindow.frame {
4298
margin-right: 32px;
4299
}
4300
overlay > revealer.right > scrolledwindow.frame {
4302
margin-left: 32px;
4303
}
4304
.terminix-session-sidebar,
4306
.tilix-session-sidebar {
4307
background-image: image(#596e79);
4308
}
4309
button.image-button.session-new-button {
4311
min-width: 32px;
4312
}
4313
/***********
4315
* Eclipse *
4316
***********/
4317
window.background > box.vertical > scrolledwindow > widget toolbar {
4318
padding: 2px;
4319
}
4320
window.background > box.vertical > scrolledwindow > widget toolbar separator,
4322
window.background > box.vertical > scrolledwindow > widget toolbar button {
4323
margin: 2px;
4324
}
4325
window.background > box.vertical > scrolledwindow > widget toolbar button {
4327
border-radius: 2px;
4328
}
4329
/***********
4331
* Firefox *
4332
***********/
4333
window.background:not(.csd) > widget > separator {
4334
color: rgba(0, 0, 0, 0.2);
4335
}
4336
window.background:not(.csd) > * > menu {
4338
border: none;
4339
}
4340
window.background:not(.csd) > window.background > menu > menuitem > check,
4342
window.background:not(.csd) > widget > checkbutton > check {
4343
border-radius: 2px;
4344
-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")));
4345
}
4346
window.background:not(.csd) > window.background > menu > menuitem > check:checked,
4348
window.background:not(.csd) > widget > checkbutton > check:checked {
4349
-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")));
4350
}
4351
window.background:not(.csd) > window.background > menu > menuitem > check:indeterminate,
4353
window.background:not(.csd) > widget > checkbutton > check:indeterminate {
4354
-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")));
4355
}
4356
window.background:not(.csd) > window.background > menu > menuitem > radio,
4358
window.background:not(.csd) > widget > radiobutton > radio {
4359
-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")));
4360
}
4361
window.background:not(.csd) > window.background > menu > menuitem > radio:checked,
4363
window.background:not(.csd) > widget > radiobutton > radio:checked {
4364
border-image: none;
4365
-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")));
4366
}
4367
window.background:not(.csd) > window.background > menu > menuitem > radio:indeterminate,
4369
window.background:not(.csd) > widget > radiobutton > radio:indeterminate {
4370
-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")));
4371
}
4372
window.background:not(.csd) > widget > menubar {
4374
color: rgba(255, 255, 255, 0.75);
4375
}
4376
window.background:not(.csd) > widget > menubar:hover {
4378
color: #FFFFFF;
4379
}
4380
window.background:not(.csd) > widget > menubar:disabled {
4382
color: rgba(255, 255, 255, 0.3);
4383
}
4384
window.background:not(.csd) > window.background > menu > separator {
4386
color: rgba(0, 0, 0, 0.2);
4387
}
4388
window.background:not(.csd) > widget > frame {
4390
color: rgba(0, 0, 0, 0.2);
4391
}
4392
window.background:not(.csd) > widget > checkbutton > check,
4394
window.background:not(.csd) > widget > radiobutton > radio {
4395
margin: 0;
4396
padding: 0;
4397
}
4398
/***********
4400
* Synapse *
4401
***********/
4402
box.vertical > widget > widget:selected {
4403
background-color: #42A5F5;
4404
}
4405
/*********
4407
* Unity *
4408
*********/
4409
UnityDecoration {
4410
-UnityDecoration-extents: 28px 0 0 0;
4411
-UnityDecoration-input-extents: 8px;
4412
-UnityDecoration-shadow-offset-x: 0;
4413
-UnityDecoration-shadow-offset-y: 3px;
4414
-UnityDecoration-active-shadow-color: rgba(0, 0, 0, 0.48);
4415
-UnityDecoration-active-shadow-radius: 18px;
4416
-UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32);
4417
-UnityDecoration-inactive-shadow-radius: 6px;
4418
-UnityDecoration-glow-size: 8px;
4419
-UnityDecoration-glow-color: #42A5F5;
4420
-UnityDecoration-title-indent: 4px;
4421
-UnityDecoration-title-fade: 32px;
4422
-UnityDecoration-title-alignment: 0.0;
4423
}
4424
UnityDecoration .top {
4426
padding: 0 2px;
4427
border-style: none;
4428
border-radius: 2px 2px 0 0;
4429
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
4430
background-color: #37474F;
4431
color: #FFFFFF;
4432
}
4433
UnityDecoration .top:backdrop {
4435
color: rgba(255, 255, 255, 0.75);
4436
}
4437
UnityDecoration .menuitem {
4439
color: alpha(currentColor, 0.75);
4440
}
4441
UnityDecoration .menuitem:hover {
4443
box-shadow: inset 0 -2px currentColor;
4444
background-color: transparent;
4445
color: currentColor;
4446
}
4447
.background:not(.csd) headerbar:not(.titlebar) {
4449
border-radius: 0;
4450
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
4451
}
4452
.background:not(.csd) headerbar:not(.titlebar).inline-toolbar {
4454
border-style: none;
4455
}
4456
UnityPanelWidget,
4458
.unity-panel {
4459
background-color: #263238;
4460
color: #FFFFFF;
4461
}
4462
UnityPanelWidget:backdrop,
4464
.unity-panel:backdrop {
4465
color: rgba(255, 255, 255, 0.75);
4466
}
4467
.unity-panel.menuitem,
4469
.unity-panel .menuitem {
4470
color: alpha(currentColor, 0.75);
4471
}
4472
.unity-panel.menubar.menuitem:hover,
4474
.unity-panel.menubar .menuitem *:hover {
4475
box-shadow: inset 0 -2px currentColor;
4476
background-color: transparent;
4477
color: currentColor;
4478
}
4479
.menu IdoPlaybackMenuItem.menuitem:active {
4481
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
4482
animation: spin 1s linear infinite;
4483
color: #42A5F5;
4484
}
4485
/**************
4487
* Mate-Panel *
4488
**************/
4489
.mate-panel-menu-bar menubar,
4490
#PanelApplet-window-menu-applet-button {
4491
background-color: transparent;
4492
}
4493
#PanelPlug,
4495
PanelToplevel.background {
4496
background-color: #263238;
4497
color: #FFFFFF;
4498
font-weight: 500;
4499
}
4500
PanelToplevel > widget > button {
4502
padding: 0 4px;
4503
border-radius: 0;
4504
}
4505
PanelSeparator {
4507
color: rgba(0, 0, 0, 0.2);
4508
}
4509
MatePanelAppletFrameDBus {
4511
border-style: solid;
4512
border-width: 0 1px;
4513
border-color: rgba(0, 0, 0, 0.2);
4514
}
4515
.mate-panel-menu-bar menubar menuitem {
4517
padding: 4px;
4518
}
4519
.mate-panel-menu-bar menubar menu menuitem {
4521
padding: 6px;
4522
}
4523
.mate-panel-menu-bar #PanelApplet button {
4525
-GtkWidget-window-dragging: true;
4526
padding: 4px;
4527
border-radius: 0;
4528
}
4529
PanelApplet.wnck-applet .wnck-pager {
4531
background-color: transparent;
4532
color: #40C4FF;
4533
}
4534
PanelApplet.wnck-applet .wnck-pager:hover {
4536
background-color: alpha(currentColor, 0.15);
4537
}
4538
PanelApplet.wnck-applet .wnck-pager:active {
4540
background-color: alpha(currentColor, 0.3);
4541
}
4542
PanelApplet.wnck-applet .wnck-pager:selected {
4544
background-color: #42A5F5;
4545
}
4546
#MatePanelPopupWindow {
4548
border: 1px solid rgba(0, 0, 0, 0.2);
4549
border-radius: 3px;
4550
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
4551
}
4552
#MatePanelPopupWindow frame > border {
4554
border-style: none;
4555
}
4556
#MatePanelPopupWindow ClockMap {
4558
border: 1px solid rgba(0, 0, 0, 0.2);
4559
}
4560
na-tray-applet {
4562
-NaTrayApplet-icon-padding: 3px;
4563
-NaTrayApplet-icon-size: 16;
4564
}
4565
.mate-panel-menu-bar {
4567
-PanelMenuBar-icon-visible: true;
4568
}
4569
.mate-panel-applet-slider {
4571
background-color: transparent;
4572
}
4573
.mate-panel-applet-slider frame {
4575
border: 1px solid rgba(0, 0, 0, 0.2);
4576
border-radius: 3px;
4577
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
4578
background-color: #44545c;
4579
}
4580
.mate-panel-applet-slider frame frame {
4582
all: unset;
4583
}
4584
.mate-panel-applet-slider frame > border {
4586
border-style: none;
4587
}
4588
/*********************
4590
* CAJA File manager *
4591
*********************/
4592
.caja-navigation-window button.toggle.image-button {
4593
border-radius: 2px;
4594
}
4595
.caja-pathbar button {
4597
margin: 0 -1px 0 -2px;
4598
}
4599
.caja-pathbar button > widget {
4601
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4602
-GtkArrow-arrow-scaling: 1;
4603
}
4604
.caja-side-pane notebook viewport.frame,
4606
.caja-side-pane notebook widget .vertical {
4607
background-color: #50636c;
4608
}
4609
.caja-side-pane notebook,
4611
.caja-notebook {
4612
border-top: 1px solid rgba(0, 0, 0, 0.2);
4613
}
4614
.caja-side-pane notebook .frame,
4616
.caja-notebook .frame {
4617
border-style: none;
4618
}
4619
.caja-navigation-window statusbar {
4621
margin: 0 -10px;
4622
padding: 0 4px;
4623
border-top: 1px solid rgba(0, 0, 0, 0.2);
4624
}
4625
.caja-notebook frame > border {
4627
border-style: none;
4628
}
4629
#caja-extra-view-widget {
4631
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
4632
background-color: #44545c;
4633
}
4634
#caja-extra-view-widget > box > box > label {
4636
font-weight: bold;
4637
}
4638
/*********
4640
* Pluma *
4641
*********/
4642
.pluma-window statusbar {
4643
margin: 0 -10px;
4644
padding: 0 4px;
4645
border-top: 1px solid rgba(0, 0, 0, 0.2);
4646
}
4647
.pluma-window statusbar frame > border {
4649
border-style: none;
4650
}
4651
.pluma-window statusbar frame button.flat {
4653
padding: 0 4px;
4654
border-radius: 0;
4655
}
4656
.pluma-window statusbar frame button.flat widget {
4658
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4659
-GtkArrow-arrow-scaling: 1;
4660
}
4661
.pluma-print-preview toolbar {
4663
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
4664
}
4665
.pluma-window paned.horizontal box.vertical box.horizontal button.flat {
4667
margin: 1px;
4668
}
4669
.pluma-window paned.horizontal box.vertical .frame {
4671
border-style: none;
4672
}
4673
.pluma-window paned.horizontal box.vertical notebook.frame {
4675
margin-top: -1px;
4676
border-top: 1px solid rgba(0, 0, 0, 0.2);
4677
}
4678
.pluma-window paned.horizontal box.vertical notebook.frame box.vertical toolbar.horizontal {
4680
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
4681
}
4682
/*********
4684
* Atril *
4685
*********/
4686
.atril-window paned.horizontal box.vertical .frame {
4687
border-style: none;
4688
}
4689
.atril-window paned.horizontal box.vertical notebook .frame {
4691
border-top: 1px solid rgba(0, 0, 0, 0.2);
4692
}
4693
/* mate-screensaver lock dialog */
4695
.lock-dialog {
4696
border-radius: 2px;
4697
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);
4698
}
4699
.lock-dialog frame > border {
4701
border-style: none;
4702
}
4703
/************************
4705
* LightDM GTK+ Greeter *
4706
************************/
4707
#panel_window {
4708
background-color: rgba(0, 0, 0, 0.3);
4709
color: #FFFFFF;
4710
}
4711
#panel_window menubar,
4713
#panel_window separator {
4714
background-color: transparent;
4715
}
4716
#panel_window separator {
4718
padding: 0 4px;
4719
}
4720
#panel_window separator:first-child {
4722
padding: 0 8px;
4723
}
4724
#panel_window menubar > menuitem {
4726
color: rgba(255, 255, 255, 0.75);
4727
}
4728
#panel_window menubar > menuitem:hover {
4730
color: #FFFFFF;
4731
}
4732
#panel_window menubar > menuitem:disabled label {
4734
color: rgba(255, 255, 255, 0.3);
4735
}
4736
#login_window,
4738
#shutdown_dialog,
4739
#restart_dialog {
4740
margin: 8px;
4741
border-radius: 2px;
4742
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);
4743
background-color: #596e79;
4744
}
4745
#content_frame {
4747
padding-bottom: 20px;
4748
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
4749
}
4750
#buttonbox_frame {
4752
padding-top: 24px;
4753
}
4754
#buttonbox_frame button {
4756
margin: -16px;
4757
}
4758
#greeter_infobar {
4760
margin-top: -1px;
4761
}
4762
/* GTK NAMED COLORS
4764
----------------
4765
use responsibly! */
4766
/*
4767
widget text/foreground color */
4768
@define-color theme_fg_color #FFFFFF;
4769
/*
4770
text color for entries, views and content in general */
4771
@define-color theme_text_color #FFFFFF;
4772
/*
4773
widget base background color */
4774
@define-color theme_bg_color #44545c;
4775
/*
4776
text widgets and the like base background color */
4777
@define-color theme_base_color #50636c;
4778
/*
4779
base background color of selections */
4780
@define-color theme_selected_bg_color #42A5F5;
4781
/*
4782
text/foreground color of selections */
4783
@define-color theme_selected_fg_color #FFFFFF;
4784
/*
4785
base background color of insensitive widgets */
4786
@define-color insensitive_bg_color #44545c;
4787
/*
4788
text foreground color of insensitive widgets */
4789
@define-color insensitive_fg_color rgba(255, 255, 255, 0.4);
4790
/*
4791
insensitive text widgets and the like base background color */
4792
@define-color insensitive_base_color #4a5c64;
4793
/*
4794
widget text/foreground color on backdrop windows */
4795
@define-color theme_unfocused_fg_color #FFFFFF;
4796
/*
4797
text color for entries, views and content in general on backdrop windows */
4798
@define-color theme_unfocused_text_color #FFFFFF;
4799
/*
4800
widget base background color on backdrop windows */
4801
@define-color theme_unfocused_bg_color #44545c;
4802
/*
4803
text widgets and the like base background color on backdrop windows */
4804
@define-color theme_unfocused_base_color #50636c;
4805
/*
4806
base background color of selections on backdrop windows */
4807
@define-color theme_unfocused_selected_bg_color #42A5F5;
4808
/*
4809
text/foreground color of selections on backdrop windows */
4810
@define-color theme_unfocused_selected_fg_color #FFFFFF;
4811
/*
4812
insensitive color on backdrop windows */
4813
@define-color unfocused_insensitive_color rgba(255, 255, 255, 0.4);
4814
/*
4815
widgets main borders color */
4816
@define-color borders rgba(0, 0, 0, 0.2);
4817
/*
4818
widgets main borders color on backdrop windows */
4819
@define-color unfocused_borders rgba(0, 0, 0, 0.2);
4820
/*
4821
these are pretty self explicative */
4822
@define-color warning_color #FF6D00;
4823
@define-color error_color #DD2C00;
4824
@define-color success_color #00C853;
4825
/*
4826
FIXME this is really an API */
4827
@define-color content_view_bg #50636c;
4828
@define-color placeholder_text_color #b9c1c4;
4829