A fork of the Materia GTK theme.

By using this site, you agree to have cookies stored on your device, strictly for functional purposes, such as storing your session and preferences.

Dismiss

 gtk-dark.css

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