gtk-dark.css
ASCII text, with very long lines (608)
1
@keyframes ripple_effect {
2
from {
3
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 0%, transparent 0%), image(alpha(currentColor, 0)); }
4
to {
5
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 100%, transparent 0%), image(alpha(currentColor, 0.15)); } }
6
@keyframes flat_ripple_effect {
7
from {
8
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 0%, transparent 0%), image(alpha(currentColor, 0.15)); }
9
to {
10
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 100%, transparent 0%), image(alpha(currentColor, 0.15)); } }
11
@keyframes row_ripple_effect {
12
from {
13
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 0%, transparent 0%), image(alpha(currentColor, 0.05)); }
14
to {
15
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 100%, transparent 0%), image(alpha(currentColor, 0.15)); } }
16
@keyframes tab_ripple_effect {
17
from {
18
background-image: radial-gradient(circle farthest-corner at center, rgba(0, 188, 212, 0.6) 0%, transparent 0%); }
19
50% {
20
background-image: radial-gradient(circle farthest-corner at center, rgba(0, 188, 212, 0.6) 100%, transparent 0%); }
21
to {
22
background-image: radial-gradient(circle farthest-corner at center, transparent 100%, transparent 0%); } }
23
@keyframes header_ripple_effect {
24
from {
25
background-image: radial-gradient(circle farthest-corner at center, #00BCD4 0%, transparent 0%); }
26
to {
27
background-image: radial-gradient(circle farthest-corner at center, #00BCD4 100%, transparent 0%); } }
28
* {
29
padding: 0;
30
background-clip: padding-box;
31
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0;
32
-GtkToolButton-icon-spacing: 4;
33
-GtkTextView-error-underline-color: #DD2C00;
34
-GtkScrolledWindow-scrollbar-spacing: 0;
35
-GtkToolItemGroup-expander-size: 11;
36
-GtkTreeView-expander-size: 11;
37
-GtkTreeView-horizontal-separator: 4;
38
-GtkWidget-text-handle-width: 24;
39
-GtkWidget-text-handle-height: 24;
40
-GtkDialog-button-spacing: 4;
41
-GtkDialog-action-area-border: 0;
42
outline-style: solid;
43
outline-width: 2px;
44
outline-color: alpha(currentColor, 0.3);
45
outline-offset: -4px;
46
-gtk-outline-radius: 2px;
47
-gtk-secondary-caret-color: #00BCD4; }
48
49
/***************
50
* Base States *
51
***************/
52
.background {
53
background-color: #37474F;
54
color: #FFFFFF; }
55
56
/*
57
These wildcard seems unavoidable, need to investigate.
58
Wildcards are bad and troublesome, use them with care,
59
or better, just don't.
60
Everytime a wildcard is used a kitten dies, painfully.
61
*/
62
*:disabled {
63
-gtk-icon-effect: dim; }
64
65
.gtkstyle-fallback {
66
background-color: #37474F;
67
color: #FFFFFF; }
68
.gtkstyle-fallback:hover {
69
background-color: #2d3940;
70
color: #FFFFFF; }
71
.gtkstyle-fallback:active {
72
background-color: #222c31;
73
color: #FFFFFF; }
74
.gtkstyle-fallback:disabled {
75
background-color: #37474F;
76
color: rgba(255, 255, 255, 0.4); }
77
.gtkstyle-fallback:selected {
78
background-color: #00BCD4;
79
color: #FFFFFF; }
80
81
.view, iconview {
82
background-color: #455A64;
83
color: #FFFFFF; }
84
.view:hover, iconview:hover, .view:active, iconview:active, .view:selected, iconview:selected {
85
border-radius: 2px; }
86
.view:disabled, iconview:disabled {
87
color: rgba(255, 255, 255, 0.4); }
88
89
.view text, iconview text,
90
textview text {
91
background-color: #455A64;
92
color: #FFFFFF; }
93
.view text:disabled, iconview text:disabled,
94
textview text:disabled {
95
color: rgba(255, 255, 255, 0.4); }
96
97
textview border {
98
background-color: #3e515a;
99
background-image: image(#37474F);
100
background-repeat: no-repeat;
101
color: rgba(255, 255, 255, 0.6); }
102
textview border.bottom {
103
background-size: 100% 1px;
104
background-position: top; }
105
textview border.top {
106
background-size: 100% 1px;
107
background-position: bottom; }
108
textview border.left {
109
background-size: 1px 100%;
110
background-position: right; }
111
textview border.right {
112
background-size: 1px 100%;
113
background-position: left; }
114
115
.rubberband,
116
rubberband,
117
flowbox rubberband,
118
treeview.view rubberband,
119
.content-view rubberband {
120
border: 1px solid #00E5FF;
121
background-color: rgba(0, 229, 255, 0.3); }
122
123
flowbox flowboxchild {
124
outline-offset: -2px;
125
padding: 4px;
126
border-radius: 2px; }
127
128
label.separator {
129
color: #FFFFFF; }
130
label selection {
131
background-color: #00BCD4;
132
color: #FFFFFF; }
133
label:disabled {
134
color: rgba(255, 255, 255, 0.4); }
135
136
.dim-label, label.separator, .titlebar:not(headerbar) .subtitle,
137
headerbar .subtitle {
138
opacity: 0.6; }
139
140
assistant .sidebar {
141
padding: 4px 0; }
142
assistant .sidebar label {
143
min-height: 36px;
144
padding: 0 12px;
145
color: rgba(255, 255, 255, 0.6);
146
font-weight: 500; }
147
assistant .sidebar label.highlight {
148
color: #FFFFFF; }
149
150
popover.background.touch-selection, popover.background.magnifier, popover.background.osd, .csd popover.background.touch-selection, .csd popover.background.magnifier, .csd popover.background.osd, .app-notification,
151
.app-notification.frame, .osd .scale-popup, .floating-bar, .osd {
152
opacity: 0.9; }
153
154
/*********************
155
* Spinner Animation *
156
*********************/
157
@keyframes spin {
158
to {
159
-gtk-icon-transform: rotate(1turn); } }
160
@keyframes spin_colors {
161
1% {
162
color: #66BB6A; }
163
25% {
164
color: #66BB6A; }
165
26% {
166
color: #42A5F5; }
167
50% {
168
color: #42A5F5; }
169
51% {
170
color: #FFA726; }
171
75% {
172
color: #FFA726; }
173
76% {
174
color: #EF5350; }
175
100% {
176
color: #EF5350; } }
177
spinner {
178
background: none;
179
opacity: 0;
180
-gtk-icon-source: -gtk-icontheme("process-working-symbolic"); }
181
spinner:checked {
182
opacity: 1;
183
animation: spin 1s linear infinite, spin_colors 4s linear infinite; }
184
spinner:checked:disabled {
185
opacity: 0.4; }
186
187
/****************
188
* Text Entries *
189
****************/
190
spinbutton:not(.vertical), notebook > stack:not(:only-child) revealer entry,
191
notebook > stack:not(:only-child) revealer spinbutton:not(.vertical),
192
entry {
193
min-height: 36px;
194
padding: 0 8px;
195
border-radius: 2px;
196
border-image: none;
197
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
198
background-color: #455A64;
199
color: #FFFFFF; }
200
spinbutton:focus:not(.vertical), notebook > stack:not(:only-child) revealer entry:focus,
201
notebook > stack:not(:only-child) revealer spinbutton:focus:not(.vertical),
202
entry:focus {
203
border-image: none;
204
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
205
spinbutton:disabled:not(.vertical), notebook > stack:not(:only-child) revealer entry:disabled,
206
notebook > stack:not(:only-child) revealer spinbutton:disabled:not(.vertical),
207
entry:disabled {
208
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
209
background-color: #3e515a;
210
color: rgba(255, 255, 255, 0.4); }
211
spinbutton.flat:not(.vertical), notebook > stack:not(:only-child) entry,
212
notebook > stack:not(:only-child) spinbutton:not(.vertical), notebook > stack:not(:only-child) revealer entry.flat,
213
notebook > stack:not(:only-child) revealer spinbutton.flat:not(.vertical), colorchooser .popover.osd spinbutton:not(.vertical),
214
entry.flat {
215
border-radius: 0;
216
border-image: radial-gradient(circle farthest-corner at center calc(100% - 1px), #00BCD4 0%, transparent 0%) 0 0 0/0 0 0px;
217
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
218
background-color: transparent;
219
color: #FFFFFF; }
220
spinbutton.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry:focus,
221
notebook > stack:not(:only-child) spinbutton:focus:not(.vertical), colorchooser .popover.osd spinbutton:focus:not(.vertical),
222
entry.flat:focus {
223
border-image: radial-gradient(circle farthest-corner at center calc(100% - 1px), #00BCD4 100%, transparent 0%) 0 0 2/0 0 2px;
224
box-shadow: inset 0 -1px alpha(currentColor, 0.3); }
225
spinbutton.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry:disabled,
226
notebook > stack:not(:only-child) spinbutton:disabled:not(.vertical), colorchooser .popover.osd spinbutton:disabled:not(.vertical),
227
entry.flat:disabled {
228
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
229
background-color: transparent;
230
color: rgba(255, 255, 255, 0.4); }
231
spinbutton:not(.vertical) image, notebook > stack:not(:only-child) revealer entry image,
232
notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image,
233
entry image {
234
color: alpha(currentColor, 0.75); }
235
spinbutton:not(.vertical) image:hover, notebook > stack:not(:only-child) revealer entry image:hover,
236
notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image:hover, spinbutton:not(.vertical) image:active, notebook > stack:not(:only-child) revealer entry image:active,
237
notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image:active,
238
entry image:hover,
239
entry image:active {
240
color: currentColor; }
241
spinbutton:not(.vertical) image:disabled, notebook > stack:not(:only-child) revealer entry image:disabled,
242
notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image:disabled,
243
entry image:disabled {
244
color: alpha(currentColor, 0.6); }
245
spinbutton:not(.vertical) image.left, notebook > stack:not(:only-child) revealer entry image.left,
246
notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image.left,
247
entry image.left {
248
padding-left: 2px;
249
padding-right: 6px; }
250
spinbutton:not(.vertical) image.right, notebook > stack:not(:only-child) revealer entry image.right,
251
notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image.right,
252
entry image.right {
253
padding-left: 6px;
254
padding-right: 2px; }
255
spinbutton:not(.vertical) undershoot.left, notebook > stack:not(:only-child) revealer entry undershoot.left,
256
notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) undershoot.left,
257
entry undershoot.left {
258
background-color: transparent;
259
background-image: linear-gradient(to top, rgba(69, 90, 100, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
260
padding-left: 0;
261
background-size: 2px 16px;
262
background-repeat: repeat-y;
263
background-origin: content-box;
264
background-position: left center; }
265
spinbutton:not(.vertical) undershoot.right, notebook > stack:not(:only-child) revealer entry undershoot.right,
266
notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) undershoot.right,
267
entry undershoot.right {
268
background-color: transparent;
269
background-image: linear-gradient(to top, rgba(69, 90, 100, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
270
padding-right: 0;
271
background-size: 2px 16px;
272
background-repeat: repeat-y;
273
background-origin: content-box;
274
background-position: right center; }
275
spinbutton.error:not(.vertical), notebook > stack:not(:only-child) revealer entry.error,
276
notebook > stack:not(:only-child) revealer spinbutton.error:not(.vertical),
277
entry.error {
278
border-image: none;
279
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
280
background-color: #DD2C00;
281
color: #FFFFFF; }
282
spinbutton.error:focus:not(.vertical), notebook > stack:not(:only-child) revealer entry.error:focus,
283
entry.error:focus {
284
border-image: none;
285
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
286
spinbutton.error:disabled:not(.vertical), notebook > stack:not(:only-child) revealer entry.error:disabled,
287
entry.error:disabled {
288
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
289
background-color: #3e515a;
290
color: rgba(255, 255, 255, 0.4); }
291
spinbutton.error.flat:not(.vertical), notebook > stack:not(:only-child) entry.error,
292
notebook > stack:not(:only-child) spinbutton.error:not(.vertical), colorchooser .popover.osd spinbutton.error:not(.vertical),
293
entry.error.flat {
294
border-image: radial-gradient(circle farthest-corner at center calc(100% - 1px), #DD2C00 0%, transparent 0%) 0 0 0/0 0 0px;
295
box-shadow: inset 0 -1px #DD2C00;
296
background-color: transparent;
297
color: #FFFFFF; }
298
spinbutton.error.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry.error:focus,
299
notebook > stack:not(:only-child) spinbutton.error:focus:not(.vertical), colorchooser .popover.osd spinbutton.error:focus:not(.vertical),
300
entry.error.flat:focus {
301
border-image: radial-gradient(circle farthest-corner at center calc(100% - 1px), #DD2C00 100%, transparent 0%) 0 0 2/0 0 2px;
302
box-shadow: inset 0 -1px #DD2C00; }
303
spinbutton.error.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry.error:disabled,
304
notebook > stack:not(:only-child) spinbutton.error:disabled:not(.vertical), colorchooser .popover.osd spinbutton.error:disabled:not(.vertical),
305
entry.error.flat:disabled {
306
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
307
background-color: transparent;
308
color: rgba(255, 255, 255, 0.4); }
309
spinbutton.warning:not(.vertical), notebook > stack:not(:only-child) revealer entry.warning,
310
notebook > stack:not(:only-child) revealer spinbutton.warning:not(.vertical),
311
entry.warning {
312
border-image: none;
313
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
314
background-color: #FF6D00;
315
color: #FFFFFF; }
316
spinbutton.warning:focus:not(.vertical), notebook > stack:not(:only-child) revealer entry.warning:focus,
317
entry.warning:focus {
318
border-image: none;
319
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
320
spinbutton.warning:disabled:not(.vertical), notebook > stack:not(:only-child) revealer entry.warning:disabled,
321
entry.warning:disabled {
322
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
323
background-color: #3e515a;
324
color: rgba(255, 255, 255, 0.4); }
325
spinbutton.warning.flat:not(.vertical), notebook > stack:not(:only-child) entry.warning,
326
notebook > stack:not(:only-child) spinbutton.warning:not(.vertical), colorchooser .popover.osd spinbutton.warning:not(.vertical),
327
entry.warning.flat {
328
border-image: radial-gradient(circle farthest-corner at center calc(100% - 1px), #FF6D00 0%, transparent 0%) 0 0 0/0 0 0px;
329
box-shadow: inset 0 -1px #FF6D00;
330
background-color: transparent;
331
color: #FFFFFF; }
332
spinbutton.warning.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry.warning:focus,
333
notebook > stack:not(:only-child) spinbutton.warning:focus:not(.vertical), colorchooser .popover.osd spinbutton.warning:focus:not(.vertical),
334
entry.warning.flat:focus {
335
border-image: radial-gradient(circle farthest-corner at center calc(100% - 1px), #FF6D00 100%, transparent 0%) 0 0 2/0 0 2px;
336
box-shadow: inset 0 -1px #FF6D00; }
337
spinbutton.warning.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry.warning:disabled,
338
notebook > stack:not(:only-child) spinbutton.warning:disabled:not(.vertical), colorchooser .popover.osd spinbutton.warning:disabled:not(.vertical),
339
entry.warning.flat:disabled {
340
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
341
background-color: transparent;
342
color: rgba(255, 255, 255, 0.4); }
343
spinbutton:not(.vertical) progress, notebook > stack:not(:only-child) revealer entry progress,
344
notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) progress,
345
entry progress {
346
margin: 2px -6px;
347
border-style: none none solid;
348
border-width: 2px;
349
border-color: #00BCD4;
350
background-color: transparent; }
351
352
treeview acceleditor > label {
353
background-color: #00BCD4; }
354
355
treeview entry.flat, treeview entry {
356
min-height: 0;
357
padding: 2px;
358
border-radius: 0;
359
box-shadow: none;
360
background-color: #455A64; }
361
treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:focus {
362
border-image: none; }
363
364
/***********
365
* Buttons *
366
***********/
367
@keyframes needs_attention {
368
from {
369
background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent)); }
370
to {
371
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#FF4081), to(transparent)); } }
372
button {
373
min-height: 24px;
374
min-width: 16px;
375
padding: 6px 10px;
376
border-radius: 2px;
377
font-weight: 500;
378
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
379
background-color: #546E7A;
380
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0) 100%, transparent 0%), image(alpha(currentColor, 0));
381
color: rgba(255, 255, 255, 0.75); }
382
button:hover {
383
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
384
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0) 100%, transparent 0%), image(alpha(currentColor, 0));
385
color: #FFFFFF; }
386
button:active {
387
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
388
color: #FFFFFF;
389
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0, background-image 0;
390
animation: ripple_effect 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards; }
391
button:disabled {
392
box-shadow: none;
393
background-color: alpha(currentColor, 0.3);
394
color: rgba(255, 255, 255, 0.3); }
395
button:disabled > label {
396
color: inherit; }
397
button:checked {
398
background-color: #00BCD4;
399
color: #FFFFFF; }
400
button:checked:disabled {
401
background-color: alpha(currentColor, 0.3);
402
color: rgba(0, 188, 212, 0.4); }
403
button:checked:disabled > label {
404
color: inherit; }
405
.inline-toolbar
406
button, modelbutton.flat, popover.background checkbutton,
407
popover.background radiobutton,
408
.menuitem.button.flat, spinbutton:not(.vertical) button, spinbutton.vertical button, toolbar.osd button, .app-notification button,
409
.app-notification.frame button, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
410
headerbar button:not(.suggested-action):not(.destructive-action), notebook > header > tabs > arrow, scrollbar button, check,
411
radio, calendar.button, messagedialog.csd .dialog-action-area button, button.sidebar-button,
412
button.flat {
413
box-shadow: none;
414
background-color: transparent;
415
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0) 100%, transparent 0%), image(alpha(currentColor, 0));
416
color: rgba(255, 255, 255, 0.75); }
417
.inline-toolbar
418
button:hover, modelbutton.flat:hover, popover.background checkbutton:hover,
419
popover.background radiobutton:hover,
420
.menuitem.button.flat:hover, spinbutton:not(.vertical) button:hover, spinbutton.vertical button:hover, toolbar.osd button:hover, .app-notification button:hover, .titlebar:not(headerbar) button:hover:not(.suggested-action):not(.destructive-action),
421
headerbar button:hover:not(.suggested-action):not(.destructive-action), notebook > header > tabs > arrow:hover, scrollbar button:hover, check:hover,
422
radio:hover, calendar.button:hover, messagedialog.csd .dialog-action-area button:hover, button.sidebar-button:hover,
423
button.flat:hover {
424
box-shadow: none;
425
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0) 100%, transparent 0%), image(alpha(currentColor, 0.15));
426
color: #FFFFFF; }
427
.inline-toolbar
428
button:active, modelbutton.flat:active, popover.background checkbutton:active,
429
popover.background radiobutton:active,
430
.menuitem.button.flat:active, spinbutton:not(.vertical) button:active, spinbutton.vertical button:active, toolbar.osd button:active, .app-notification button:active, .titlebar:not(headerbar) button:active:not(.suggested-action):not(.destructive-action),
431
headerbar button:active:not(.suggested-action):not(.destructive-action), notebook > header > tabs > arrow:active, scrollbar button:active, check:active,
432
radio:active, calendar.button:active, messagedialog.csd .dialog-action-area button:active, button.sidebar-button:active,
433
button.flat:active {
434
box-shadow: none;
435
color: #FFFFFF;
436
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0, background-image 0;
437
animation: flat_ripple_effect 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards; }
438
.inline-toolbar
439
button:disabled, modelbutton.flat:disabled, popover.background checkbutton:disabled,
440
popover.background radiobutton:disabled,
441
.menuitem.button.flat:disabled, spinbutton:not(.vertical) button:disabled, spinbutton.vertical button:disabled, toolbar.osd button:disabled, .app-notification button:disabled, .titlebar:not(headerbar) button:disabled:not(.suggested-action):not(.destructive-action),
442
headerbar button:disabled:not(.suggested-action):not(.destructive-action), notebook > header > tabs > arrow:disabled, scrollbar button:disabled, check:disabled,
443
radio:disabled, calendar.button:disabled, messagedialog.csd .dialog-action-area button:disabled, button.sidebar-button:disabled,
444
button.flat:disabled {
445
box-shadow: none;
446
background-color: transparent;
447
color: rgba(255, 255, 255, 0.3); }
448
.inline-toolbar
449
button:disabled > label, modelbutton.flat:disabled > label, popover.background checkbutton:disabled > label,
450
popover.background radiobutton:disabled > label,
451
.menuitem.button.flat:disabled > label, spinbutton:not(.vertical) button:disabled > label, spinbutton.vertical button:disabled > label, toolbar.osd button:disabled > label, .app-notification button:disabled > label, .titlebar:not(headerbar) button:disabled:not(.suggested-action):not(.destructive-action) > label,
452
headerbar button:disabled:not(.suggested-action):not(.destructive-action) > label, notebook > header > tabs > arrow:disabled > label, scrollbar button:disabled > label, check:disabled > label,
453
radio:disabled > label, calendar.button:disabled > label, messagedialog.csd .dialog-action-area button:disabled > label, button.sidebar-button:disabled > label,
454
button.flat:disabled > label {
455
color: inherit; }
456
.inline-toolbar
457
button:checked, modelbutton.flat:checked, popover.background checkbutton:checked,
458
popover.background radiobutton:checked,
459
.menuitem.button.flat:checked, spinbutton:not(.vertical) button:checked, spinbutton.vertical button:checked, toolbar.osd button:checked, .app-notification button:checked, .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action),
460
headerbar button:checked:not(.suggested-action):not(.destructive-action), notebook > header > tabs > arrow:checked, scrollbar button:checked, check:checked,
461
radio:checked, calendar.button:checked, messagedialog.csd .dialog-action-area button:checked, button.sidebar-button:checked,
462
button.flat:checked {
463
background-color: alpha(currentColor, 0.3);
464
color: #FFFFFF; }
465
.inline-toolbar
466
button:checked:disabled, modelbutton.flat:checked:disabled, popover.background checkbutton:checked:disabled,
467
popover.background radiobutton:checked:disabled,
468
.menuitem.button.flat:checked:disabled, spinbutton:not(.vertical) button:checked:disabled, spinbutton.vertical button:checked:disabled, toolbar.osd button:checked:disabled, .app-notification button:checked:disabled, .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action),
469
headerbar button:checked:disabled:not(.suggested-action):not(.destructive-action), notebook > header > tabs > arrow:checked:disabled, scrollbar button:checked:disabled, check:checked:disabled,
470
radio:checked:disabled, calendar.button:checked:disabled, messagedialog.csd .dialog-action-area button:checked:disabled, button.sidebar-button:checked:disabled,
471
button.flat:checked:disabled {
472
background-color: alpha(currentColor, 0.3);
473
color: rgba(255, 255, 255, 0.4); }
474
.inline-toolbar
475
button:checked:disabled > label, modelbutton.flat:checked:disabled > label, popover.background checkbutton:checked:disabled > label,
476
popover.background radiobutton:checked:disabled > label,
477
.menuitem.button.flat:checked:disabled > label, spinbutton:not(.vertical) button:checked:disabled > label, spinbutton.vertical button:checked:disabled > label, toolbar.osd button:checked:disabled > label, .app-notification button:checked:disabled > label, .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action) > label,
478
headerbar button:checked:disabled:not(.suggested-action):not(.destructive-action) > label, notebook > header > tabs > arrow:checked:disabled > label, scrollbar button:checked:disabled > label, check:checked:disabled > label,
479
radio:checked:disabled > label, calendar.button:checked:disabled > label, messagedialog.csd .dialog-action-area button:checked:disabled > label, button.sidebar-button:checked:disabled > label,
480
button.flat:checked:disabled > label {
481
color: inherit; }
482
.inline-toolbar
483
button:not(.text-button), spinbutton:not(.vertical) button, notebook > header tab button.flat, check,
484
radio, button.titlebutton, .nautilus-circular-button,
485
button.image-button {
486
min-width: 24px;
487
padding: 6px;
488
-gtk-outline-radius: 100px;
489
border-radius: 100px; }
490
button.text-button {
491
padding-left: 16px;
492
padding-right: 16px; }
493
.inline-toolbar
494
button.text-button:not(.text-button), spinbutton:not(.vertical) button.text-button, notebook > header tab button.text-button.flat, check.text-button,
495
radio.text-button, button.text-button.titlebutton, .text-button.nautilus-circular-button,
496
button.text-button.image-button {
497
padding-left: 10px;
498
padding-right: 10px;
499
-gtk-outline-radius: 2px;
500
border-radius: 2px; }
501
.inline-toolbar
502
button.text-button:not(.text-button) label:last-child, spinbutton:not(.vertical) button.text-button label:last-child, notebook > header tab button.text-button.flat label:last-child, check.text-button label:last-child,
503
radio.text-button label:last-child, button.text-button.titlebutton label:last-child, .text-button.nautilus-circular-button label:last-child,
504
button.text-button.image-button label:last-child {
505
padding-left: 2px;
506
padding-right: 6px; }
507
.inline-toolbar
508
button.text-button:not(.text-button) label:first-child, spinbutton:not(.vertical) button.text-button label:first-child, notebook > header tab button.text-button.flat label:first-child, check.text-button label:first-child,
509
radio.text-button label:first-child, button.text-button.titlebutton label:first-child, .text-button.nautilus-circular-button label:first-child,
510
button.text-button.image-button label:first-child {
511
padding-left: 6px;
512
padding-right: 2px; }
513
.inline-toolbar .linked > button, .linked > modelbutton.flat, popover.background .linked > checkbutton,
514
popover.background .linked > radiobutton,
515
.linked > .menuitem.button.flat, spinbutton:not(.vertical) .linked > button, spinbutton.vertical .linked > button, toolbar.osd .linked > button, .app-notification .linked > button, .titlebar:not(headerbar) .linked > button:not(.suggested-action):not(.destructive-action),
516
headerbar .linked > button:not(.suggested-action):not(.destructive-action), notebook > header > tabs.linked > arrow, scrollbar .linked > button, .linked > check,
517
.linked > radio, .linked > calendar.button, messagedialog.csd .dialog-action-area .linked > button, .linked > button.sidebar-button, .inline-toolbar .linked.vertical > button, .linked.vertical > modelbutton.flat, popover.background .linked.vertical > checkbutton,
518
popover.background .linked.vertical > radiobutton,
519
.linked.vertical > .menuitem.button.flat, spinbutton:not(.vertical) .linked.vertical > button, spinbutton.vertical .linked.vertical > button, toolbar.osd .linked.vertical > button, .app-notification .linked.vertical > button, .titlebar:not(headerbar) .linked.vertical > button:not(.suggested-action):not(.destructive-action),
520
headerbar .linked.vertical > button:not(.suggested-action):not(.destructive-action), notebook > header > tabs.linked.vertical > arrow, scrollbar .linked.vertical > button, .linked.vertical > check,
521
.linked.vertical > radio, .linked.vertical > calendar.button, messagedialog.csd .dialog-action-area .linked.vertical > button, .linked.vertical > button.sidebar-button, .linked >
522
button.flat, .linked.vertical >
523
button.flat {
524
border-radius: 2px; }
525
.inline-toolbar .linked > button.image-button, .inline-toolbar .linked > button.flat:not(.text-button), .linked > modelbutton.image-button.flat, popover.background .linked > checkbutton.image-button,
526
popover.background .linked > radiobutton.image-button,
527
.linked > .image-button.menuitem.button.flat, spinbutton:not(.vertical) .linked > button, spinbutton.vertical .linked > button.image-button, toolbar.osd .linked > button.image-button, .app-notification .linked > button.image-button, .titlebar:not(headerbar) .linked > button.image-button:not(.suggested-action):not(.destructive-action),
528
headerbar .linked > button.image-button:not(.suggested-action):not(.destructive-action), notebook > header > tabs.linked > arrow.image-button, notebook > header tab .linked > button.flat, scrollbar .linked > button.image-button, .linked > check,
529
.linked > radio, .linked > calendar.image-button.button, messagedialog.csd .dialog-action-area .linked > button.image-button, .linked > button.image-button.sidebar-button, .linked > button.flat.titlebutton, .linked > .flat.nautilus-circular-button, .inline-toolbar .linked.vertical > button.image-button, .inline-toolbar .linked.vertical > button.flat:not(.text-button), .linked.vertical > modelbutton.image-button.flat, popover.background .linked.vertical > checkbutton.image-button,
530
popover.background .linked.vertical > radiobutton.image-button,
531
.linked.vertical > .image-button.menuitem.button.flat, spinbutton:not(.vertical) .linked.vertical > button, spinbutton.vertical .linked.vertical > button.image-button, toolbar.osd .linked.vertical > button.image-button, .app-notification .linked.vertical > button.image-button, .titlebar:not(headerbar) .linked.vertical > button.image-button:not(.suggested-action):not(.destructive-action),
532
headerbar .linked.vertical > button.image-button:not(.suggested-action):not(.destructive-action), notebook > header > tabs.linked.vertical > arrow.image-button, notebook > header tab .linked.vertical > button.flat, scrollbar .linked.vertical > button.image-button, .linked.vertical > check,
533
.linked.vertical > radio, .linked.vertical > calendar.image-button.button, messagedialog.csd .dialog-action-area .linked.vertical > button.image-button, .linked.vertical > button.image-button.sidebar-button, .linked.vertical > button.flat.titlebutton, .linked.vertical > .flat.nautilus-circular-button, .linked >
534
button.flat.image-button, .linked.vertical >
535
button.flat.image-button {
536
-gtk-outline-radius: 100px;
537
border-radius: 100px; }
538
.inline-toolbar .linked > button.text-button.image-button, .inline-toolbar .linked > button.flat.text-button:not(.text-button), .linked > modelbutton.text-button.image-button.flat, popover.background .linked > checkbutton.text-button.image-button,
539
popover.background .linked > radiobutton.text-button.image-button,
540
.linked > .text-button.image-button.menuitem.button.flat, spinbutton:not(.vertical) .linked > button.text-button, spinbutton.vertical .linked > button.text-button.image-button, toolbar.osd .linked > button.text-button.image-button, .app-notification .linked > button.text-button.image-button, .titlebar:not(headerbar) .linked > button.text-button.image-button:not(.suggested-action):not(.destructive-action),
541
headerbar .linked > button.text-button.image-button:not(.suggested-action):not(.destructive-action), notebook > header > tabs.linked > arrow.text-button.image-button, notebook > header tab .linked > button.flat.text-button, scrollbar .linked > button.text-button.image-button, .linked > check.text-button,
542
.linked > radio.text-button, .linked > calendar.text-button.image-button.button, messagedialog.csd .dialog-action-area .linked > button.text-button.image-button, .linked > button.text-button.image-button.sidebar-button, .linked > button.flat.text-button.titlebutton, .linked > .flat.text-button.nautilus-circular-button, .inline-toolbar .linked.vertical > button.text-button.image-button, .inline-toolbar .linked.vertical > button.flat.text-button:not(.text-button), .linked.vertical > modelbutton.text-button.image-button.flat, popover.background .linked.vertical > checkbutton.text-button.image-button,
543
popover.background .linked.vertical > radiobutton.text-button.image-button,
544
.linked.vertical > .text-button.image-button.menuitem.button.flat, spinbutton:not(.vertical) .linked.vertical > button.text-button, spinbutton.vertical .linked.vertical > button.text-button.image-button, toolbar.osd .linked.vertical > button.text-button.image-button, .app-notification .linked.vertical > button.text-button.image-button, .titlebar:not(headerbar) .linked.vertical > button.text-button.image-button:not(.suggested-action):not(.destructive-action),
545
headerbar .linked.vertical > button.text-button.image-button:not(.suggested-action):not(.destructive-action), notebook > header > tabs.linked.vertical > arrow.text-button.image-button, notebook > header tab .linked.vertical > button.flat.text-button, scrollbar .linked.vertical > button.text-button.image-button, .linked.vertical > check.text-button,
546
.linked.vertical > radio.text-button, .linked.vertical > calendar.text-button.image-button.button, messagedialog.csd .dialog-action-area .linked.vertical > button.text-button.image-button, .linked.vertical > button.text-button.image-button.sidebar-button, .linked.vertical > button.flat.text-button.titlebutton, .linked.vertical > .flat.text-button.nautilus-circular-button, .linked >
547
button.flat.text-button.image-button, .linked.vertical >
548
button.flat.text-button.image-button {
549
-gtk-outline-radius: 2px;
550
border-radius: 2px; }
551
.info button:disabled,
552
.question button:disabled,
553
.warning button:disabled,
554
.error button:disabled, row:selected
555
button:disabled {
556
color: rgba(255, 255, 255, 0.3); }
557
row:selected button.sidebar-button, .info button.flat,
558
.question button.flat,
559
.warning button.flat,
560
.error button.flat, row:selected
561
button.flat {
562
color: rgba(255, 255, 255, 0.75); }
563
row:selected button.sidebar-button:hover, .info button.flat:hover,
564
.question button.flat:hover,
565
.warning button.flat:hover,
566
.error button.flat:hover, row:selected button.sidebar-button:active, .info button.flat:active,
567
.question button.flat:active,
568
.warning button.flat:active,
569
.error button.flat:active, row:selected
570
button.flat:hover, row:selected
571
button.flat:active {
572
color: #FFFFFF; }
573
row:selected button.sidebar-button:disabled, .info button.flat:disabled,
574
.question button.flat:disabled,
575
.warning button.flat:disabled,
576
.error button.flat:disabled, row:selected
577
button.flat:disabled {
578
color: rgba(255, 255, 255, 0.3); }
579
button separator {
580
min-width: 0;
581
min-height: 0;
582
background: transparent; }
583
button.osd {
584
padding: 12px 16px; }
585
button.osd.image-button {
586
padding: 12px; }
587
button.osd:disabled {
588
opacity: 0; }
589
button.suggested-action {
590
background-color: #FF4081;
591
color: #FFFFFF; }
592
button.suggested-action:disabled {
593
box-shadow: none;
594
background-color: alpha(currentColor, 0.3);
595
color: rgba(255, 255, 255, 0.3); }
596
button.suggested-action:disabled > label {
597
color: inherit; }
598
button.suggested-action:checked {
599
background-color: #ff79a7; }
600
button.suggested-action.flat {
601
background-color: transparent;
602
color: #FF4081; }
603
button.suggested-action.flat:disabled {
604
box-shadow: none;
605
background-color: transparent;
606
color: rgba(255, 255, 255, 0.3); }
607
button.suggested-action.flat:disabled > label {
608
color: inherit; }
609
button.destructive-action {
610
background-color: #FF5252;
611
color: #FFFFFF; }
612
button.destructive-action:disabled {
613
box-shadow: none;
614
background-color: alpha(currentColor, 0.3);
615
color: rgba(255, 255, 255, 0.3); }
616
button.destructive-action:disabled > label {
617
color: inherit; }
618
button.destructive-action:checked {
619
background-color: #ff8686; }
620
button.destructive-action.flat {
621
background-color: transparent;
622
color: #FF5252; }
623
button.destructive-action.flat:disabled {
624
box-shadow: none;
625
background-color: transparent;
626
color: rgba(255, 255, 255, 0.3); }
627
button.destructive-action.flat:disabled > label {
628
color: inherit; }
629
.stack-switcher >
630
button {
631
outline-offset: -4px; }
632
.stack-switcher >
633
button > label {
634
padding-left: 6px;
635
padding-right: 6px; }
636
.stack-switcher >
637
button > image {
638
padding-left: 6px;
639
padding-right: 6px;
640
padding-top: 3px;
641
padding-bottom: 3px; }
642
.stack-switcher >
643
button.text-button {
644
padding-left: 10px;
645
padding-right: 10px; }
646
.stack-switcher >
647
button.image-button {
648
padding-left: 4px;
649
padding-right: 4px; }
650
.stack-switcher >
651
button.needs-attention:checked > label,
652
.stack-switcher >
653
button.needs-attention:checked > image {
654
animation: none;
655
background-image: none; }
656
.primary-toolbar
657
button {
658
-gtk-icon-shadow: none; }
659
660
.stack-switcher >
661
button.needs-attention > label,
662
.stack-switcher >
663
button.needs-attention > image, stacksidebar row.needs-attention > label {
664
transition: none;
665
animation: needs_attention 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
666
background-repeat: no-repeat;
667
background-position: right 3px;
668
background-size: 6px 6px; }
669
.stack-switcher >
670
button.needs-attention > label:dir(rtl),
671
.stack-switcher >
672
button.needs-attention > image:dir(rtl), stacksidebar row.needs-attention > label:dir(rtl) {
673
background-position: left 3px; }
674
675
.linked:not(.vertical) > spinbutton:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked:not(.vertical) > entry:not(.flat),
676
notebook > stack:not(:only-child) revealer .linked:not(.vertical) > spinbutton:not(.flat):not(.vertical), .linked:not(.vertical) >
677
entry:not(.flat), .linked >
678
button, .linked > combobox > box > button.combo:dir(ltr), .linked > combobox > box > button.combo:dir(rtl) {
679
border-radius: 0; }
680
681
.linked:not(.vertical) > spinbutton:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked:not(.vertical) > entry:not(.flat),
682
notebook > stack:not(:only-child) revealer .linked:not(.vertical) > spinbutton:not(.flat):not(.vertical), .linked:not(.vertical) >
683
entry:not(.flat), .linked >
684
button {
685
-gtk-outline-radius: 2px; }
686
.linked:not(.vertical) > spinbutton:first-child:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked:not(.vertical) > entry:first-child:not(.flat),
687
notebook > stack:not(:only-child) revealer .linked:not(.vertical) > spinbutton:first-child:not(.flat):not(.vertical), .linked:not(.vertical) >
688
entry:first-child:not(.flat), .linked >
689
button:first-child, combobox.linked button:nth-child(2):dir(rtl), .linked:not(.vertical) > combobox:first-child > box > button.combo {
690
border-top-left-radius: 2px;
691
border-bottom-left-radius: 2px; }
692
.linked:not(.vertical) > spinbutton:last-child:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked:not(.vertical) > entry:last-child:not(.flat),
693
notebook > stack:not(:only-child) revealer .linked:not(.vertical) > spinbutton:last-child:not(.flat):not(.vertical), .linked:not(.vertical) >
694
entry:last-child:not(.flat), .linked >
695
button:last-child, combobox.linked button:nth-child(2):dir(ltr), .linked:not(.vertical) > combobox:last-child > box > button.combo {
696
border-top-right-radius: 2px;
697
border-bottom-right-radius: 2px; }
698
.linked:not(.vertical) > spinbutton:only-child:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked:not(.vertical) > entry:only-child:not(.flat),
699
notebook > stack:not(:only-child) revealer .linked:not(.vertical) > spinbutton:only-child:not(.flat):not(.vertical), .linked:not(.vertical) >
700
entry:only-child:not(.flat), .linked >
701
button:only-child, .linked:not(.vertical) > combobox:only-child > box > button.combo {
702
border-radius: 2px; }
703
704
.linked.vertical > spinbutton:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked.vertical > entry:not(.flat),
705
notebook > stack:not(:only-child) revealer .linked.vertical > spinbutton:not(.flat):not(.vertical), .linked.vertical >
706
entry:not(.flat), .linked.vertical >
707
button, .linked.vertical > combobox > box > button.combo {
708
border-radius: 0; }
709
710
.linked.vertical > spinbutton:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked.vertical > entry:not(.flat),
711
notebook > stack:not(:only-child) revealer .linked.vertical > spinbutton:not(.flat):not(.vertical), .linked.vertical >
712
entry:not(.flat), .linked.vertical >
713
button {
714
-gtk-outline-radius: 2px; }
715
.linked.vertical > spinbutton:first-child:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked.vertical > entry:first-child:not(.flat),
716
notebook > stack:not(:only-child) revealer .linked.vertical > spinbutton:first-child:not(.flat):not(.vertical), .linked.vertical >
717
entry:first-child:not(.flat), .linked.vertical >
718
button:first-child, .linked.vertical > combobox:first-child > box > button.combo {
719
border-top-left-radius: 2px;
720
border-top-right-radius: 2px; }
721
.linked.vertical > spinbutton:last-child:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked.vertical > entry:last-child:not(.flat),
722
notebook > stack:not(:only-child) revealer .linked.vertical > spinbutton:last-child:not(.flat):not(.vertical), .linked.vertical >
723
entry:last-child:not(.flat), .linked.vertical >
724
button:last-child, .linked.vertical > combobox:last-child > box > button.combo {
725
border-bottom-left-radius: 2px;
726
border-bottom-right-radius: 2px; }
727
.linked.vertical > spinbutton:only-child:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked.vertical > entry:only-child:not(.flat),
728
notebook > stack:not(:only-child) revealer .linked.vertical > spinbutton:only-child:not(.flat):not(.vertical), .linked.vertical >
729
entry:only-child:not(.flat), .linked.vertical >
730
button:only-child, .linked.vertical > combobox:only-child > box > button.combo {
731
border-radius: 2px; }
732
733
/* menu buttons */
734
modelbutton.flat, popover.background checkbutton,
735
popover.background radiobutton,
736
.menuitem.button.flat {
737
min-height: 28px;
738
padding-left: 8px;
739
padding-right: 8px;
740
border-radius: 2px;
741
color: inherit; }
742
modelbutton.flat check, popover.background checkbutton check,
743
popover.background radiobutton check, modelbutton.flat check:hover, popover.background checkbutton check:hover,
744
popover.background radiobutton check:hover,
745
modelbutton.flat radio,
746
popover.background checkbutton radio,
747
popover.background radiobutton radio,
748
modelbutton.flat radio:hover,
749
popover.background checkbutton radio:hover,
750
popover.background radiobutton radio:hover,
751
.menuitem.button.flat check,
752
.menuitem.button.flat check:hover,
753
.menuitem.button.flat radio,
754
.menuitem.button.flat radio:hover {
755
background-image: none; }
756
modelbutton.flat check:active, popover.background checkbutton check:active,
757
popover.background radiobutton check:active,
758
modelbutton.flat radio:active,
759
popover.background checkbutton radio:active,
760
popover.background radiobutton radio:active,
761
.menuitem.button.flat check:active,
762
.menuitem.button.flat radio:active {
763
animation: none; }
764
modelbutton.flat check:not(:indeterminate):checked:active, popover.background checkbutton check:not(:indeterminate):checked:active,
765
popover.background radiobutton check:not(:indeterminate):checked:active,
766
.menuitem.button.flat check:not(:indeterminate):checked:active {
767
animation: check_check 0.4s cubic-bezier(0.4, 0, 0.2, 1); }
768
modelbutton.flat check:indeterminate:checked:active, popover.background checkbutton check:indeterminate:checked:active,
769
popover.background radiobutton check:indeterminate:checked:active, modelbutton.flat radio:indeterminate:checked:active, popover.background checkbutton radio:indeterminate:checked:active,
770
popover.background radiobutton radio:indeterminate:checked:active,
771
.menuitem.button.flat check:indeterminate:checked:active,
772
.menuitem.button.flat radio:indeterminate:checked:active {
773
animation: check_indeterminate 0.4s cubic-bezier(0.4, 0, 0.2, 1); }
774
modelbutton.flat check:last-child, popover.background checkbutton check:last-child,
775
popover.background radiobutton check:last-child,
776
modelbutton.flat radio:last-child,
777
popover.background checkbutton radio:last-child,
778
popover.background radiobutton radio:last-child,
779
.menuitem.button.flat check:last-child,
780
.menuitem.button.flat radio:last-child {
781
margin-left: 8px; }
782
modelbutton.flat check:first-child, popover.background checkbutton check:first-child,
783
popover.background radiobutton check:first-child,
784
modelbutton.flat radio:first-child,
785
popover.background checkbutton radio:first-child,
786
popover.background radiobutton radio:first-child,
787
.menuitem.button.flat check:first-child,
788
.menuitem.button.flat radio:first-child {
789
margin-right: 8px; }
790
791
modelbutton.flat arrow, popover.background checkbutton arrow,
792
popover.background radiobutton arrow {
793
background: none; }
794
modelbutton.flat arrow:hover, popover.background checkbutton arrow:hover,
795
popover.background radiobutton arrow:hover {
796
background: none; }
797
modelbutton.flat arrow.left, popover.background checkbutton arrow.left,
798
popover.background radiobutton arrow.left {
799
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); }
800
modelbutton.flat arrow.right, popover.background checkbutton arrow.right,
801
popover.background radiobutton arrow.right {
802
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); }
803
804
button.color {
805
min-height: 24px;
806
min-width: 24px;
807
padding: 6px; }
808
809
/*********
810
* Links *
811
*********/
812
*:link, button:link,
813
button:visited, *:link:hover, button:hover:link,
814
button:hover:visited, *:link:active, button:active:link,
815
button:active:visited {
816
color: #00BCD4; }
817
*:link:visited,
818
button:visited, *:link:visited:hover,
819
button:visited:hover, *:link:visited:active,
820
button:visited:active {
821
color: #E040FB; }
822
.info *:link, .info button:link,
823
.info button:visited,
824
.question *:link,
825
.question button:link,
826
.question button:visited,
827
.warning *:link,
828
.warning button:link,
829
.warning button:visited,
830
.error *:link,
831
.error button:link,
832
.error button:visited, *:link:selected, button:selected:link,
833
button:selected:visited, .selection-mode.titlebar:not(headerbar) .subtitle:link,
834
headerbar.selection-mode .subtitle:link, *:selected *:link, *:selected button:link,
835
*:selected button:visited {
836
color: #FFFFFF; }
837
838
button:link > label,
839
button:visited > label {
840
text-decoration-line: underline; }
841
842
/*****************
843
* GtkSpinButton *
844
*****************/
845
spinbutton:not(.vertical) {
846
padding: 0; }
847
notebook > stack:not(:only-child) spinbutton:not(.vertical) entry,
848
spinbutton:not(.vertical) entry {
849
min-width: 32px;
850
margin: 0;
851
border-image: none;
852
border-radius: 0;
853
box-shadow: none;
854
background-color: transparent; }
855
spinbutton:not(.vertical) button {
856
min-height: 24px;
857
min-width: 24px;
858
padding: 0;
859
border: solid 6px transparent; }
860
spinbutton:not(.vertical) button.up {
861
margin-left: -3px; }
862
spinbutton:not(.vertical) button.down {
863
margin-right: -3px; }
864
spinbutton.vertical:disabled {
865
color: rgba(255, 255, 255, 0.4); }
866
spinbutton.vertical:drop(active) {
867
box-shadow: none; }
868
spinbutton.vertical entry {
869
min-height: 36px;
870
min-width: 48px;
871
padding: 0; }
872
spinbutton.vertical button {
873
min-height: 36px;
874
min-width: 48px;
875
padding: 0; }
876
spinbutton.vertical button.up {
877
border-radius: 2px 2px 0 0; }
878
spinbutton.vertical button.down {
879
border-radius: 0 0 2px 2px; }
880
treeview spinbutton:not(.vertical) {
881
min-height: 0;
882
border-style: none;
883
border-radius: 0; }
884
treeview spinbutton:not(.vertical) entry {
885
min-height: 0;
886
padding: 1px 2px; }
887
888
/**************
889
* ComboBoxes *
890
**************/
891
combobox arrow {
892
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
893
min-height: 16px;
894
min-width: 16px; }
895
combobox menu,
896
combobox .menu {
897
padding: 2px 0; }
898
combobox menu menuitem,
899
combobox .menu menuitem {
900
min-height: 36px;
901
padding: 0 10px; }
902
combobox:drop(active) {
903
box-shadow: none; }
904
905
/************
906
* Toolbars *
907
************/
908
toolbar {
909
-GtkWidget-window-dragging: true;
910
padding: 3px;
911
background-color: #37474F; }
912
.osd toolbar {
913
background-color: transparent; }
914
toolbar.osd, .app-notification,
915
.app-notification.frame {
916
padding: 6px;
917
border-radius: 2px;
918
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
919
background-color: #455A64; }
920
toolbar.osd:backdrop, .app-notification:backdrop {
921
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
922
toolbar.osd.left, .left.app-notification, toolbar.osd.right, .right.app-notification, toolbar.osd.top, .top.app-notification, toolbar.osd.bottom, .bottom.app-notification {
923
border-radius: 0; }
924
toolbar.horizontal separator {
925
margin: 3px; }
926
toolbar.vertical separator {
927
margin: 3px; }
928
toolbar:not(.inline-toolbar):not(.osd) scale,
929
toolbar:not(.inline-toolbar):not(.osd) entry,
930
toolbar:not(.inline-toolbar):not(.osd) spinbutton,
931
toolbar:not(.inline-toolbar):not(.osd) button {
932
margin: 3px; }
933
toolbar:not(.inline-toolbar):not(.osd) switch {
934
margin: 9px 3px; }
935
936
.inline-toolbar {
937
padding: 6px;
938
border-style: solid;
939
border-width: 0 1px 1px;
940
border-color: rgba(0, 0, 0, 0.2);
941
background-color: #3e515a; }
942
943
searchbar,
944
.location-bar {
945
padding: 6px;
946
border-style: solid;
947
border-width: 0 0 1px;
948
border-color: rgba(0, 0, 0, 0.2);
949
background-color: #2f3d44;
950
background-clip: border-box; }
951
952
/***************
953
* Header bars *
954
***************/
955
.titlebar:not(headerbar),
956
headerbar {
957
min-height: 48px;
958
padding: 0 6px;
959
border-width: 0 0 1px;
960
border-style: solid;
961
border-color: rgba(0, 0, 0, 0.2);
962
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
963
background-color: #2f3d44;
964
background-clip: border-box; }
965
.titlebar:not(headerbar) .title,
966
headerbar .title {
967
padding-left: 12px;
968
padding-right: 12px;
969
font-weight: bold; }
970
.titlebar:not(headerbar) .subtitle,
971
headerbar .subtitle {
972
padding-left: 12px;
973
padding-right: 12px;
974
font-size: smaller; }
975
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
976
headerbar button:not(.suggested-action):not(.destructive-action) {
977
border-image: radial-gradient(circle farthest-corner at center calc(100% - 1px), #00BCD4 0%, transparent 0%) 0 0 0/0 0 0px; }
978
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
979
headerbar button:not(.suggested-action):not(.destructive-action):checked {
980
border-image: radial-gradient(circle farthest-corner at center calc(100% - 1px), #00BCD4 100%, transparent 0%) 0 0 2/0 0 2px;
981
background-color: transparent;
982
color: #FFFFFF; }
983
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
984
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled {
985
background-color: transparent;
986
color: rgba(255, 255, 255, 0.4); }
987
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled > label,
988
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled > label {
989
color: inherit; }
990
.selection-mode.titlebar:not(headerbar),
991
headerbar.selection-mode {
992
box-shadow: inset 0 1px rgba(255, 255, 255, 0.2);
993
color: #FFFFFF;
994
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0, background-image 0;
995
animation: header_ripple_effect 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards; }
996
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
997
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action) {
998
border-image: radial-gradient(circle farthest-corner at center calc(100% - 1px), #FFFFFF 0%, transparent 0%) 0 0 0/0 0 0px; }
999
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action), .selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):hover, .selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):active, .selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1000
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action),
1001
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):hover,
1002
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):active,
1003
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked {
1004
color: #FFFFFF; }
1005
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled,
1006
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled {
1007
color: rgba(255, 255, 255, 0.4); }
1008
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled > label,
1009
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled > label {
1010
color: inherit; }
1011
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1012
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked {
1013
border-image: radial-gradient(circle farthest-corner at center calc(100% - 1px), #FFFFFF 100%, transparent 0%) 0 0 2/0 0 2px;
1014
color: #FFFFFF; }
1015
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1016
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled {
1017
color: rgba(255, 255, 255, 0.4); }
1018
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled > label,
1019
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled > label {
1020
color: inherit; }
1021
.selection-mode.titlebar:not(headerbar) .selection-menu,
1022
headerbar.selection-mode .selection-menu {
1023
padding-left: 16px;
1024
padding-right: 16px; }
1025
.selection-mode.titlebar:not(headerbar) .selection-menu GtkArrow,
1026
headerbar.selection-mode .selection-menu GtkArrow {
1027
-GtkArrow-arrow-scaling: 1; }
1028
.selection-mode.titlebar:not(headerbar) .selection-menu .arrow,
1029
headerbar.selection-mode .selection-menu .arrow {
1030
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
1031
.tiled .titlebar:not(headerbar), .maximized .titlebar:not(headerbar), .tiled
1032
headerbar, .maximized
1033
headerbar {
1034
border-radius: 0;
1035
box-shadow: none; }
1036
.default-decoration.titlebar:not(headerbar),
1037
headerbar.default-decoration {
1038
min-height: 24px;
1039
padding: 6px;
1040
border-width: 0; }
1041
.default-decoration.titlebar:not(headerbar) button.titlebutton,
1042
headerbar.default-decoration button.titlebutton {
1043
min-height: 24px;
1044
min-width: 24px;
1045
margin: 0;
1046
padding: 0; }
1047
1048
headerbar entry,
1049
headerbar spinbutton,
1050
headerbar button {
1051
margin-top: 6px;
1052
margin-bottom: 6px; }
1053
1054
.titlebar {
1055
border-top-left-radius: 2px;
1056
border-top-right-radius: 2px; }
1057
1058
separator:first-child + headerbar, headerbar:first-child {
1059
border-top-left-radius: 2px; }
1060
.tiled separator:first-child + headerbar, .maximized separator:first-child + headerbar, .tiled headerbar:first-child, .maximized headerbar:first-child {
1061
border-radius: 0; }
1062
headerbar:last-child {
1063
border-top-right-radius: 2px; }
1064
.tiled headerbar:last-child, .maximized headerbar:last-child {
1065
border-radius: 0; }
1066
1067
window.csd > .titlebar:not(headerbar) {
1068
padding: 0;
1069
background-color: transparent;
1070
background-image: none;
1071
border-style: none;
1072
box-shadow: none; }
1073
.titlebar:not(headerbar) > separator {
1074
background-color: #263136; }
1075
1076
/************
1077
* Pathbars *
1078
************/
1079
.path-bar button.text-button, .path-bar button.image-button, .path-bar button {
1080
padding-left: 6px;
1081
padding-right: 6px; }
1082
.path-bar button image {
1083
padding-left: 4px;
1084
padding-right: 4px; }
1085
.path-bar button.slider-button {
1086
padding-left: 0;
1087
padding-right: 0; }
1088
1089
/**************
1090
* Tree Views *
1091
**************/
1092
treeview.view {
1093
-GtkTreeView-grid-line-width: 1;
1094
-GtkTreeView-grid-line-pattern: '';
1095
-GtkTreeView-tree-line-width: 1;
1096
-GtkTreeView-tree-line-pattern: '';
1097
-GtkTreeView-expander-size: 16;
1098
border-left-color: alpha(currentColor, 0.3);
1099
border-top-color: rgba(0, 0, 0, 0.2); }
1100
treeview.view:hover, treeview.view:active, treeview.view:selected {
1101
border-radius: 0; }
1102
treeview.view.separator {
1103
min-height: 5px;
1104
color: rgba(0, 0, 0, 0.2); }
1105
treeview.view:drop(active) {
1106
border-style: solid none;
1107
border-width: 1px;
1108
border-color: #FF4081; }
1109
treeview.view:drop(active).after {
1110
border-top-style: none; }
1111
treeview.view:drop(active).before {
1112
border-bottom-style: none; }
1113
treeview.view.expander {
1114
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1115
-gtk-icon-transform: rotate(-90deg);
1116
color: rgba(255, 255, 255, 0.75); }
1117
treeview.view.expander:dir(rtl) {
1118
-gtk-icon-transform: rotate(90deg); }
1119
treeview.view.expander:checked {
1120
-gtk-icon-transform: unset; }
1121
treeview.view.expander:hover, treeview.view.expander:active {
1122
color: #FFFFFF; }
1123
treeview.view.expander:disabled {
1124
color: rgba(255, 255, 255, 0.3); }
1125
treeview.view.expander:selected {
1126
color: rgba(255, 255, 255, 0.75); }
1127
treeview.view.expander:selected:hover, treeview.view.expander:selected:active {
1128
color: #FFFFFF; }
1129
treeview.view.expander:selected:disabled {
1130
color: rgba(255, 255, 255, 0.3); }
1131
treeview.view.progressbar {
1132
border-style: none none solid;
1133
border-width: 4px;
1134
border-color: #00BCD4;
1135
background-color: transparent;
1136
background-image: none; }
1137
treeview.view.progressbar:selected {
1138
border-color: currentColor; }
1139
treeview.view.trough {
1140
border-style: none none solid;
1141
border-width: 4px;
1142
border-color: rgba(0, 188, 212, 0.3);
1143
background-color: transparent;
1144
background-image: none; }
1145
treeview.view.trough:selected {
1146
border-color: alpha(currentColor, 0.3); }
1147
treeview.view header button {
1148
padding: 2px 6px;
1149
border-style: none solid solid none;
1150
border-width: 1px;
1151
border-color: rgba(0, 0, 0, 0.2);
1152
border-radius: 0;
1153
background-clip: border-box; }
1154
treeview.view header button, treeview.view header button:hover, treeview.view header button:active {
1155
box-shadow: none; }
1156
treeview.view header button, treeview.view header button:disabled {
1157
background-color: #455A64; }
1158
treeview.view header button:last-child {
1159
border-right-style: none; }
1160
treeview.view button.dnd,
1161
treeview.view header.button.dnd {
1162
padding: 2px 6px;
1163
border-style: none solid solid;
1164
border-width: 1px;
1165
border-color: rgba(0, 0, 0, 0.2);
1166
border-radius: 0;
1167
box-shadow: none;
1168
background-color: #455A64;
1169
background-clip: border-box;
1170
color: #00BCD4; }
1171
1172
/*********
1173
* Menus *
1174
*********/
1175
menubar,
1176
.menubar {
1177
-GtkWidget-window-dragging: true;
1178
padding: 0;
1179
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.2);
1180
background-color: #2f3d44; }
1181
menubar > menuitem,
1182
.menubar > menuitem {
1183
min-height: 20px;
1184
padding: 4px 8px;
1185
color: rgba(255, 255, 255, 0.75); }
1186
menubar > menuitem:hover,
1187
.menubar > menuitem:hover {
1188
box-shadow: inset 0 -2px #00BCD4;
1189
color: #FFFFFF; }
1190
menubar > menuitem:disabled,
1191
.menubar > menuitem:disabled {
1192
color: rgba(255, 255, 255, 0.3); }
1193
1194
menu,
1195
.menu {
1196
margin: 4px 0;
1197
padding: 4px 0;
1198
background-color: #455A64;
1199
border: 1px solid rgba(0, 0, 0, 0.2); }
1200
.csd menu, .csd
1201
.menu {
1202
border: none;
1203
border-radius: 2px; }
1204
menu menuitem,
1205
.menu menuitem {
1206
transition: none;
1207
min-height: 20px;
1208
min-width: 40px;
1209
padding: 4px 8px;
1210
font: initial;
1211
text-shadow: none; }
1212
menu menuitem:hover,
1213
.menu menuitem:hover {
1214
background-color: #00BCD4;
1215
color: #FFFFFF; }
1216
menu menuitem:disabled,
1217
.menu menuitem:disabled {
1218
color: rgba(255, 255, 255, 0.4); }
1219
menu menuitem arrow,
1220
.menu menuitem arrow {
1221
min-height: 16px;
1222
min-width: 16px; }
1223
menu menuitem arrow:dir(ltr),
1224
.menu menuitem arrow:dir(ltr) {
1225
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1226
margin-left: 8px; }
1227
menu menuitem arrow:dir(rtl),
1228
.menu menuitem arrow:dir(rtl) {
1229
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl");
1230
margin-right: 8px; }
1231
menu > arrow,
1232
.menu > arrow {
1233
min-height: 16px;
1234
min-width: 16px;
1235
padding: 4px;
1236
border-radius: 0;
1237
background-color: #455A64;
1238
color: rgba(255, 255, 255, 0.75); }
1239
menu > arrow.top,
1240
.menu > arrow.top {
1241
margin-top: -4px;
1242
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
1243
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); }
1244
menu > arrow.bottom,
1245
.menu > arrow.bottom {
1246
margin-bottom: -4px;
1247
border-top: 1px solid rgba(0, 0, 0, 0.2);
1248
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
1249
menu > arrow:hover,
1250
.menu > arrow:hover {
1251
background-image: image(alpha(currentColor, 0.15));
1252
color: #FFFFFF; }
1253
menu > arrow:disabled,
1254
.menu > arrow:disabled {
1255
border-color: transparent;
1256
background-color: transparent;
1257
color: transparent; }
1258
menu separator,
1259
.menu separator {
1260
margin: 4px 0; }
1261
1262
menuitem accelerator {
1263
color: alpha(currentColor, 0.6); }
1264
menuitem check:dir(ltr),
1265
menuitem radio:dir(ltr) {
1266
margin-right: -8px;
1267
margin-left: -16px; }
1268
menuitem check:dir(rtl),
1269
menuitem radio:dir(rtl) {
1270
margin-right: -16px;
1271
margin-left: -8px; }
1272
1273
.csd.popup {
1274
border-radius: 2px; }
1275
1276
/***************
1277
* Popovers *
1278
***************/
1279
popover.background {
1280
padding: 0;
1281
border-radius: 3px;
1282
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
1283
background-color: #3e515a; }
1284
popover.background:backdrop {
1285
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1286
popover.background, .csd popover.background {
1287
border-style: solid;
1288
border-width: 1px;
1289
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3); }
1290
popover.background > list,
1291
popover.background > .view,
1292
popover.background > iconview,
1293
popover.background > toolbar {
1294
border-style: none;
1295
box-shadow: none;
1296
background-color: transparent; }
1297
popover.background separator {
1298
margin: 4px 0; }
1299
popover.background list separator {
1300
margin: 0; }
1301
1302
/*************
1303
* Notebooks *
1304
*************/
1305
notebook > header {
1306
border-width: 1px;
1307
border-color: rgba(0, 0, 0, 0.2);
1308
background-color: #2f3d44;
1309
background-clip: border-box; }
1310
notebook > header.top {
1311
border-bottom-style: solid; }
1312
notebook > header.top > tabs:not(.reorderable-page) {
1313
margin-bottom: -1px; }
1314
notebook > header.top > tabs:not(.reorderable-page) > tab:hover {
1315
box-shadow: inset 0 -2px alpha(currentColor, 0.3); }
1316
notebook > header.top > tabs:not(.reorderable-page) > tab:checked {
1317
box-shadow: inset 0 -2px #00BCD4; }
1318
notebook > header.top > tabs:not(.reorderable-page) > tab.reorderable-page:hover {
1319
box-shadow: inset 0 -1px #263136; }
1320
notebook > header.top > tabs:not(.reorderable-page) > tab.reorderable-page:checked {
1321
box-shadow: inset 0 -1px #263136; }
1322
notebook > header.bottom {
1323
border-top-style: solid; }
1324
notebook > header.bottom > tabs {
1325
margin-top: -1px; }
1326
notebook > header.bottom > tabs > tab:hover {
1327
box-shadow: inset 0 2px alpha(currentColor, 0.3); }
1328
notebook > header.bottom > tabs > tab:checked {
1329
box-shadow: inset 0 2px #00BCD4; }
1330
notebook > header.bottom > tabs > tab.reorderable-page:hover {
1331
box-shadow: inset 0 1px #263136; }
1332
notebook > header.bottom > tabs > tab.reorderable-page:checked {
1333
box-shadow: inset 0 1px #263136; }
1334
notebook > header.left {
1335
border-right-style: solid; }
1336
notebook > header.left > tabs {
1337
margin-right: -1px; }
1338
notebook > header.left > tabs > tab:hover {
1339
box-shadow: inset -2px 0 alpha(currentColor, 0.3); }
1340
notebook > header.left > tabs > tab:checked {
1341
box-shadow: inset -2px 0 #00BCD4; }
1342
notebook > header.left > tabs > tab.reorderable-page:hover {
1343
box-shadow: inset -1px 0 #263136; }
1344
notebook > header.left > tabs > tab.reorderable-page:checked {
1345
box-shadow: inset -1px 0 #263136; }
1346
notebook > header.right {
1347
border-left-style: solid; }
1348
notebook > header.right > tabs {
1349
margin-left: -1px; }
1350
notebook > header.right > tabs > tab:hover {
1351
box-shadow: inset 2px 0 alpha(currentColor, 0.3); }
1352
notebook > header.right > tabs > tab:checked {
1353
box-shadow: inset 2px 0 #00BCD4; }
1354
notebook > header.right > tabs > tab.reorderable-page:hover {
1355
box-shadow: inset 1px 0 #263136; }
1356
notebook > header.right > tabs > tab.reorderable-page:checked {
1357
box-shadow: inset 1px 0 #263136; }
1358
notebook > header.top > tabs > arrow {
1359
border-top-style: none; }
1360
notebook > header.bottom > tabs > arrow {
1361
border-bottom-style: none; }
1362
notebook > header.top > tabs > arrow, notebook > header.bottom > tabs > arrow {
1363
padding-left: 4px;
1364
padding-right: 4px; }
1365
notebook > header.top > tabs > arrow.down, notebook > header.bottom > tabs > arrow.down {
1366
margin-left: -8px;
1367
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); }
1368
notebook > header.top > tabs > arrow.up, notebook > header.bottom > tabs > arrow.up {
1369
margin-right: -8px;
1370
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); }
1371
notebook > header.left > tabs > arrow {
1372
border-left-style: none; }
1373
notebook > header.right > tabs > arrow {
1374
border-right-style: none; }
1375
notebook > header.left > tabs > arrow, notebook > header.right > tabs > arrow {
1376
padding-top: 4px;
1377
padding-bottom: 4px; }
1378
notebook > header.left > tabs > arrow.down, notebook > header.right > tabs > arrow.down {
1379
margin-top: -8px;
1380
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); }
1381
notebook > header.left > tabs > arrow.up, notebook > header.right > tabs > arrow.up {
1382
margin-bottom: -8px;
1383
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
1384
notebook > header > tabs > arrow {
1385
min-height: 16px;
1386
min-width: 16px;
1387
border-radius: 0; }
1388
notebook > header tab {
1389
min-height: 24px;
1390
min-width: 24px;
1391
padding: 6px 12px;
1392
outline-offset: -6px;
1393
border-width: 1px;
1394
border-color: transparent;
1395
color: rgba(255, 255, 255, 0.75);
1396
font-weight: 500; }
1397
notebook > header tab:hover {
1398
color: #FFFFFF; }
1399
notebook > header tab:hover.reorderable-page {
1400
border-color: rgba(0, 0, 0, 0.2);
1401
background-color: #37474F; }
1402
notebook > header tab:disabled {
1403
color: rgba(255, 255, 255, 0.3); }
1404
notebook > header tab:checked {
1405
color: #FFFFFF; }
1406
notebook > header tab:checked:disabled {
1407
color: rgba(255, 255, 255, 0.4); }
1408
notebook > header tab:checked:not(.reorderable-page) {
1409
animation: tab_ripple_effect 0.4s ease-in-out; }
1410
notebook > header tab:checked.reorderable-page {
1411
border-color: rgba(0, 0, 0, 0.2);
1412
background-color: #546E7A; }
1413
notebook > header tab button.flat {
1414
min-width: 24px;
1415
min-height: 24px;
1416
padding: 0; }
1417
notebook > header tab button.flat:last-child {
1418
margin-left: 6px;
1419
margin-right: -6px; }
1420
notebook > header tab button.flat:first-child {
1421
margin-left: -6px;
1422
margin-right: 6px; }
1423
notebook > header.top tabs, notebook > header.bottom tabs {
1424
padding-left: 8px;
1425
padding-right: 8px; }
1426
notebook > header.top tabs:not(:only-child):first-child, notebook > header.bottom tabs:not(:only-child):first-child {
1427
margin-left: 0; }
1428
notebook > header.top tabs:not(:only-child):last-child, notebook > header.bottom tabs:not(:only-child):last-child {
1429
margin-right: 0; }
1430
notebook > header.top tabs tab.reorderable-page, notebook > header.bottom tabs tab.reorderable-page {
1431
margin: 0 -1px;
1432
border-style: none solid; }
1433
notebook > header.left tabs, notebook > header.right tabs {
1434
padding-top: 8px;
1435
padding-bottom: 8px; }
1436
notebook > header.left tabs:not(:only-child):first-child, notebook > header.right tabs:not(:only-child):first-child {
1437
margin-top: 0; }
1438
notebook > header.left tabs:not(:only-child):last-child, notebook > header.right tabs:not(:only-child):last-child {
1439
margin-bottom: 0; }
1440
notebook > header.left tabs tab.reorderable-page, notebook > header.right tabs tab.reorderable-page {
1441
margin: -1px 0;
1442
border-style: solid none; }
1443
notebook > stack:not(:only-child) {
1444
background-color: #455A64; }
1445
1446
/**************
1447
* Scrollbars *
1448
**************/
1449
scrollbar {
1450
background-color: #455A64;
1451
background-clip: border-box; }
1452
* {
1453
-GtkScrollbar-has-backward-stepper: false;
1454
-GtkScrollbar-has-forward-stepper: false; }
1455
scrollbar.top {
1456
border-bottom: 1px solid rgba(0, 0, 0, 0.2); }
1457
scrollbar.bottom {
1458
border-top: 1px solid rgba(0, 0, 0, 0.2); }
1459
scrollbar.left {
1460
border-right: 1px solid rgba(0, 0, 0, 0.2); }
1461
scrollbar.right {
1462
border-left: 1px solid rgba(0, 0, 0, 0.2); }
1463
scrollbar slider {
1464
min-width: 8px;
1465
min-height: 8px;
1466
border: 4px solid transparent;
1467
border-radius: 100px;
1468
background-clip: padding-box;
1469
background-color: rgba(255, 255, 255, 0.6);
1470
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0, margin 0, border-width 0; }
1471
scrollbar slider:hover {
1472
background-color: rgba(255, 255, 255, 0.75); }
1473
scrollbar slider:active {
1474
background-color: #FFFFFF; }
1475
scrollbar slider:disabled {
1476
background-color: rgba(255, 255, 255, 0.24); }
1477
scrollbar.fine-tune slider {
1478
min-width: 4px;
1479
min-height: 4px;
1480
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0, margin 0, border-width 0, min-width 0, min-height 0; }
1481
scrollbar.fine-tune.horizontal slider {
1482
margin: 2px 0; }
1483
scrollbar.fine-tune.vertical slider {
1484
margin: 0 2px; }
1485
scrollbar.overlay-indicator:not(.dragging):not(.hovering) {
1486
border-color: transparent;
1487
background-color: transparent; }
1488
scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider {
1489
min-width: 4px;
1490
min-height: 4px;
1491
margin: 2px;
1492
border: 2px solid rgba(69, 90, 100, 0.3); }
1493
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button {
1494
min-width: 4px;
1495
min-height: 4px;
1496
margin: 2px;
1497
border: 2px solid rgba(69, 90, 100, 0.3);
1498
border-radius: 100px;
1499
background-color: rgba(255, 255, 255, 0.6);
1500
background-clip: padding-box;
1501
-gtk-icon-source: none; }
1502
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled {
1503
background-color: rgba(255, 255, 255, 0.24); }
1504
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider {
1505
min-width: 24px; }
1506
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal button {
1507
min-width: 8px; }
1508
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider {
1509
min-height: 24px; }
1510
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button {
1511
min-height: 8px; }
1512
scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering {
1513
background-color: rgba(69, 90, 100, 0.9); }
1514
scrollbar.horizontal slider {
1515
min-width: 24px; }
1516
scrollbar.vertical slider {
1517
min-height: 24px; }
1518
scrollbar button {
1519
min-width: 16px;
1520
min-height: 16px;
1521
padding: 0;
1522
border-radius: 0; }
1523
scrollbar.vertical button.down {
1524
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
1525
scrollbar.vertical button.up {
1526
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); }
1527
scrollbar.horizontal button.down {
1528
-gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); }
1529
scrollbar.horizontal button.up {
1530
-gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); }
1531
1532
/**********
1533
* Switch *
1534
**********/
1535
switch {
1536
margin: 6px 0;
1537
border: 4px solid transparent;
1538
border-radius: 100px;
1539
background-color: alpha(currentColor, 0.3);
1540
background-clip: padding-box;
1541
font-size: 0; }
1542
switch:disabled {
1543
color: rgba(255, 255, 255, 0.4); }
1544
switch:checked {
1545
background-color: rgba(255, 64, 129, 0.5); }
1546
switch:checked:disabled {
1547
background-color: rgba(255, 64, 129, 0.2);
1548
color: rgba(255, 255, 255, 0.4); }
1549
switch slider {
1550
min-width: 24px;
1551
min-height: 24px;
1552
margin: -4px 0 -4px -4px;
1553
-gtk-outline-radius: 100px;
1554
border-radius: 100px;
1555
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(transparent), to(transparent));
1556
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0, margin 0;
1557
border-image: none;
1558
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1559
background-color: #455A64;
1560
color: #FFFFFF; }
1561
switch:hover slider {
1562
border-image: none;
1563
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1564
switch:disabled slider {
1565
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1566
background-color: #3e515a;
1567
color: rgba(255, 255, 255, 0.4); }
1568
switch:checked slider {
1569
margin: -4px -4px -4px 0;
1570
color: #FFFFFF;
1571
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0, margin 0, background-image 0;
1572
animation: needs_attention 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards; }
1573
switch:checked:disabled slider {
1574
animation: none; }
1575
1576
/*************************
1577
* Check and Radio items *
1578
*************************/
1579
.view.content-view.check:not(list), iconview.content-view.check:not(list) {
1580
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1581
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-selectionmode.png"), url("assets/checkbox-selectionmode@2.png"));
1582
margin: 8px;
1583
background-color: transparent; }
1584
.view.content-view.check:not(list):hover, iconview.content-view.check:not(list):hover, .view.content-view.check:not(list):active, iconview.content-view.check:not(list):active {
1585
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1586
.view.content-view.check:not(list):disabled, iconview.content-view.check:not(list):disabled {
1587
-gtk-icon-shadow: none; }
1588
1589
.view.content-view.check:active:not(list), iconview.content-view.check:active:not(list) {
1590
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1591
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-active-selectionmode.png"), url("assets/checkbox-active-selectionmode@2.png"));
1592
margin: 8px;
1593
background-color: transparent; }
1594
.view.content-view.check:active:not(list):hover, iconview.content-view.check:active:not(list):hover, .view.content-view.check:active:not(list):active, iconview.content-view.check:active:not(list):active {
1595
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1596
.view.content-view.check:active:not(list):disabled, iconview.content-view.check:active:not(list):disabled {
1597
-gtk-icon-shadow: none; }
1598
1599
.view.content-view.check:disabled:not(list), iconview.content-view.check:disabled:not(list) {
1600
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1601
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-insensitive-selectionmode.png"), url("assets/checkbox-insensitive-selectionmode@2.png"));
1602
margin: 8px;
1603
background-color: transparent; }
1604
.view.content-view.check:disabled:not(list):hover, iconview.content-view.check:disabled:not(list):hover, .view.content-view.check:disabled:not(list):active, iconview.content-view.check:disabled:not(list):active {
1605
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1606
.view.content-view.check:disabled:not(list):disabled, iconview.content-view.check:disabled:not(list):disabled {
1607
-gtk-icon-shadow: none; }
1608
1609
.view.content-view.check:checked:not(list), iconview.content-view.check:checked:not(list) {
1610
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1611
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-selectionmode.png"), url("assets/checkbox-checked-selectionmode@2.png"));
1612
margin: 8px;
1613
background-color: transparent; }
1614
.view.content-view.check:checked:not(list):hover, iconview.content-view.check:checked:not(list):hover, .view.content-view.check:checked:not(list):active, iconview.content-view.check:checked:not(list):active {
1615
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1616
.view.content-view.check:checked:not(list):disabled, iconview.content-view.check:checked:not(list):disabled {
1617
-gtk-icon-shadow: none; }
1618
1619
.view.content-view.check:checked:active:not(list), iconview.content-view.check:checked:active:not(list) {
1620
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1621
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-active-selectionmode.png"), url("assets/checkbox-checked-active-selectionmode@2.png"));
1622
margin: 8px;
1623
background-color: transparent; }
1624
.view.content-view.check:checked:active:not(list):hover, iconview.content-view.check:checked:active:not(list):hover, .view.content-view.check:checked:active:not(list):active, iconview.content-view.check:checked:active:not(list):active {
1625
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1626
.view.content-view.check:checked:active:not(list):disabled, iconview.content-view.check:checked:active:not(list):disabled {
1627
-gtk-icon-shadow: none; }
1628
1629
.view.content-view.check:disabled:checked:not(list), iconview.content-view.check:disabled:checked:not(list) {
1630
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1631
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-insensitive-selectionmode.png"), url("assets/checkbox-checked-insensitive-selectionmode@2.png"));
1632
margin: 8px;
1633
background-color: transparent; }
1634
.view.content-view.check:disabled:checked:not(list):hover, iconview.content-view.check:disabled:checked:not(list):hover, .view.content-view.check:disabled:checked:not(list):active, iconview.content-view.check:disabled:checked:not(list):active {
1635
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1636
.view.content-view.check:disabled:checked:not(list):disabled, iconview.content-view.check:disabled:checked:not(list):disabled {
1637
-gtk-icon-shadow: none; }
1638
1639
checkbutton.text-button, radiobutton.text-button {
1640
padding: 2px 0;
1641
outline-offset: 0; }
1642
checkbutton.text-button label:not(:only-child):first-child, radiobutton.text-button label:not(:only-child):first-child {
1643
margin-left: 4px; }
1644
checkbutton.text-button label:not(:only-child):last-child, radiobutton.text-button label:not(:only-child):last-child {
1645
margin-right: 4px; }
1646
1647
check,
1648
radio {
1649
min-height: 24px;
1650
min-width: 24px;
1651
-gtk-icon-source: none;
1652
margin: -12px -8px;
1653
padding: 12px;
1654
outline-offset: 4px;
1655
color: alpha(currentColor, 0.75); }
1656
check:hover, check:active,
1657
radio:hover,
1658
radio:active {
1659
color: currentColor; }
1660
check:checked, check:checked:disabled,
1661
radio:checked,
1662
radio:checked:disabled {
1663
background-color: transparent; }
1664
check:checked, check:indeterminate,
1665
radio:checked,
1666
radio:indeterminate {
1667
color: #FF4081; }
1668
check:checked:disabled, check:indeterminate:disabled,
1669
radio:checked:disabled,
1670
radio:indeterminate:disabled {
1671
color: rgba(255, 64, 129, 0.4); }
1672
check:only-child,
1673
radio:only-child {
1674
margin: -12px; }
1675
menu menuitem check, menu menuitem
1676
radio {
1677
margin: -16px -16px;
1678
transition: none; }
1679
menu menuitem check:not(:checked):not(:indeterminate):hover, menu menuitem
1680
radio:not(:checked):not(:indeterminate):hover {
1681
color: alpha(currentColor, 0.75); }
1682
menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem
1683
radio, menu menuitem
1684
radio:hover, menu menuitem
1685
radio:disabled {
1686
background-image: none; }
1687
1688
check {
1689
-gtk-icon-source: image(-gtk-recolor(url("assets/check-unchecked-symbolic.svg")), -gtk-recolor(url("assets/check-unchecked-symbolic.png"))); }
1690
check:checked {
1691
-gtk-icon-source: image(-gtk-recolor(url("assets/check-checked-symbolic.svg")), -gtk-recolor(url("assets/check-checked-symbolic.png"))); }
1692
check:indeterminate {
1693
-gtk-icon-source: image(-gtk-recolor(url("assets/check-dash-symbolic.svg")), -gtk-recolor(url("assets/check-dash-symbolic.png"))); }
1694
1695
radio {
1696
border-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent)) 24/24px;
1697
-gtk-icon-source: image(-gtk-recolor(url("assets/radio-unchecked-symbolic.svg")), -gtk-recolor(url("assets/radio-unchecked-symbolic.png"))); }
1698
radio:checked {
1699
border-image: -gtk-gradient(radial, center center, 0, center center, 0.10417, to(#FF4081), to(transparent)) 24/24px; }
1700
radio:checked:disabled {
1701
border-image: -gtk-gradient(radial, center center, 0, center center, 0.10417, to(rgba(255, 64, 129, 0.4)), to(transparent)) 24/24px; }
1702
radio:indeterminate {
1703
-gtk-icon-source: image(-gtk-recolor(url("assets/radio-dash-symbolic.svg")), -gtk-recolor(url("assets/radio-dash-symbolic.png"))); }
1704
radio:indeterminate:checked {
1705
border-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent)) 24/24px; }
1706
1707
@keyframes check_check {
1708
from {
1709
-gtk-icon-transform: rotate(90deg); }
1710
to {
1711
-gtk-icon-transform: unset; } }
1712
@keyframes check_radio {
1713
from {
1714
-gtk-icon-transform: scale(0); }
1715
to {
1716
-gtk-icon-transform: unset; } }
1717
@keyframes check_indeterminate {
1718
from {
1719
-gtk-icon-transform: unset; }
1720
50% {
1721
-gtk-icon-transform: scale(0, 1); }
1722
to {
1723
-gtk-icon-transform: unset; } }
1724
check:not(:indeterminate):checked {
1725
animation: check_check 0.4s cubic-bezier(0.4, 0, 0.2, 1); }
1726
1727
check:not(:indeterminate):checked:active {
1728
animation: check_check 0.4s cubic-bezier(0.4, 0, 0.2, 1), flat_ripple_effect 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards; }
1729
1730
check:indeterminate:checked, radio:indeterminate:checked {
1731
animation: check_indeterminate 0.4s cubic-bezier(0.4, 0, 0.2, 1); }
1732
1733
check:indeterminate:checked:active, radio:indeterminate:checked:active {
1734
animation: check_indeterminate 0.4s cubic-bezier(0.4, 0, 0.2, 1), flat_ripple_effect 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards; }
1735
1736
menu menuitem check:not(:indeterminate):checked,
1737
menu menuitem radio:not(:indeterminate):checked,
1738
menu menuitem check:indeterminate:checked,
1739
menu menuitem radio:indeterminate:checked {
1740
animation: none; }
1741
1742
treeview.view check,
1743
treeview.view radio {
1744
padding: 0; }
1745
treeview.view check:checked:hover, treeview.view check:selected:checked:hover,
1746
treeview.view radio:checked:hover,
1747
treeview.view radio:selected:checked:hover {
1748
background-image: none; }
1749
treeview.view check,
1750
treeview.view radio {
1751
color: rgba(255, 255, 255, 0.75); }
1752
treeview.view check:hover, treeview.view check:active,
1753
treeview.view radio:hover,
1754
treeview.view radio:active {
1755
color: #FFFFFF; }
1756
treeview.view check:disabled,
1757
treeview.view radio:disabled {
1758
color: rgba(255, 255, 255, 0.3); }
1759
treeview.view check:checked, treeview.view check:indeterminate,
1760
treeview.view radio:checked,
1761
treeview.view radio:indeterminate {
1762
color: #FF4081; }
1763
treeview.view check:checked:disabled, treeview.view check:indeterminate:disabled,
1764
treeview.view radio:checked:disabled,
1765
treeview.view radio:indeterminate:disabled {
1766
color: rgba(255, 64, 129, 0.4); }
1767
treeview.view check:selected,
1768
treeview.view radio:selected {
1769
color: rgba(255, 255, 255, 0.75); }
1770
treeview.view check:selected:hover, treeview.view check:selected:active,
1771
treeview.view radio:selected:hover,
1772
treeview.view radio:selected:active {
1773
color: #FFFFFF; }
1774
treeview.view check:selected:disabled,
1775
treeview.view radio:selected:disabled {
1776
color: rgba(255, 255, 255, 0.3); }
1777
treeview.view check:selected:checked, treeview.view check:selected:indeterminate,
1778
treeview.view radio:selected:checked,
1779
treeview.view radio:selected:indeterminate {
1780
color: #FF4081; }
1781
treeview.view check:selected:checked:disabled, treeview.view check:selected:indeterminate:disabled,
1782
treeview.view radio:selected:checked:disabled,
1783
treeview.view radio:selected:indeterminate:disabled {
1784
color: rgba(255, 64, 129, 0.4); }
1785
1786
treeview.view radio:checked {
1787
-gtk-icon-source: image(-gtk-recolor(url("assets/radio-checked-symbolic.svg")), -gtk-recolor(url("assets/radio-checked-symbolic.png")));
1788
border-image: none; }
1789
1790
/************
1791
* GtkScale *
1792
************/
1793
scale {
1794
min-height: 12px;
1795
min-width: 12px;
1796
padding: 12px; }
1797
scale slider {
1798
min-height: 24px;
1799
min-width: 24px;
1800
margin: -10px; }
1801
scale trough {
1802
outline-offset: 2px;
1803
background-color: alpha(currentColor, 0.3); }
1804
scale trough:disabled {
1805
color: rgba(255, 255, 255, 0.4); }
1806
scale highlight {
1807
background-color: #FF4081; }
1808
scale highlight:disabled {
1809
background-color: transparent; }
1810
scale fill {
1811
background-color: alpha(currentColor, 0.3); }
1812
scale fill:disabled {
1813
background-color: transparent; }
1814
scale slider {
1815
background-repeat: no-repeat;
1816
background-position: center;
1817
background-size: calc(100% - 8px); }
1818
scale slider {
1819
background-image: -gtk-scaled(url("assets/slider-dark.png"), url("assets/slider-dark@2.png")); }
1820
scale slider:disabled {
1821
background-image: -gtk-scaled(url("assets/slider-insensitive-dark.png"), url("assets/slider-insensitive-dark@2.png")); }
1822
scale slider:hover {
1823
background-size: calc(100% - 4px); }
1824
scale slider:active {
1825
background-size: calc(100% - 0px); }
1826
scale.fine-tune slider {
1827
background-size: calc(100% - 12px); }
1828
scale value {
1829
color: alpha(currentColor, 0.6); }
1830
scale marks {
1831
color: alpha(currentColor, 0.3); }
1832
scale marks.top {
1833
margin-bottom: 8px;
1834
margin-top: -16px; }
1835
scale marks.bottom {
1836
margin-top: 8px;
1837
margin-bottom: -16px; }
1838
scale marks.top {
1839
margin-right: 8px;
1840
margin-left: -16px; }
1841
scale marks.bottom {
1842
margin-left: 8px;
1843
margin-right: -16px; }
1844
scale.horizontal indicator {
1845
min-height: 8px;
1846
min-width: 1px; }
1847
scale.vertical indicator {
1848
min-height: 1px;
1849
min-width: 8px; }
1850
scale.color.horizontal slider,
1851
scale.horizontal contents:last-child:not(:only-child) > trough > slider {
1852
min-height: 30px;
1853
min-width: 24px;
1854
margin-top: -16px;
1855
background-position: center calc(100% - 4px); }
1856
scale.color.horizontal slider,
1857
scale.horizontal contents:last-child:not(:only-child) > trough > slider {
1858
background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-dark.png"), url("assets/slider-horz-scale-has-marks-above-dark@2.png")); }
1859
scale.color.horizontal slider:hover,
1860
scale.horizontal contents:last-child:not(:only-child) > trough > slider:hover {
1861
background-position: center calc(100% - 2px); }
1862
scale.color.horizontal slider:active,
1863
scale.horizontal contents:last-child:not(:only-child) > trough > slider:active {
1864
background-position: center calc(100% - 0px); }
1865
scale.color.fine-tune.horizontal slider, scale.horizontal.fine-tune contents:last-child:not(:only-child) > trough > slider {
1866
background-position: center calc(100% - 6px); }
1867
scale.color.horizontal slider,
1868
scale.horizontal contents:last-child:not(:only-child) > trough > slider {
1869
min-height: 30px;
1870
min-width: 24px;
1871
margin-top: -16px;
1872
background-position: center calc(100% - 4px); }
1873
scale.color.horizontal slider:disabled,
1874
scale.horizontal contents:last-child:not(:only-child) > trough > slider:disabled {
1875
background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-insensitive-dark.png"), url("assets/slider-horz-scale-has-marks-above-insensitive-dark@2.png")); }
1876
scale.color.horizontal slider:hover,
1877
scale.horizontal contents:last-child:not(:only-child) > trough > slider:hover {
1878
background-position: center calc(100% - 2px); }
1879
scale.color.horizontal slider:active,
1880
scale.horizontal contents:last-child:not(:only-child) > trough > slider:active {
1881
background-position: center calc(100% - 0px); }
1882
scale.color.fine-tune.horizontal slider, scale.horizontal.fine-tune contents:last-child:not(:only-child) > trough > slider {
1883
background-position: center calc(100% - 6px); }
1884
scale.horizontal contents:first-child:not(:only-child) > trough > slider {
1885
min-height: 30px;
1886
min-width: 24px;
1887
margin-bottom: -16px;
1888
background-position: center calc(4px); }
1889
scale.horizontal contents:first-child:not(:only-child) > trough > slider {
1890
background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below-dark.png"), url("assets/slider-horz-scale-has-marks-below-dark@2.png")); }
1891
scale.horizontal contents:first-child:not(:only-child) > trough > slider:hover {
1892
background-position: center calc(2px); }
1893
scale.horizontal contents:first-child:not(:only-child) > trough > slider:active {
1894
background-position: center calc(0px); }
1895
scale.horizontal.fine-tune contents:first-child:not(:only-child) > trough > slider {
1896
background-position: center calc(6px); }
1897
scale.horizontal contents:first-child:not(:only-child) > trough > slider {
1898
min-height: 30px;
1899
min-width: 24px;
1900
margin-bottom: -16px;
1901
background-position: center calc(4px); }
1902
scale.horizontal contents:first-child:not(:only-child) > trough > slider:disabled {
1903
background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below-insensitive-dark.png"), url("assets/slider-horz-scale-has-marks-below-insensitive-dark@2.png")); }
1904
scale.horizontal contents:first-child:not(:only-child) > trough > slider:hover {
1905
background-position: center calc(2px); }
1906
scale.horizontal contents:first-child:not(:only-child) > trough > slider:active {
1907
background-position: center calc(0px); }
1908
scale.horizontal.fine-tune contents:first-child:not(:only-child) > trough > slider {
1909
background-position: center calc(6px); }
1910
scale.color.vertical:dir(rtl) slider,
1911
scale.vertical contents:last-child:not(:only-child) > trough > slider {
1912
min-height: 24px;
1913
min-width: 30px;
1914
margin-left: -16px;
1915
background-position: calc(4px) center; }
1916
scale.color.vertical:dir(rtl) slider,
1917
scale.vertical contents:last-child:not(:only-child) > trough > slider {
1918
background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above-dark.png"), url("assets/slider-vert-scale-has-marks-above-dark@2.png")); }
1919
scale.color.vertical:dir(rtl) slider:hover,
1920
scale.vertical contents:last-child:not(:only-child) > trough > slider:hover {
1921
background-position: calc(2px) center; }
1922
scale.color.vertical:dir(rtl) slider:active,
1923
scale.vertical contents:last-child:not(:only-child) > trough > slider:active {
1924
background-position: calc(0px) center; }
1925
scale.color.fine-tune.vertical:dir(rtl) slider, scale.vertical.fine-tune contents:last-child:not(:only-child) > trough > slider {
1926
background-position: calc(6px) center; }
1927
scale.color.vertical:dir(rtl) slider,
1928
scale.vertical contents:last-child:not(:only-child) > trough > slider {
1929
min-height: 24px;
1930
min-width: 30px;
1931
margin-left: -16px;
1932
background-position: calc(4px) center; }
1933
scale.color.vertical:dir(rtl) slider:disabled,
1934
scale.vertical contents:last-child:not(:only-child) > trough > slider:disabled {
1935
background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above-insensitive-dark.png"), url("assets/slider-vert-scale-has-marks-above-insensitive-dark@2.png")); }
1936
scale.color.vertical:dir(rtl) slider:hover,
1937
scale.vertical contents:last-child:not(:only-child) > trough > slider:hover {
1938
background-position: calc(2px) center; }
1939
scale.color.vertical:dir(rtl) slider:active,
1940
scale.vertical contents:last-child:not(:only-child) > trough > slider:active {
1941
background-position: calc(0px) center; }
1942
scale.color.fine-tune.vertical:dir(rtl) slider, scale.vertical.fine-tune contents:last-child:not(:only-child) > trough > slider {
1943
background-position: calc(6px) center; }
1944
scale.color.vertical:dir(ltr) slider,
1945
scale.vertical contents:first-child:not(:only-child) > trough > slider {
1946
min-height: 24px;
1947
min-width: 30px;
1948
margin-right: -16px;
1949
background-position: calc(100% - 4px) center; }
1950
scale.color.vertical:dir(ltr) slider,
1951
scale.vertical contents:first-child:not(:only-child) > trough > slider {
1952
background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below-dark.png"), url("assets/slider-vert-scale-has-marks-below-dark@2.png")); }
1953
scale.color.vertical:dir(ltr) slider:hover,
1954
scale.vertical contents:first-child:not(:only-child) > trough > slider:hover {
1955
background-position: calc(100% - 2px) center; }
1956
scale.color.vertical:dir(ltr) slider:active,
1957
scale.vertical contents:first-child:not(:only-child) > trough > slider:active {
1958
background-position: calc(100% - 0px) center; }
1959
scale.color.fine-tune.vertical:dir(ltr) slider, scale.vertical.fine-tune contents:first-child:not(:only-child) > trough > slider {
1960
background-position: calc(100% - 6px) center; }
1961
scale.color.vertical:dir(ltr) slider,
1962
scale.vertical contents:first-child:not(:only-child) > trough > slider {
1963
min-height: 24px;
1964
min-width: 30px;
1965
margin-right: -16px;
1966
background-position: calc(100% - 4px) center; }
1967
scale.color.vertical:dir(ltr) slider:disabled,
1968
scale.vertical contents:first-child:not(:only-child) > trough > slider:disabled {
1969
background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below-insensitive-dark.png"), url("assets/slider-vert-scale-has-marks-below-insensitive-dark@2.png")); }
1970
scale.color.vertical:dir(ltr) slider:hover,
1971
scale.vertical contents:first-child:not(:only-child) > trough > slider:hover {
1972
background-position: calc(100% - 2px) center; }
1973
scale.color.vertical:dir(ltr) slider:active,
1974
scale.vertical contents:first-child:not(:only-child) > trough > slider:active {
1975
background-position: calc(100% - 0px) center; }
1976
scale.color.fine-tune.vertical:dir(ltr) slider, scale.vertical.fine-tune contents:first-child:not(:only-child) > trough > slider {
1977
background-position: calc(100% - 6px) center; }
1978
scale.color {
1979
min-height: 0;
1980
min-width: 0; }
1981
scale.color.horizontal {
1982
padding: 0 0 12px 0; }
1983
scale.color.horizontal trough {
1984
padding-bottom: 4px; }
1985
scale.color.horizontal slider {
1986
margin-bottom: -14px;
1987
margin-top: 0; }
1988
scale.color.vertical:dir(ltr) {
1989
padding: 0 0 0 12px; }
1990
scale.color.vertical:dir(ltr) trough {
1991
padding-left: 4px; }
1992
scale.color.vertical:dir(ltr) slider {
1993
margin-left: -14px;
1994
margin-right: 0; }
1995
scale.color.vertical:dir(rtl) {
1996
padding: 0 12px 0 0; }
1997
scale.color.vertical:dir(rtl) trough {
1998
padding-right: 4px; }
1999
scale.color.vertical:dir(rtl) slider {
2000
margin-right: -14px;
2001
margin-left: 0; }
2002
2003
/*****************
2004
* Progress bars *
2005
*****************/
2006
progressbar {
2007
color: rgba(255, 255, 255, 0.6);
2008
font-size: smaller; }
2009
progressbar.horizontal trough,
2010
progressbar.horizontal progress {
2011
min-height: 4px; }
2012
progressbar.vertical trough,
2013
progressbar.vertical progress {
2014
min-width: 4px; }
2015
progressbar trough {
2016
background-color: rgba(0, 188, 212, 0.3); }
2017
progressbar progress {
2018
background-color: #00BCD4; }
2019
2020
/*************
2021
* Level Bar *
2022
*************/
2023
levelbar block {
2024
min-width: 36px;
2025
min-height: 4px; }
2026
levelbar.vertical block {
2027
min-width: 4px;
2028
min-height: 36px; }
2029
levelbar trough {
2030
padding: 2px;
2031
border-radius: 2px;
2032
border-image: none;
2033
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2034
background-color: #455A64;
2035
color: #FFFFFF; }
2036
levelbar trough:disabled {
2037
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2038
background-color: #3e515a;
2039
color: rgba(255, 255, 255, 0.4); }
2040
levelbar.horizontal.discrete block {
2041
margin: 0 1px; }
2042
levelbar.vertical.discrete block {
2043
margin: 1px 0; }
2044
levelbar.horizontal.discrete trough {
2045
padding: 2px 1px; }
2046
levelbar.vertical.discrete trough {
2047
padding: 1px 2px; }
2048
levelbar block.low {
2049
background-color: #FF6D00; }
2050
levelbar block.high {
2051
background-color: #00BCD4; }
2052
levelbar block.full {
2053
background-color: #00C853; }
2054
levelbar block.empty {
2055
background-color: alpha(currentColor, 0.3);
2056
color: rgba(255, 255, 255, 0.4); }
2057
2058
/****************
2059
* Print dialog *
2060
*****************/
2061
printdialog paper {
2062
padding: 0;
2063
border: 1px solid rgba(0, 0, 0, 0.2);
2064
background: #455A64;
2065
color: #FFFFFF; }
2066
printdialog .dialog-action-box {
2067
margin: 12px; }
2068
2069
/**********
2070
* Frames *
2071
**********/
2072
frame > border,
2073
.frame {
2074
margin: 0;
2075
padding: 0;
2076
border: 1px solid rgba(0, 0, 0, 0.2);
2077
border-radius: 0;
2078
box-shadow: none; }
2079
frame > border.flat,
2080
.frame.flat {
2081
border-style: none; }
2082
2083
actionbar > revealer > box {
2084
padding: 6px;
2085
border-top: 1px solid rgba(0, 0, 0, 0.2); }
2086
2087
scrolledwindow viewport.frame {
2088
border-style: none; }
2089
scrolledwindow overshoot.top {
2090
background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(0, 229, 255, 0.3)), to(transparent));
2091
background-repeat: no-repeat;
2092
background-position: center top;
2093
background-color: transparent;
2094
border: none;
2095
box-shadow: none; }
2096
scrolledwindow overshoot.bottom {
2097
background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(0, 229, 255, 0.3)), to(transparent));
2098
background-repeat: no-repeat;
2099
background-position: center bottom;
2100
background-color: transparent;
2101
border: none;
2102
box-shadow: none; }
2103
scrolledwindow overshoot.left {
2104
background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(0, 229, 255, 0.3)), to(transparent));
2105
background-repeat: no-repeat;
2106
background-position: left center;
2107
background-color: transparent;
2108
border: none;
2109
box-shadow: none; }
2110
scrolledwindow overshoot.right {
2111
background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(0, 229, 255, 0.3)), to(transparent));
2112
background-repeat: no-repeat;
2113
background-position: right center;
2114
background-color: transparent;
2115
border: none;
2116
box-shadow: none; }
2117
scrolledwindow undershoot.top {
2118
background-color: transparent;
2119
background-image: linear-gradient(to left, rgba(69, 90, 100, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
2120
padding-top: 0;
2121
background-size: 16px 2px;
2122
background-repeat: repeat-x;
2123
background-origin: content-box;
2124
background-position: center top; }
2125
scrolledwindow undershoot.bottom {
2126
background-color: transparent;
2127
background-image: linear-gradient(to left, rgba(69, 90, 100, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
2128
padding-bottom: 0;
2129
background-size: 16px 2px;
2130
background-repeat: repeat-x;
2131
background-origin: content-box;
2132
background-position: center bottom; }
2133
scrolledwindow undershoot.left {
2134
background-color: transparent;
2135
background-image: linear-gradient(to top, rgba(69, 90, 100, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
2136
padding-left: 0;
2137
background-size: 2px 16px;
2138
background-repeat: repeat-y;
2139
background-origin: content-box;
2140
background-position: left center; }
2141
scrolledwindow undershoot.right {
2142
background-color: transparent;
2143
background-image: linear-gradient(to top, rgba(69, 90, 100, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
2144
padding-right: 0;
2145
background-size: 2px 16px;
2146
background-repeat: repeat-y;
2147
background-origin: content-box;
2148
background-position: right center; }
2149
scrolledwindow junction {
2150
border-style: solid none none solid;
2151
border-width: 1px;
2152
border-color: rgba(0, 0, 0, 0.2);
2153
background-color: #455A64; }
2154
scrolledwindow junction:dir(rtl) {
2155
border-style: solid solid none none; }
2156
2157
separator {
2158
min-width: 1px;
2159
min-height: 1px;
2160
background: rgba(0, 0, 0, 0.2); }
2161
2162
/*********
2163
* Lists *
2164
*********/
2165
list {
2166
border-color: rgba(0, 0, 0, 0.2);
2167
background-color: #455A64; }
2168
list row {
2169
padding: 2px; }
2170
2171
row:hover {
2172
transition: none; }
2173
row.activatable, .view, iconview, treeview.view header button {
2174
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0) 100%, transparent 0%), image(alpha(currentColor, 0)); }
2175
row.activatable:hover, .view:hover, iconview:hover, treeview.view header button:hover {
2176
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0) 100%, transparent 0%), image(alpha(currentColor, 0.05)); }
2177
row.activatable.has-open-popup, .has-open-popup.view, iconview.has-open-popup, treeview.view header button.has-open-popup, row.activatable:active, .view:active, iconview:active, treeview.view header button:active {
2178
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0, background-image 0;
2179
animation: row_ripple_effect 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards; }
2180
2181
/*********************
2182
* App Notifications *
2183
*********************/
2184
.app-notification,
2185
.app-notification.frame {
2186
margin: 8px; }
2187
.app-notification border,
2188
.app-notification.frame border {
2189
border: none; }
2190
2191
/*************
2192
* Expanders *
2193
*************/
2194
expander arrow {
2195
min-width: 16px;
2196
min-height: 16px;
2197
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
2198
-gtk-icon-transform: rotate(-90deg);
2199
color: rgba(255, 255, 255, 0.75); }
2200
expander arrow:dir(rtl) {
2201
-gtk-icon-transform: rotate(90deg); }
2202
expander arrow:checked {
2203
-gtk-icon-transform: unset; }
2204
expander arrow:hover, expander arrow:active {
2205
color: #FFFFFF; }
2206
expander arrow:disabled {
2207
color: rgba(255, 255, 255, 0.3); }
2208
expander arrow:selected {
2209
color: rgba(255, 255, 255, 0.75); }
2210
expander arrow:selected:hover, expander arrow:selected:active {
2211
color: #FFFFFF; }
2212
expander arrow:selected:disabled {
2213
color: rgba(255, 255, 255, 0.3); }
2214
2215
/************
2216
* Calendar *
2217
***********/
2218
calendar {
2219
padding: 1px;
2220
border: 1px solid rgba(0, 0, 0, 0.2);
2221
color: #FFFFFF; }
2222
calendar:disabled {
2223
color: rgba(255, 255, 255, 0.4); }
2224
calendar:selected {
2225
border-radius: 3px; }
2226
calendar.header {
2227
border: none;
2228
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
2229
border-radius: 0; }
2230
calendar:indeterminate {
2231
color: alpha(currentColor, 0.4); }
2232
calendar.highlight {
2233
color: alpha(currentColor, 0.6);
2234
font-weight: 500; }
2235
2236
/***********
2237
* Dialogs *
2238
***********/
2239
messagedialog.background {
2240
background-color: #546E7A; }
2241
messagedialog .titlebar {
2242
min-height: 24px;
2243
border-style: none;
2244
background-color: #546E7A; }
2245
messagedialog.csd.background {
2246
border-bottom-left-radius: 2px;
2247
border-bottom-right-radius: 2px; }
2248
messagedialog.csd .dialog-action-area button {
2249
padding: 8px 16px;
2250
border-top: 1px solid rgba(0, 0, 0, 0.2);
2251
border-radius: 0; }
2252
messagedialog.csd .dialog-action-area button:first-child {
2253
border-bottom-left-radius: 2px; }
2254
messagedialog.csd .dialog-action-area button:last-child {
2255
border-bottom-right-radius: 2px; }
2256
2257
filechooser .dialog-action-box {
2258
border-top: 1px solid rgba(0, 0, 0, 0.2); }
2259
filechooser #pathbarbox {
2260
border-bottom: 1px solid rgba(0, 0, 0, 0.2); }
2261
2262
filechooserbutton:drop(active) {
2263
box-shadow: none; }
2264
2265
/***********
2266
* Sidebar *
2267
***********/
2268
.sidebar {
2269
border-style: none;
2270
background-color: #3e515a; }
2271
stacksidebar.sidebar:dir(ltr) list, stacksidebar.sidebar.left list, stacksidebar.sidebar.left:dir(rtl) list, .sidebar:dir(ltr), .sidebar.left, .sidebar.left:dir(rtl) {
2272
border-right: 1px solid rgba(0, 0, 0, 0.2);
2273
border-left-style: none; }
2274
stacksidebar.sidebar:dir(rtl) list
2275
.sidebar:dir(rtl), stacksidebar.sidebar.right list
2276
.sidebar:dir(rtl), .sidebar.right {
2277
border-left: 1px solid rgba(0, 0, 0, 0.2);
2278
border-right-style: none; }
2279
.sidebar list {
2280
background-color: transparent; }
2281
paned .sidebar.left, paned .sidebar.right, paned .sidebar.left:dir(rtl), paned .sidebar:dir(rtl), paned .sidebar:dir(ltr), paned .sidebar {
2282
border-style: none; }
2283
2284
stacksidebar row {
2285
padding: 10px 4px; }
2286
stacksidebar row > label {
2287
padding-left: 6px;
2288
padding-right: 6px; }
2289
2290
/****************
2291
* File chooser *
2292
****************/
2293
placessidebar > viewport.frame {
2294
border-style: none; }
2295
placessidebar row {
2296
min-height: 32px;
2297
padding: 0; }
2298
placessidebar row > revealer {
2299
padding: 0 12px; }
2300
placessidebar row:selected {
2301
color: #FFFFFF; }
2302
placessidebar row:disabled {
2303
color: rgba(255, 255, 255, 0.4); }
2304
placessidebar row image.sidebar-icon {
2305
opacity: 0.6; }
2306
placessidebar row image.sidebar-icon:dir(ltr) {
2307
padding-right: 8px; }
2308
placessidebar row image.sidebar-icon:dir(rtl) {
2309
padding-left: 8px; }
2310
placessidebar row label.sidebar-label:dir(ltr) {
2311
padding-right: 2px; }
2312
placessidebar row label.sidebar-label:dir(rtl) {
2313
padding-left: 2px; }
2314
button.sidebar-button {
2315
min-height: 24px;
2316
min-width: 24px;
2317
margin-top: 0;
2318
margin-bottom: 0;
2319
padding: 0;
2320
border-radius: 100%;
2321
-gtk-outline-radius: 100%; }
2322
placessidebar row.sidebar-placeholder-row {
2323
min-height: 2px;
2324
padding: 0 8px;
2325
background-image: image(#FF4081);
2326
background-clip: content-box; }
2327
placessidebar row.sidebar-new-bookmark-row {
2328
color: #FF4081; }
2329
placessidebar row:drop(active):not(:disabled) {
2330
box-shadow: inset 0 0 0 2px #FF4081; }
2331
2332
placesview .server-list-button > image {
2333
-gtk-icon-transform: rotate(0turn); }
2334
placesview .server-list-button:checked > image {
2335
-gtk-icon-transform: rotate(-0.5turn); }
2336
placesview > actionbar > revealer > box > label {
2337
padding-left: 8px;
2338
padding-right: 8px; }
2339
2340
/*********
2341
* Paned *
2342
*********/
2343
paned > separator {
2344
min-width: 1px;
2345
min-height: 1px;
2346
-gtk-icon-source: none;
2347
border-style: none;
2348
background-color: transparent;
2349
background-image: image(rgba(0, 0, 0, 0.2));
2350
background-size: 1px 1px; }
2351
paned > separator.wide {
2352
min-width: 6px;
2353
min-height: 6px;
2354
background-color: #37474F;
2355
background-image: image(rgba(0, 0, 0, 0.2)), image(rgba(0, 0, 0, 0.2));
2356
background-size: 1px 1px, 1px 1px; }
2357
paned.horizontal > separator {
2358
background-repeat: repeat-y; }
2359
paned.horizontal > separator:dir(ltr) {
2360
margin: 0 -8px 0 0;
2361
padding: 0 8px 0 0;
2362
background-position: left; }
2363
paned.horizontal > separator:dir(rtl) {
2364
margin: 0 0 0 -8px;
2365
padding: 0 0 0 8px;
2366
background-position: right; }
2367
paned.horizontal > separator.wide {
2368
margin: 0;
2369
padding: 0;
2370
background-repeat: repeat-y, repeat-y;
2371
background-position: left, right; }
2372
paned.vertical > separator {
2373
margin: 0 0 -8px 0;
2374
padding: 0 0 8px 0;
2375
background-repeat: repeat-x;
2376
background-position: top; }
2377
paned.vertical > separator.wide {
2378
margin: 0;
2379
padding: 0;
2380
background-repeat: repeat-x, repeat-x;
2381
background-position: bottom, top; }
2382
2383
/**************
2384
* GtkInfoBar *
2385
**************/
2386
infobar {
2387
border-style: none; }
2388
2389
.info {
2390
background-color: #66BB6A; }
2391
2392
.question {
2393
background-color: #42A5F5; }
2394
2395
.warning {
2396
background-color: #FFA726; }
2397
2398
.error {
2399
background-color: #EF5350; }
2400
2401
.info,
2402
.question,
2403
.warning,
2404
.error {
2405
color: #FFFFFF; }
2406
2407
/************
2408
* Tooltips *
2409
************/
2410
tooltip {
2411
border-radius: 2px;
2412
box-shadow: none; }
2413
tooltip.background {
2414
background-color: rgba(69, 90, 100, 0.9); }
2415
tooltip decoration {
2416
background-color: transparent; }
2417
tooltip label {
2418
min-height: 20px;
2419
padding: 4px 6px; }
2420
tooltip * {
2421
padding: 0;
2422
background-color: transparent;
2423
color: inherit; }
2424
2425
/*****************
2426
* Color Chooser *
2427
*****************/
2428
colorswatch.top {
2429
border-top-left-radius: 2.5px;
2430
border-top-right-radius: 2.5px; }
2431
colorswatch.top overlay {
2432
border-top-left-radius: 2px;
2433
border-top-right-radius: 2px; }
2434
colorswatch.bottom {
2435
border-bottom-left-radius: 2.5px;
2436
border-bottom-right-radius: 2.5px; }
2437
colorswatch.bottom overlay {
2438
border-bottom-left-radius: 2px;
2439
border-bottom-right-radius: 2px; }
2440
colorswatch.left, colorswatch:first-child:not(.top) {
2441
border-top-left-radius: 2.5px;
2442
border-bottom-left-radius: 2.5px; }
2443
colorswatch.left overlay, colorswatch:first-child:not(.top) overlay {
2444
border-top-left-radius: 2px;
2445
border-bottom-left-radius: 2px; }
2446
colorswatch.right, colorswatch:last-child:not(.bottom) {
2447
border-top-right-radius: 2.5px;
2448
border-bottom-right-radius: 2.5px; }
2449
colorswatch.right overlay, colorswatch:last-child:not(.bottom) overlay {
2450
border-top-right-radius: 2px;
2451
border-bottom-right-radius: 2px; }
2452
colorswatch.dark overlay {
2453
color: white; }
2454
colorswatch.light overlay {
2455
color: rgba(0, 0, 0, 0.8); }
2456
colorswatch.dark {
2457
color: white; }
2458
colorswatch.light {
2459
color: rgba(0, 0, 0, 0.8); }
2460
colorswatch:drop(active) {
2461
box-shadow: none; }
2462
colorswatch:drop(active).light overlay {
2463
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; }
2464
colorswatch:drop(active).dark overlay {
2465
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; }
2466
colorswatch overlay {
2467
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
2468
colorswatch overlay:hover {
2469
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
2470
colorswatch#add-color-button {
2471
border-radius: 2px 2px 0 0;
2472
color: white; }
2473
colorswatch#add-color-button:only-child {
2474
border-radius: 2px; }
2475
colorswatch#add-color-button overlay {
2476
background-image: linear-gradient(to right, #EF5350 25%, #FFA726 25%, #FFA726 50%, #66BB6A 50%, #66BB6A 75%, #42A5F5 75%);
2477
color: white; }
2478
colorswatch:disabled {
2479
opacity: 0.4; }
2480
colorswatch:disabled overlay {
2481
box-shadow: none; }
2482
colorswatch#editor-color-sample {
2483
border-radius: 2.5px; }
2484
colorswatch#editor-color-sample overlay {
2485
border-radius: 2px; }
2486
2487
colorchooser .popover.osd {
2488
border-radius: 2px;
2489
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2490
background-color: #455A64; }
2491
colorchooser .popover.osd:backdrop {
2492
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
2493
2494
/********
2495
* Misc *
2496
********/
2497
.content-view {
2498
background-color: #37474F; }
2499
2500
/**********************
2501
* Window Decorations *
2502
*********************/
2503
decoration {
2504
border-radius: 2px 2px 0 0;
2505
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 14px 14px transparent;
2506
transition: none;
2507
margin: 8px; }
2508
decoration:backdrop {
2509
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 14px 14px transparent;
2510
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0; }
2511
.fullscreen decoration, .tiled decoration {
2512
border-radius: 0; }
2513
.popup decoration {
2514
box-shadow: none; }
2515
.ssd decoration {
2516
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16); }
2517
.csd.popup decoration {
2518
border-radius: 2px;
2519
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
2520
tooltip.csd decoration {
2521
border-radius: 2px;
2522
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
2523
messagedialog.csd decoration {
2524
border-radius: 2px; }
2525
.solid-csd decoration {
2526
margin: 4px;
2527
border-radius: 0;
2528
box-shadow: none;
2529
background-color: #37474F; }
2530
2531
.view:selected, iconview:selected, .view text selection, iconview text selection,
2532
textview text selection, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection, notebook > stack:not(:only-child) revealer entry selection,
2533
notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) selection,
2534
entry selection, modelbutton.flat:selected, popover.background checkbutton:selected,
2535
popover.background radiobutton:selected,
2536
.menuitem.button.flat:selected, row:selected, calendar:selected {
2537
background-color: #00BCD4; }
2538
row:selected label, label:selected, .view:selected, iconview:selected, .view text selection, iconview text selection,
2539
textview text selection, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection, notebook > stack:not(:only-child) revealer entry selection,
2540
notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) selection,
2541
entry selection, modelbutton.flat:selected, popover.background checkbutton:selected,
2542
popover.background radiobutton:selected,
2543
.menuitem.button.flat:selected, row:selected, calendar:selected {
2544
color: #FFFFFF; }
2545
row:selected label:disabled, label:disabled:selected, .view:disabled:selected, iconview:disabled:selected, .view text selection:disabled, iconview text selection:disabled,
2546
textview text selection:disabled, flowbox flowboxchild:disabled:selected, label:disabled selection, spinbutton:not(.vertical) selection:disabled, notebook > stack:not(:only-child) revealer entry selection:disabled,
2547
notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) selection:disabled,
2548
entry selection:disabled, modelbutton.flat:disabled:selected, popover.background checkbutton:disabled:selected,
2549
popover.background radiobutton:disabled:selected,
2550
.menuitem.button.flat:disabled:selected, row:disabled:selected, calendar:disabled:selected {
2551
color: rgba(255, 255, 255, 0.4); }
2552
2553
.monospace {
2554
font: Monospace; }
2555
2556
/**********************
2557
* Touch Copy & Paste *
2558
*********************/
2559
cursor-handle {
2560
border-radius: 100px;
2561
background-color: #FF4081;
2562
background-image: none; }
2563
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) {
2564
padding-left: 6px;
2565
border-top-right-radius: 0; }
2566
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) {
2567
padding-right: 6px;
2568
border-top-left-radius: 0; }
2569
cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) {
2570
-GtkWidget-text-handle-width: 24;
2571
-GtkWidget-text-handle-height: 30;
2572
-gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-dark.png"), url("assets/slider-horz-scale-has-marks-above-dark@2.png")); }
2573
2574
.context-menu {
2575
font: initial; }
2576
2577
button.circular {
2578
border-radius: 100px;
2579
-gtk-outline-radius: 100px; }
2580
button.circular label {
2581
padding: 0; }
2582
2583
.keycap {
2584
min-width: 12px;
2585
min-height: 26px;
2586
margin-top: 2px;
2587
padding-bottom: 2px;
2588
padding-left: 8px;
2589
padding-right: 8px;
2590
border: solid 1px rgba(0, 0, 0, 0.2);
2591
border-radius: 3px;
2592
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.2);
2593
background-color: #455A64;
2594
color: #FFFFFF;
2595
font-size: smaller; }
2596
2597
*:drop(active) {
2598
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;
2599
caret-color: #FF4081; }
2600
2601
stackswitcher button.text-button {
2602
min-width: 100px; }
2603
2604
stackswitcher button.circular,
2605
stackswitcher button.text-button.circular {
2606
min-width: 36px;
2607
min-height: 36px;
2608
padding: 0; }
2609
2610
.floating-bar {
2611
min-height: 32px;
2612
padding: 0;
2613
border-style: solid solid none;
2614
border-width: 1px;
2615
border-color: rgba(0, 0, 0, 0.2);
2616
border-radius: 3px 3px 0 0;
2617
background-color: #455A64;
2618
background-clip: border-box;
2619
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0, border-width 0; }
2620
.floating-bar.left {
2621
margin-right: 7px;
2622
border-left-style: none;
2623
border-top-left-radius: 0; }
2624
.floating-bar.right {
2625
margin-left: 7px;
2626
border-right-style: none;
2627
border-top-right-radius: 0; }
2628
.floating-bar button {
2629
min-height: 24px;
2630
min-width: 24px;
2631
margin: 4px;
2632
padding: 0; }
2633
2634
/************
2635
* Nautilus *
2636
************/
2637
.nautilus-window,
2638
.nautilus-window notebook,
2639
.nautilus-window notebook > stack {
2640
background: #455A64; }
2641
2642
.nautilus-desktop-window,
2643
.nautilus-desktop-window notebook,
2644
.nautilus-desktop-window notebook > stack {
2645
background: transparent; }
2646
2647
.nautilus-desktop.nautilus-canvas-item {
2648
color: #FFFFFF;
2649
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
2650
2651
.nautilus-desktop.nautilus-canvas-item:selected {
2652
text-shadow: none; }
2653
2654
@keyframes needs_attention_keyframes {
2655
0% {
2656
background-color: transparent; }
2657
50% {
2658
background-color: alpha(currentColor, 0.3); }
2659
100% {
2660
background-color: transparent; } }
2661
.nautilus-operations-button-needs-attention {
2662
color: #FF4081;
2663
animation: needs_attention_keyframes 2s cubic-bezier(0.4, 0, 0.2, 1); }
2664
2665
.nautilus-operations-button-needs-attention-multiple {
2666
color: #FF4081;
2667
animation: needs_attention_keyframes 2s cubic-bezier(0.4, 0, 0.2, 1);
2668
animation-iteration-count: 2; }
2669
2670
.disk-space-display.unknown {
2671
background-color: #FF6D00; }
2672
2673
.disk-space-display.used {
2674
background-color: #00BCD4; }
2675
2676
.disk-space-display.free {
2677
background-color: alpha(currentColor, 0.3);
2678
color: rgba(255, 255, 255, 0.4); }
2679
2680
.documents-entry-tag {
2681
margin: 3px -2px 3px 8px;
2682
padding: 0 8px;
2683
border-radius: 100px;
2684
box-shadow: none;
2685
background-color: #00BCD4;
2686
color: #FFFFFF; }
2687
.documents-entry-tag:hover {
2688
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
2689
2690
.documents-entry-tag.button {
2691
margin: 0 -2px;
2692
padding: 4px;
2693
border-radius: 100px;
2694
box-shadow: none;
2695
color: rgba(255, 255, 255, 0.75); }
2696
.documents-entry-tag.button:hover, .documents-entry-tag.button:active {
2697
color: #FFFFFF; }
2698
2699
.nautilus-window searchbar {
2700
border-top: 1px solid rgba(0, 0, 0, 0.2); }
2701
2702
.nautilus-window .searchbar-container {
2703
margin-top: -1px; }
2704
2705
/* GTK NAMED COLORS
2706
----------------
2707
use responsibly! */
2708
/*
2709
widget text/foreground color */
2710
@define-color theme_fg_color #FFFFFF;
2711
/*
2712
text color for entries, views and content in general */
2713
@define-color theme_text_color #FFFFFF;
2714
/*
2715
widget base background color */
2716
@define-color theme_bg_color #37474F;
2717
/*
2718
text widgets and the like base background color */
2719
@define-color theme_base_color #455A64;
2720
/*
2721
base background color of selections */
2722
@define-color theme_selected_bg_color #00BCD4;
2723
/*
2724
text/foreground color of selections */
2725
@define-color theme_selected_fg_color #FFFFFF;
2726
/*
2727
base background color of insensitive widgets */
2728
@define-color insensitive_bg_color #37474F;
2729
/*
2730
text foreground color of insensitive widgets */
2731
@define-color insensitive_fg_color rgba(255, 255, 255, 0.4);
2732
/*
2733
insensitive text widgets and the like base background color */
2734
@define-color insensitive_base_color #3e515a;
2735
/*
2736
widget text/foreground color on backdrop windows */
2737
@define-color theme_unfocused_fg_color #FFFFFF;
2738
/*
2739
text color for entries, views and content in general on backdrop windows */
2740
@define-color theme_unfocused_text_color #FFFFFF;
2741
/*
2742
widget base background color on backdrop windows */
2743
@define-color theme_unfocused_bg_color #37474F;
2744
/*
2745
text widgets and the like base background color on backdrop windows */
2746
@define-color theme_unfocused_base_color #455A64;
2747
/*
2748
base background color of selections on backdrop windows */
2749
@define-color theme_unfocused_selected_bg_color #00BCD4;
2750
/*
2751
text/foreground color of selections on backdrop windows */
2752
@define-color theme_unfocused_selected_fg_color #FFFFFF;
2753
/*
2754
widgets main borders color */
2755
@define-color borders rgba(0, 0, 0, 0.2);
2756
/*
2757
widgets main borders color on backdrop windows */
2758
@define-color unfocused_borders rgba(0, 0, 0, 0.2);
2759
/*
2760
these are pretty self explicative */
2761
@define-color warning_color #FF6D00;
2762
@define-color error_color #DD2C00;
2763
@define-color success_color #00C853;
2764
@define-color content_view_bg #455A64;
2765