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.0 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(66, 165, 245, 0.6) 0%, transparent 0%); }
19
50% {
20
background-image: radial-gradient(circle farthest-corner at center, rgba(66, 165, 245, 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, #42A5F5 0%, transparent 0%); }
26
to {
27
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 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: #42A5F5; }
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: #42A5F5;
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 #40C4FF;
120
background-color: rgba(64, 196, 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: #42A5F5;
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, box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
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), #42A5F5 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), #42A5F5 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: 1px;
262
background-size: 1px 12px;
263
background-repeat: repeat-y;
264
background-origin: content-box;
265
background-position: left top; }
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: 1px;
272
background-size: 1px 12px;
273
background-repeat: repeat-y;
274
background-origin: content-box;
275
background-position: right top; }
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, box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
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, box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
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: #42A5F5;
355
background-color: transparent; }
356
357
treeview acceleditor > label {
358
background-color: #42A5F5; }
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, box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
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, box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1), 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: #42A5F5;
405
color: #FFFFFF; }
406
button:checked:disabled {
407
background-color: alpha(currentColor, 0.3);
408
color: rgba(66, 165, 245, 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.4, 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.4, 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: #42A5F5; }
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.2s 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:backdrop:not(headerbar),
970
headerbar:backdrop {
971
color: rgba(255, 255, 255, 0.75); }
972
.titlebar:not(headerbar) .title,
973
headerbar .title {
974
padding-left: 12px;
975
padding-right: 12px;
976
font-weight: bold; }
977
.titlebar:not(headerbar) .subtitle,
978
headerbar .subtitle {
979
padding-left: 12px;
980
padding-right: 12px;
981
font-size: smaller; }
982
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
983
headerbar button:not(.suggested-action):not(.destructive-action) {
984
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px;
985
color: alpha(currentColor, 0.75); }
986
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):hover, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):active,
987
headerbar button:not(.suggested-action):not(.destructive-action):hover,
988
headerbar button:not(.suggested-action):not(.destructive-action):active {
989
color: currentColor; }
990
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled,
991
headerbar button:not(.suggested-action):not(.destructive-action):disabled {
992
color: alpha(currentColor, 0.3); }
993
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled > label,
994
headerbar button:not(.suggested-action):not(.destructive-action):disabled > label {
995
color: inherit; }
996
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
997
headerbar button:not(.suggested-action):not(.destructive-action):checked {
998
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
999
background-color: transparent;
1000
color: currentColor; }
1001
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1002
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled {
1003
background-color: transparent;
1004
color: alpha(currentColor, 0.4); }
1005
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled > label,
1006
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled > label {
1007
color: inherit; }
1008
.titlebar:not(headerbar) button.suggested-action:disabled, .titlebar:not(headerbar) button.destructive-action:disabled,
1009
headerbar button.suggested-action:disabled,
1010
headerbar button.destructive-action:disabled {
1011
color: alpha(currentColor, 0.4); }
1012
.titlebar:not(headerbar) button.suggested-action:disabled > label, .titlebar:not(headerbar) button.destructive-action:disabled > label,
1013
headerbar button.suggested-action:disabled > label,
1014
headerbar button.destructive-action:disabled > label {
1015
color: inherit; }
1016
.selection-mode.titlebar:not(headerbar),
1017
headerbar.selection-mode {
1018
animation: header_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
1019
color: #FFFFFF; }
1020
.selection-mode.titlebar:backdrop:not(headerbar),
1021
headerbar.selection-mode:backdrop {
1022
color: rgba(255, 255, 255, 0.75); }
1023
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
1024
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action) {
1025
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px; }
1026
.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,
1027
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action),
1028
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):hover,
1029
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):active {
1030
color: currentColor; }
1031
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled,
1032
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled {
1033
color: alpha(currentColor, 0.4); }
1034
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled > label,
1035
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled > label {
1036
color: inherit; }
1037
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1038
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked {
1039
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
1040
color: currentColor; }
1041
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1042
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled {
1043
color: alpha(currentColor, 0.4); }
1044
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled > label,
1045
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled > label {
1046
color: inherit; }
1047
.selection-mode.titlebar:not(headerbar) .selection-menu,
1048
headerbar.selection-mode .selection-menu {
1049
padding-left: 16px;
1050
padding-right: 16px; }
1051
.selection-mode.titlebar:not(headerbar) .selection-menu GtkArrow,
1052
headerbar.selection-mode .selection-menu GtkArrow {
1053
-GtkArrow-arrow-scaling: 1; }
1054
.selection-mode.titlebar:not(headerbar) .selection-menu .arrow,
1055
headerbar.selection-mode .selection-menu .arrow {
1056
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
1057
.tiled .titlebar:not(headerbar), .maximized .titlebar:not(headerbar), .tiled
1058
headerbar, .maximized
1059
headerbar {
1060
border-radius: 0;
1061
box-shadow: none; }
1062
.default-decoration.titlebar:not(headerbar),
1063
headerbar.default-decoration {
1064
min-height: 24px;
1065
padding: 6px;
1066
border-width: 0; }
1067
.default-decoration.titlebar:not(headerbar) button.titlebutton,
1068
headerbar.default-decoration button.titlebutton {
1069
min-height: 24px;
1070
min-width: 24px;
1071
margin: 0;
1072
padding: 0; }
1073
.default-decoration.titlebar:not(headerbar) button.titlebutton:active,
1074
headerbar.default-decoration button.titlebutton:active {
1075
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 100%, transparent 0%), image(alpha(currentColor, 0.15)); }
1076
1077
headerbar entry,
1078
headerbar spinbutton,
1079
headerbar button {
1080
margin-top: 6px;
1081
margin-bottom: 6px; }
1082
1083
.titlebar {
1084
border-top-left-radius: 2px;
1085
border-top-right-radius: 2px; }
1086
1087
separator:first-child + headerbar, headerbar:first-child {
1088
border-top-left-radius: 2px; }
1089
.tiled separator:first-child + headerbar, .maximized separator:first-child + headerbar, .tiled headerbar:first-child, .maximized headerbar:first-child {
1090
border-radius: 0; }
1091
headerbar:last-child {
1092
border-top-right-radius: 2px; }
1093
.tiled headerbar:last-child, .maximized headerbar:last-child {
1094
border-radius: 0; }
1095
1096
window.csd > .titlebar:not(headerbar) {
1097
padding: 0;
1098
background-color: transparent;
1099
background-image: none;
1100
border-style: none;
1101
box-shadow: none; }
1102
.titlebar:not(headerbar) > separator {
1103
background-color: #37474F;
1104
background-image: image(rgba(0, 0, 0, 0.2)); }
1105
1106
/************
1107
* Pathbars *
1108
************/
1109
.path-bar button.text-button, .path-bar button.image-button, .path-bar button {
1110
padding-left: 6px;
1111
padding-right: 6px; }
1112
.path-bar button image {
1113
padding-left: 4px;
1114
padding-right: 4px; }
1115
.path-bar button.slider-button {
1116
padding-left: 0;
1117
padding-right: 0; }
1118
1119
/**************
1120
* Tree Views *
1121
**************/
1122
treeview.view {
1123
-GtkTreeView-grid-line-width: 1;
1124
-GtkTreeView-grid-line-pattern: '';
1125
-GtkTreeView-tree-line-width: 1;
1126
-GtkTreeView-tree-line-pattern: '';
1127
-GtkTreeView-expander-size: 16;
1128
border-left-color: alpha(currentColor, 0.3);
1129
border-top-color: rgba(0, 0, 0, 0.2); }
1130
treeview.view:hover, treeview.view:active, treeview.view:selected {
1131
border-radius: 0; }
1132
treeview.view.separator {
1133
min-height: 5px;
1134
color: rgba(0, 0, 0, 0.2); }
1135
treeview.view:drop(active) {
1136
border-style: solid none;
1137
border-width: 1px;
1138
border-color: #FF4081; }
1139
treeview.view:drop(active).after {
1140
border-top-style: none; }
1141
treeview.view:drop(active).before {
1142
border-bottom-style: none; }
1143
treeview.view.expander {
1144
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1145
-gtk-icon-transform: rotate(-90deg);
1146
color: rgba(255, 255, 255, 0.75); }
1147
treeview.view.expander:dir(rtl) {
1148
-gtk-icon-transform: rotate(90deg); }
1149
treeview.view.expander:checked {
1150
-gtk-icon-transform: unset; }
1151
treeview.view.expander:hover, treeview.view.expander:active {
1152
color: #FFFFFF; }
1153
treeview.view.expander:disabled {
1154
color: rgba(255, 255, 255, 0.3); }
1155
treeview.view.expander:selected {
1156
color: rgba(255, 255, 255, 0.75); }
1157
treeview.view.expander:selected:hover, treeview.view.expander:selected:active {
1158
color: #FFFFFF; }
1159
treeview.view.expander:selected:disabled {
1160
color: rgba(255, 255, 255, 0.3); }
1161
treeview.view.progressbar {
1162
border-style: none none solid;
1163
border-width: 4px;
1164
border-color: #42A5F5;
1165
background-color: transparent;
1166
background-image: none; }
1167
treeview.view.progressbar:selected {
1168
border-color: currentColor; }
1169
treeview.view.trough {
1170
border-style: none none solid;
1171
border-width: 4px;
1172
border-color: rgba(66, 165, 245, 0.3);
1173
background-color: transparent;
1174
background-image: none; }
1175
treeview.view.trough:selected {
1176
border-color: alpha(currentColor, 0.3); }
1177
treeview.view header button {
1178
padding: 2px 6px;
1179
border-style: none solid solid none;
1180
border-width: 1px;
1181
border-color: rgba(0, 0, 0, 0.2);
1182
border-radius: 0;
1183
background-clip: border-box; }
1184
treeview.view header button, treeview.view header button:hover, treeview.view header button:active {
1185
box-shadow: none; }
1186
treeview.view header button, treeview.view header button:disabled {
1187
background-color: #546E7A; }
1188
treeview.view header button:last-child {
1189
border-right-style: none; }
1190
treeview.view button.dnd,
1191
treeview.view header.button.dnd {
1192
padding: 2px 6px;
1193
border-style: none solid solid;
1194
border-width: 1px;
1195
border-color: rgba(0, 0, 0, 0.2);
1196
border-radius: 0;
1197
box-shadow: none;
1198
background-color: #546E7A;
1199
background-clip: border-box;
1200
color: #42A5F5; }
1201
1202
/*********
1203
* Menus *
1204
*********/
1205
menubar,
1206
.menubar {
1207
-GtkWidget-window-dragging: true;
1208
padding: 0;
1209
background-color: #37474F; }
1210
menubar > menuitem,
1211
.menubar > menuitem {
1212
transition: background-color 0.2s cubic-bezier(0, 0, 0.2, 1);
1213
min-height: 20px;
1214
padding: 4px 8px;
1215
color: rgba(255, 255, 255, 0.75); }
1216
menubar > menuitem:hover,
1217
.menubar > menuitem:hover {
1218
transition: none;
1219
background-color: alpha(currentColor, 0.15);
1220
color: #FFFFFF; }
1221
menubar > menuitem:disabled,
1222
.menubar > menuitem:disabled {
1223
color: rgba(255, 255, 255, 0.3); }
1224
1225
menu,
1226
.menu {
1227
margin: 4px 0;
1228
padding: 4px 0;
1229
background-color: #546E7A;
1230
border: 1px solid rgba(0, 0, 0, 0.2); }
1231
.csd menu, .csd
1232
.menu {
1233
border: none;
1234
border-radius: 2px; }
1235
menu menuitem,
1236
.menu menuitem {
1237
transition: background-color 0.2s cubic-bezier(0, 0, 0.2, 1);
1238
min-height: 20px;
1239
min-width: 40px;
1240
padding: 4px 8px;
1241
font: initial;
1242
text-shadow: none; }
1243
menu menuitem:hover,
1244
.menu menuitem:hover {
1245
transition: none;
1246
background-color: alpha(currentColor, 0.15); }
1247
menu menuitem:disabled,
1248
.menu menuitem:disabled {
1249
color: rgba(255, 255, 255, 0.4); }
1250
menu menuitem arrow,
1251
.menu menuitem arrow {
1252
min-height: 16px;
1253
min-width: 16px; }
1254
menu menuitem arrow:dir(ltr),
1255
.menu menuitem arrow:dir(ltr) {
1256
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1257
margin-left: 8px; }
1258
menu menuitem arrow:dir(rtl),
1259
.menu menuitem arrow:dir(rtl) {
1260
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl");
1261
margin-right: 8px; }
1262
menu > arrow,
1263
.menu > arrow {
1264
min-height: 16px;
1265
min-width: 16px;
1266
padding: 4px;
1267
border-radius: 0;
1268
background-color: #546E7A;
1269
color: rgba(255, 255, 255, 0.75); }
1270
menu > arrow.top,
1271
.menu > arrow.top {
1272
margin-top: -4px;
1273
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
1274
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); }
1275
menu > arrow.bottom,
1276
.menu > arrow.bottom {
1277
margin-bottom: -4px;
1278
border-top: 1px solid rgba(0, 0, 0, 0.2);
1279
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
1280
menu > arrow:hover,
1281
.menu > arrow:hover {
1282
background-image: image(alpha(currentColor, 0.15));
1283
color: #FFFFFF; }
1284
menu > arrow:disabled,
1285
.menu > arrow:disabled {
1286
border-color: transparent;
1287
background-color: transparent;
1288
color: transparent; }
1289
menu separator,
1290
.menu separator {
1291
margin: 4px 0; }
1292
1293
menuitem accelerator {
1294
color: alpha(currentColor, 0.6); }
1295
menuitem check:dir(ltr),
1296
menuitem radio:dir(ltr) {
1297
margin-right: -8px;
1298
margin-left: -16px; }
1299
menuitem check:dir(rtl),
1300
menuitem radio:dir(rtl) {
1301
margin-right: -16px;
1302
margin-left: -8px; }
1303
1304
.csd.popup {
1305
border-radius: 2px; }
1306
1307
/***************
1308
* Popovers *
1309
***************/
1310
popover.background {
1311
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1312
padding: 0;
1313
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
1314
background-color: #607D8B; }
1315
popover.background:backdrop {
1316
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1317
popover.background, .csd popover.background {
1318
border-style: solid;
1319
border-width: 1px;
1320
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3);
1321
border-radius: 3px; }
1322
popover.background > list,
1323
popover.background > .view,
1324
popover.background > iconview,
1325
popover.background > toolbar {
1326
border-style: none;
1327
box-shadow: none;
1328
background-color: transparent; }
1329
popover.background separator {
1330
margin: 4px 0; }
1331
popover.background list separator {
1332
margin: 0; }
1333
1334
/*************
1335
* Notebooks *
1336
*************/
1337
notebook > header {
1338
border-width: 1px;
1339
border-color: rgba(0, 0, 0, 0.2);
1340
background-color: #455A64;
1341
background-clip: border-box; }
1342
notebook > header.top {
1343
border-bottom-style: solid; }
1344
notebook > header.top > tabs {
1345
margin-bottom: -1px; }
1346
notebook > header.top > tabs > tab:hover {
1347
box-shadow: inset 0 -2px alpha(currentColor, 0.3); }
1348
notebook > header.top > tabs > tab:checked {
1349
box-shadow: inset 0 -2px #42A5F5; }
1350
notebook > header.bottom {
1351
border-top-style: solid; }
1352
notebook > header.bottom > tabs {
1353
margin-top: -1px; }
1354
notebook > header.bottom > tabs > tab:hover {
1355
box-shadow: inset 0 2px alpha(currentColor, 0.3); }
1356
notebook > header.bottom > tabs > tab:checked {
1357
box-shadow: inset 0 2px #42A5F5; }
1358
notebook > header.left {
1359
border-right-style: solid; }
1360
notebook > header.left > tabs {
1361
margin-right: -1px; }
1362
notebook > header.left > tabs > tab:hover {
1363
box-shadow: inset -2px 0 alpha(currentColor, 0.3); }
1364
notebook > header.left > tabs > tab:checked {
1365
box-shadow: inset -2px 0 #42A5F5; }
1366
notebook > header.right {
1367
border-left-style: solid; }
1368
notebook > header.right > tabs {
1369
margin-left: -1px; }
1370
notebook > header.right > tabs > tab:hover {
1371
box-shadow: inset 2px 0 alpha(currentColor, 0.3); }
1372
notebook > header.right > tabs > tab:checked {
1373
box-shadow: inset 2px 0 #42A5F5; }
1374
notebook > header.top > tabs > arrow {
1375
border-top-style: none; }
1376
notebook > header.bottom > tabs > arrow {
1377
border-bottom-style: none; }
1378
notebook > header.top > tabs > arrow, notebook > header.bottom > tabs > arrow {
1379
padding-left: 4px;
1380
padding-right: 4px; }
1381
notebook > header.top > tabs > arrow.down, notebook > header.bottom > tabs > arrow.down {
1382
margin-left: -8px;
1383
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); }
1384
notebook > header.top > tabs > arrow.up, notebook > header.bottom > tabs > arrow.up {
1385
margin-right: -8px;
1386
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); }
1387
notebook > header.left > tabs > arrow {
1388
border-left-style: none; }
1389
notebook > header.right > tabs > arrow {
1390
border-right-style: none; }
1391
notebook > header.left > tabs > arrow, notebook > header.right > tabs > arrow {
1392
padding-top: 4px;
1393
padding-bottom: 4px; }
1394
notebook > header.left > tabs > arrow.down, notebook > header.right > tabs > arrow.down {
1395
margin-top: -8px;
1396
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); }
1397
notebook > header.left > tabs > arrow.up, notebook > header.right > tabs > arrow.up {
1398
margin-bottom: -8px;
1399
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
1400
notebook > header > tabs > arrow {
1401
min-height: 16px;
1402
min-width: 16px;
1403
border-radius: 0; }
1404
notebook > header tab {
1405
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0;
1406
min-height: 24px;
1407
min-width: 24px;
1408
padding: 6px 12px;
1409
outline-offset: -6px;
1410
border-width: 1px;
1411
border-color: transparent;
1412
color: rgba(255, 255, 255, 0.75);
1413
font-weight: 500; }
1414
notebook > header tab:hover {
1415
color: #FFFFFF; }
1416
notebook > header tab:hover.reorderable-page {
1417
border-color: rgba(0, 0, 0, 0.2);
1418
background-color: #4d646f; }
1419
notebook > header tab:disabled {
1420
color: rgba(255, 255, 255, 0.3); }
1421
notebook > header tab:checked {
1422
animation: tab_ripple_effect 0.9s cubic-bezier(0, 0, 0.2, 1);
1423
color: #FFFFFF; }
1424
notebook > header tab:checked:disabled {
1425
color: rgba(255, 255, 255, 0.4); }
1426
notebook > header tab:checked.reorderable-page {
1427
border-color: rgba(0, 0, 0, 0.2);
1428
background-color: #546E7A; }
1429
notebook > header tab button.flat {
1430
min-width: 24px;
1431
min-height: 24px;
1432
padding: 0; }
1433
notebook > header tab button.flat:last-child {
1434
margin-left: 6px;
1435
margin-right: -6px; }
1436
notebook > header tab button.flat:first-child {
1437
margin-left: -6px;
1438
margin-right: 6px; }
1439
notebook > header.top tabs, notebook > header.bottom tabs {
1440
padding-left: 8px;
1441
padding-right: 8px; }
1442
notebook > header.top tabs:not(:only-child):first-child, notebook > header.bottom tabs:not(:only-child):first-child {
1443
margin-left: 0; }
1444
notebook > header.top tabs:not(:only-child):last-child, notebook > header.bottom tabs:not(:only-child):last-child {
1445
margin-right: 0; }
1446
notebook > header.top tabs tab.reorderable-page, notebook > header.bottom tabs tab.reorderable-page {
1447
margin: 0 -1px;
1448
border-style: none solid; }
1449
notebook > header.left tabs, notebook > header.right tabs {
1450
padding-top: 8px;
1451
padding-bottom: 8px; }
1452
notebook > header.left tabs:not(:only-child):first-child, notebook > header.right tabs:not(:only-child):first-child {
1453
margin-top: 0; }
1454
notebook > header.left tabs:not(:only-child):last-child, notebook > header.right tabs:not(:only-child):last-child {
1455
margin-bottom: 0; }
1456
notebook > header.left tabs tab.reorderable-page, notebook > header.right tabs tab.reorderable-page {
1457
margin: -1px 0;
1458
border-style: solid none; }
1459
notebook > stack:not(:only-child) {
1460
background-color: #546E7A; }
1461
1462
/**************
1463
* Scrollbars *
1464
**************/
1465
scrollbar {
1466
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0;
1467
background-color: #546E7A;
1468
background-clip: border-box; }
1469
* {
1470
-GtkScrollbar-has-backward-stepper: false;
1471
-GtkScrollbar-has-forward-stepper: false; }
1472
scrollbar.top {
1473
border-bottom: 1px solid rgba(0, 0, 0, 0.2); }
1474
scrollbar.bottom {
1475
border-top: 1px solid rgba(0, 0, 0, 0.2); }
1476
scrollbar.left {
1477
border-right: 1px solid rgba(0, 0, 0, 0.2); }
1478
scrollbar.right {
1479
border-left: 1px solid rgba(0, 0, 0, 0.2); }
1480
scrollbar slider {
1481
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0;
1482
min-width: 8px;
1483
min-height: 8px;
1484
border: 4px solid transparent;
1485
border-radius: 100px;
1486
background-clip: padding-box;
1487
background-color: rgba(255, 255, 255, 0.6); }
1488
scrollbar slider:hover {
1489
background-color: rgba(255, 255, 255, 0.75); }
1490
scrollbar slider:active {
1491
background-color: #FFFFFF; }
1492
scrollbar slider:disabled {
1493
background-color: rgba(255, 255, 255, 0.24); }
1494
scrollbar.fine-tune slider {
1495
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0, min-width 0, min-height 0;
1496
min-width: 4px;
1497
min-height: 4px; }
1498
scrollbar.fine-tune.horizontal slider {
1499
margin: 2px 0; }
1500
scrollbar.fine-tune.vertical slider {
1501
margin: 0 2px; }
1502
scrollbar.overlay-indicator:not(.dragging):not(.hovering) {
1503
border-color: transparent;
1504
background-color: transparent; }
1505
scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider {
1506
min-width: 4px;
1507
min-height: 4px;
1508
margin: 2px;
1509
border: 2px solid rgba(84, 110, 122, 0.3); }
1510
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button {
1511
min-width: 4px;
1512
min-height: 4px;
1513
margin: 2px;
1514
border: 2px solid rgba(84, 110, 122, 0.3);
1515
border-radius: 100px;
1516
background-color: rgba(255, 255, 255, 0.6);
1517
background-clip: padding-box;
1518
-gtk-icon-source: none; }
1519
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled {
1520
background-color: rgba(255, 255, 255, 0.24); }
1521
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider {
1522
min-width: 24px; }
1523
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal button {
1524
min-width: 8px; }
1525
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider {
1526
min-height: 24px; }
1527
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button {
1528
min-height: 8px; }
1529
scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering {
1530
background-color: rgba(84, 110, 122, 0.9); }
1531
scrollbar.horizontal slider {
1532
min-width: 24px; }
1533
scrollbar.vertical slider {
1534
min-height: 24px; }
1535
scrollbar button {
1536
min-width: 16px;
1537
min-height: 16px;
1538
padding: 0;
1539
border-radius: 0; }
1540
scrollbar.vertical button.down {
1541
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
1542
scrollbar.vertical button.up {
1543
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); }
1544
scrollbar.horizontal button.down {
1545
-gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); }
1546
scrollbar.horizontal button.up {
1547
-gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); }
1548
1549
/**********
1550
* Switch *
1551
**********/
1552
switch {
1553
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0;
1554
margin: 6px 0;
1555
border: 4px solid transparent;
1556
border-radius: 100px;
1557
background-color: alpha(currentColor, 0.3);
1558
background-clip: padding-box;
1559
font-size: 0; }
1560
switch:disabled {
1561
color: rgba(255, 255, 255, 0.4); }
1562
switch:checked {
1563
background-color: rgba(255, 64, 129, 0.5); }
1564
switch:checked:disabled {
1565
background-color: rgba(255, 64, 129, 0.2);
1566
color: rgba(255, 255, 255, 0.4); }
1567
switch slider {
1568
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1569
border-image: none;
1570
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1571
background-color: #546E7A;
1572
color: #FFFFFF;
1573
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, margin 0;
1574
min-width: 24px;
1575
min-height: 24px;
1576
margin: -4px 0 -4px -4px;
1577
-gtk-outline-radius: 100px;
1578
border-radius: 100px; }
1579
switch:hover slider {
1580
border-image: none;
1581
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1582
switch:disabled slider {
1583
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1584
background-color: #4d646f;
1585
color: rgba(255, 255, 255, 0.4); }
1586
switch:checked slider {
1587
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, margin 0, background-image 0, background-color 0 0.3s;
1588
animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1);
1589
margin: -4px -4px -4px 0;
1590
background-color: #FF4081;
1591
color: #FFFFFF; }
1592
switch:checked:disabled slider {
1593
animation: none; }
1594
1595
/*************************
1596
* Check and Radio items *
1597
*************************/
1598
.view.content-view.check:not(list), iconview.content-view.check:not(list) {
1599
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1600
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-selectionmode.png"), url("assets/checkbox-selectionmode@2.png"));
1601
margin: 8px;
1602
background-color: transparent; }
1603
.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 {
1604
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1605
.view.content-view.check:not(list):disabled, iconview.content-view.check:not(list):disabled {
1606
-gtk-icon-shadow: none; }
1607
1608
.view.content-view.check:active:not(list), iconview.content-view.check:active:not(list) {
1609
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1610
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-active-selectionmode.png"), url("assets/checkbox-active-selectionmode@2.png"));
1611
margin: 8px;
1612
background-color: transparent; }
1613
.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 {
1614
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1615
.view.content-view.check:active:not(list):disabled, iconview.content-view.check:active:not(list):disabled {
1616
-gtk-icon-shadow: none; }
1617
1618
.view.content-view.check:disabled:not(list), iconview.content-view.check:disabled:not(list) {
1619
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1620
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-insensitive-selectionmode.png"), url("assets/checkbox-insensitive-selectionmode@2.png"));
1621
margin: 8px;
1622
background-color: transparent; }
1623
.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 {
1624
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1625
.view.content-view.check:disabled:not(list):disabled, iconview.content-view.check:disabled:not(list):disabled {
1626
-gtk-icon-shadow: none; }
1627
1628
.view.content-view.check:checked:not(list), iconview.content-view.check:checked:not(list) {
1629
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1630
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-selectionmode.png"), url("assets/checkbox-checked-selectionmode@2.png"));
1631
margin: 8px;
1632
background-color: transparent; }
1633
.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 {
1634
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1635
.view.content-view.check:checked:not(list):disabled, iconview.content-view.check:checked:not(list):disabled {
1636
-gtk-icon-shadow: none; }
1637
1638
.view.content-view.check:checked:active:not(list), iconview.content-view.check:checked:active:not(list) {
1639
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1640
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-active-selectionmode.png"), url("assets/checkbox-checked-active-selectionmode@2.png"));
1641
margin: 8px;
1642
background-color: transparent; }
1643
.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 {
1644
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1645
.view.content-view.check:checked:active:not(list):disabled, iconview.content-view.check:checked:active:not(list):disabled {
1646
-gtk-icon-shadow: none; }
1647
1648
.view.content-view.check:disabled:checked:not(list), iconview.content-view.check:disabled:checked:not(list) {
1649
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1650
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-insensitive-selectionmode.png"), url("assets/checkbox-checked-insensitive-selectionmode@2.png"));
1651
margin: 8px;
1652
background-color: transparent; }
1653
.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 {
1654
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1655
.view.content-view.check:disabled:checked:not(list):disabled, iconview.content-view.check:disabled:checked:not(list):disabled {
1656
-gtk-icon-shadow: none; }
1657
1658
checkbutton.text-button, radiobutton.text-button {
1659
padding: 2px 0;
1660
outline-offset: 0; }
1661
checkbutton.text-button label:not(:only-child):first-child, radiobutton.text-button label:not(:only-child):first-child {
1662
margin-left: 4px; }
1663
checkbutton.text-button label:not(:only-child):last-child, radiobutton.text-button label:not(:only-child):last-child {
1664
margin-right: 4px; }
1665
1666
check,
1667
radio {
1668
min-height: 24px;
1669
min-width: 24px;
1670
-gtk-icon-source: none;
1671
margin: -12px -8px;
1672
padding: 12px;
1673
outline-offset: 4px;
1674
color: alpha(currentColor, 0.75); }
1675
check:hover, check:active,
1676
radio:hover,
1677
radio:active {
1678
color: currentColor; }
1679
check:checked, check:checked:disabled,
1680
radio:checked,
1681
radio:checked:disabled {
1682
background-color: transparent; }
1683
check:checked, check:indeterminate,
1684
radio:checked,
1685
radio:indeterminate {
1686
color: #FF4081; }
1687
check:checked:disabled, check:indeterminate:disabled,
1688
radio:checked:disabled,
1689
radio:indeterminate:disabled {
1690
color: rgba(255, 64, 129, 0.4); }
1691
check:only-child,
1692
radio:only-child {
1693
margin: -12px; }
1694
menu menuitem check, menu menuitem
1695
radio {
1696
transition: none;
1697
margin: -16px -16px; }
1698
menu menuitem check:not(:checked):not(:indeterminate):hover, menu menuitem
1699
radio:not(:checked):not(:indeterminate):hover {
1700
color: alpha(currentColor, 0.75); }
1701
menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem
1702
radio, menu menuitem
1703
radio:hover, menu menuitem
1704
radio:disabled {
1705
background-image: none; }
1706
1707
check {
1708
-gtk-icon-source: image(-gtk-recolor(url("assets/check-unchecked-symbolic.svg")), -gtk-recolor(url("assets/check-unchecked-symbolic.png"))); }
1709
check:checked {
1710
-gtk-icon-source: image(-gtk-recolor(url("assets/check-checked-symbolic.svg")), -gtk-recolor(url("assets/check-checked-symbolic.png"))); }
1711
check:indeterminate {
1712
-gtk-icon-source: image(-gtk-recolor(url("assets/check-dash-symbolic.svg")), -gtk-recolor(url("assets/check-dash-symbolic.png"))); }
1713
1714
radio {
1715
border-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent)) 24/24px;
1716
-gtk-icon-source: image(-gtk-recolor(url("assets/radio-unchecked-symbolic.svg")), -gtk-recolor(url("assets/radio-unchecked-symbolic.png"))); }
1717
radio:checked {
1718
border-image: -gtk-gradient(radial, center center, 0, center center, 0.10417, to(#FF4081), to(transparent)) 24/24px; }
1719
radio:checked:disabled {
1720
border-image: -gtk-gradient(radial, center center, 0, center center, 0.10417, to(rgba(255, 64, 129, 0.4)), to(transparent)) 24/24px; }
1721
radio:indeterminate {
1722
-gtk-icon-source: image(-gtk-recolor(url("assets/radio-dash-symbolic.svg")), -gtk-recolor(url("assets/radio-dash-symbolic.png"))); }
1723
radio:indeterminate:checked {
1724
border-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent)) 24/24px; }
1725
1726
@keyframes check_check {
1727
from {
1728
-gtk-icon-transform: rotate(90deg); }
1729
to {
1730
-gtk-icon-transform: unset; } }
1731
@keyframes check_radio {
1732
from {
1733
-gtk-icon-transform: scale(0); }
1734
to {
1735
-gtk-icon-transform: unset; } }
1736
@keyframes check_indeterminate {
1737
from {
1738
-gtk-icon-transform: unset; }
1739
50% {
1740
-gtk-icon-transform: scale(0, 1); }
1741
to {
1742
-gtk-icon-transform: unset; } }
1743
check:not(:indeterminate):checked {
1744
animation: check_check 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
1745
1746
check:not(:indeterminate):checked:active {
1747
animation: check_check 0.3s cubic-bezier(0.4, 0, 0.2, 1), flat_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards; }
1748
1749
check:indeterminate:checked, radio:indeterminate:checked {
1750
animation: check_indeterminate 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
1751
1752
check:indeterminate:checked:active, radio:indeterminate:checked:active {
1753
animation: check_indeterminate 0.3s cubic-bezier(0.4, 0, 0.2, 1), flat_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards; }
1754
1755
menu menuitem check:not(:indeterminate):checked,
1756
menu menuitem radio:not(:indeterminate):checked,
1757
menu menuitem check:indeterminate:checked,
1758
menu menuitem radio:indeterminate:checked {
1759
animation: none; }
1760
1761
treeview.view check,
1762
treeview.view radio {
1763
padding: 0; }
1764
treeview.view check:checked:hover, treeview.view check:selected:checked:hover,
1765
treeview.view radio:checked:hover,
1766
treeview.view radio:selected:checked:hover {
1767
background-image: none; }
1768
treeview.view check,
1769
treeview.view radio {
1770
color: rgba(255, 255, 255, 0.75); }
1771
treeview.view check:hover, treeview.view check:active,
1772
treeview.view radio:hover,
1773
treeview.view radio:active {
1774
color: #FFFFFF; }
1775
treeview.view check:disabled,
1776
treeview.view radio:disabled {
1777
color: rgba(255, 255, 255, 0.3); }
1778
treeview.view check:checked, treeview.view check:indeterminate,
1779
treeview.view radio:checked,
1780
treeview.view radio:indeterminate {
1781
color: #FF4081; }
1782
treeview.view check:checked:disabled, treeview.view check:indeterminate:disabled,
1783
treeview.view radio:checked:disabled,
1784
treeview.view radio:indeterminate:disabled {
1785
color: rgba(255, 64, 129, 0.4); }
1786
treeview.view check:selected,
1787
treeview.view radio:selected {
1788
color: rgba(255, 255, 255, 0.75); }
1789
treeview.view check:selected:hover, treeview.view check:selected:active,
1790
treeview.view radio:selected:hover,
1791
treeview.view radio:selected:active {
1792
color: #FFFFFF; }
1793
treeview.view check:selected:disabled,
1794
treeview.view radio:selected:disabled {
1795
color: rgba(255, 255, 255, 0.3); }
1796
treeview.view check:selected:checked, treeview.view check:selected:indeterminate,
1797
treeview.view radio:selected:checked,
1798
treeview.view radio:selected:indeterminate {
1799
color: #FF4081; }
1800
treeview.view check:selected:checked:disabled, treeview.view check:selected:indeterminate:disabled,
1801
treeview.view radio:selected:checked:disabled,
1802
treeview.view radio:selected:indeterminate:disabled {
1803
color: rgba(255, 64, 129, 0.4); }
1804
1805
treeview.view radio:checked {
1806
-gtk-icon-source: image(-gtk-recolor(url("assets/radio-checked-symbolic.svg")), -gtk-recolor(url("assets/radio-checked-symbolic.png")));
1807
border-image: none; }
1808
1809
/************
1810
* GtkScale *
1811
************/
1812
scale {
1813
min-height: 12px;
1814
min-width: 12px;
1815
padding: 12px; }
1816
scale * {
1817
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0; }
1818
scale slider {
1819
min-height: 24px;
1820
min-width: 24px;
1821
margin: -10px; }
1822
scale trough {
1823
outline-offset: 2px;
1824
background-color: alpha(currentColor, 0.3); }
1825
scale trough:disabled {
1826
color: rgba(255, 255, 255, 0.4); }
1827
scale highlight {
1828
background-color: #FF4081; }
1829
scale highlight:disabled {
1830
background-color: transparent; }
1831
scale fill {
1832
background-color: alpha(currentColor, 0.3); }
1833
scale fill:disabled {
1834
background-color: transparent; }
1835
scale slider {
1836
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
1837
background-repeat: no-repeat;
1838
background-position: center;
1839
background-size: calc(100% - 8px); }
1840
scale slider {
1841
background-image: -gtk-scaled(url("assets/slider-dark.png"), url("assets/slider-dark@2.png")); }
1842
scale slider:disabled {
1843
background-image: -gtk-scaled(url("assets/slider-insensitive-dark.png"), url("assets/slider-insensitive-dark@2.png")); }
1844
scale slider:hover {
1845
background-size: calc(100% - 4px); }
1846
scale slider:active {
1847
background-size: calc(100% - 0px); }
1848
scale.fine-tune slider {
1849
background-size: calc(100% - 12px); }
1850
scale value {
1851
color: alpha(currentColor, 0.6); }
1852
scale marks {
1853
color: alpha(currentColor, 0.3); }
1854
scale marks.top {
1855
margin-bottom: 8px;
1856
margin-top: -16px; }
1857
scale marks.bottom {
1858
margin-top: 8px;
1859
margin-bottom: -16px; }
1860
scale marks.top {
1861
margin-right: 8px;
1862
margin-left: -16px; }
1863
scale marks.bottom {
1864
margin-left: 8px;
1865
margin-right: -16px; }
1866
scale.horizontal indicator {
1867
min-height: 8px;
1868
min-width: 1px; }
1869
scale.vertical indicator {
1870
min-height: 1px;
1871
min-width: 8px; }
1872
scale.color.horizontal slider,
1873
scale.horizontal contents:last-child:not(:only-child) > trough > slider {
1874
min-height: 30px;
1875
min-width: 24px;
1876
margin-top: -16px;
1877
background-position: center calc(100% - 4px); }
1878
scale.color.horizontal slider,
1879
scale.horizontal contents:last-child:not(:only-child) > trough > slider {
1880
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")); }
1881
scale.color.horizontal slider:hover,
1882
scale.horizontal contents:last-child:not(:only-child) > trough > slider:hover {
1883
background-position: center calc(100% - 2px); }
1884
scale.color.horizontal slider:active,
1885
scale.horizontal contents:last-child:not(:only-child) > trough > slider:active {
1886
background-position: center calc(100% - 0px); }
1887
scale.color.fine-tune.horizontal slider, scale.horizontal.fine-tune contents:last-child:not(:only-child) > trough > slider {
1888
background-position: center calc(100% - 6px); }
1889
scale.color.horizontal slider,
1890
scale.horizontal contents:last-child:not(:only-child) > trough > slider {
1891
min-height: 30px;
1892
min-width: 24px;
1893
margin-top: -16px;
1894
background-position: center calc(100% - 4px); }
1895
scale.color.horizontal slider:disabled,
1896
scale.horizontal contents:last-child:not(:only-child) > trough > slider:disabled {
1897
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")); }
1898
scale.color.horizontal slider:hover,
1899
scale.horizontal contents:last-child:not(:only-child) > trough > slider:hover {
1900
background-position: center calc(100% - 2px); }
1901
scale.color.horizontal slider:active,
1902
scale.horizontal contents:last-child:not(:only-child) > trough > slider:active {
1903
background-position: center calc(100% - 0px); }
1904
scale.color.fine-tune.horizontal slider, scale.horizontal.fine-tune contents:last-child:not(:only-child) > trough > slider {
1905
background-position: center calc(100% - 6px); }
1906
scale.horizontal contents:first-child:not(:only-child) > trough > slider {
1907
min-height: 30px;
1908
min-width: 24px;
1909
margin-bottom: -16px;
1910
background-position: center calc(4px); }
1911
scale.horizontal contents:first-child:not(:only-child) > trough > slider {
1912
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")); }
1913
scale.horizontal contents:first-child:not(:only-child) > trough > slider:hover {
1914
background-position: center calc(2px); }
1915
scale.horizontal contents:first-child:not(:only-child) > trough > slider:active {
1916
background-position: center calc(0px); }
1917
scale.horizontal.fine-tune contents:first-child:not(:only-child) > trough > slider {
1918
background-position: center calc(6px); }
1919
scale.horizontal contents:first-child:not(:only-child) > trough > slider {
1920
min-height: 30px;
1921
min-width: 24px;
1922
margin-bottom: -16px;
1923
background-position: center calc(4px); }
1924
scale.horizontal contents:first-child:not(:only-child) > trough > slider:disabled {
1925
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")); }
1926
scale.horizontal contents:first-child:not(:only-child) > trough > slider:hover {
1927
background-position: center calc(2px); }
1928
scale.horizontal contents:first-child:not(:only-child) > trough > slider:active {
1929
background-position: center calc(0px); }
1930
scale.horizontal.fine-tune contents:first-child:not(:only-child) > trough > slider {
1931
background-position: center calc(6px); }
1932
scale.color.vertical:dir(rtl) slider,
1933
scale.vertical contents:last-child:not(:only-child) > trough > slider {
1934
min-height: 24px;
1935
min-width: 30px;
1936
margin-left: -16px;
1937
background-position: calc(4px) center; }
1938
scale.color.vertical:dir(rtl) slider,
1939
scale.vertical contents:last-child:not(:only-child) > trough > slider {
1940
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")); }
1941
scale.color.vertical:dir(rtl) slider:hover,
1942
scale.vertical contents:last-child:not(:only-child) > trough > slider:hover {
1943
background-position: calc(2px) center; }
1944
scale.color.vertical:dir(rtl) slider:active,
1945
scale.vertical contents:last-child:not(:only-child) > trough > slider:active {
1946
background-position: calc(0px) center; }
1947
scale.color.fine-tune.vertical:dir(rtl) slider, scale.vertical.fine-tune contents:last-child:not(:only-child) > trough > slider {
1948
background-position: calc(6px) center; }
1949
scale.color.vertical:dir(rtl) slider,
1950
scale.vertical contents:last-child:not(:only-child) > trough > slider {
1951
min-height: 24px;
1952
min-width: 30px;
1953
margin-left: -16px;
1954
background-position: calc(4px) center; }
1955
scale.color.vertical:dir(rtl) slider:disabled,
1956
scale.vertical contents:last-child:not(:only-child) > trough > slider:disabled {
1957
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")); }
1958
scale.color.vertical:dir(rtl) slider:hover,
1959
scale.vertical contents:last-child:not(:only-child) > trough > slider:hover {
1960
background-position: calc(2px) center; }
1961
scale.color.vertical:dir(rtl) slider:active,
1962
scale.vertical contents:last-child:not(:only-child) > trough > slider:active {
1963
background-position: calc(0px) center; }
1964
scale.color.fine-tune.vertical:dir(rtl) slider, scale.vertical.fine-tune contents:last-child:not(:only-child) > trough > slider {
1965
background-position: calc(6px) center; }
1966
scale.color.vertical:dir(ltr) slider,
1967
scale.vertical contents:first-child:not(:only-child) > trough > slider {
1968
min-height: 24px;
1969
min-width: 30px;
1970
margin-right: -16px;
1971
background-position: calc(100% - 4px) center; }
1972
scale.color.vertical:dir(ltr) slider,
1973
scale.vertical contents:first-child:not(:only-child) > trough > slider {
1974
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")); }
1975
scale.color.vertical:dir(ltr) slider:hover,
1976
scale.vertical contents:first-child:not(:only-child) > trough > slider:hover {
1977
background-position: calc(100% - 2px) center; }
1978
scale.color.vertical:dir(ltr) slider:active,
1979
scale.vertical contents:first-child:not(:only-child) > trough > slider:active {
1980
background-position: calc(100% - 0px) center; }
1981
scale.color.fine-tune.vertical:dir(ltr) slider, scale.vertical.fine-tune contents:first-child:not(:only-child) > trough > slider {
1982
background-position: calc(100% - 6px) center; }
1983
scale.color.vertical:dir(ltr) slider,
1984
scale.vertical contents:first-child:not(:only-child) > trough > slider {
1985
min-height: 24px;
1986
min-width: 30px;
1987
margin-right: -16px;
1988
background-position: calc(100% - 4px) center; }
1989
scale.color.vertical:dir(ltr) slider:disabled,
1990
scale.vertical contents:first-child:not(:only-child) > trough > slider:disabled {
1991
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")); }
1992
scale.color.vertical:dir(ltr) slider:hover,
1993
scale.vertical contents:first-child:not(:only-child) > trough > slider:hover {
1994
background-position: calc(100% - 2px) center; }
1995
scale.color.vertical:dir(ltr) slider:active,
1996
scale.vertical contents:first-child:not(:only-child) > trough > slider:active {
1997
background-position: calc(100% - 0px) center; }
1998
scale.color.fine-tune.vertical:dir(ltr) slider, scale.vertical.fine-tune contents:first-child:not(:only-child) > trough > slider {
1999
background-position: calc(100% - 6px) center; }
2000
scale.color {
2001
min-height: 0;
2002
min-width: 0; }
2003
scale.color.horizontal {
2004
padding: 0 0 12px 0; }
2005
scale.color.horizontal trough {
2006
padding-bottom: 4px; }
2007
scale.color.horizontal slider {
2008
margin-bottom: -14px;
2009
margin-top: 0; }
2010
scale.color.vertical:dir(ltr) {
2011
padding: 0 0 0 12px; }
2012
scale.color.vertical:dir(ltr) trough {
2013
padding-left: 4px; }
2014
scale.color.vertical:dir(ltr) slider {
2015
margin-left: -14px;
2016
margin-right: 0; }
2017
scale.color.vertical:dir(rtl) {
2018
padding: 0 12px 0 0; }
2019
scale.color.vertical:dir(rtl) trough {
2020
padding-right: 4px; }
2021
scale.color.vertical:dir(rtl) slider {
2022
margin-right: -14px;
2023
margin-left: 0; }
2024
2025
/*****************
2026
* Progress bars *
2027
*****************/
2028
progressbar {
2029
color: rgba(255, 255, 255, 0.6);
2030
font-size: smaller; }
2031
progressbar.horizontal trough,
2032
progressbar.horizontal progress {
2033
min-height: 4px; }
2034
progressbar.vertical trough,
2035
progressbar.vertical progress {
2036
min-width: 4px; }
2037
progressbar trough {
2038
background-color: rgba(66, 165, 245, 0.3); }
2039
progressbar progress {
2040
background-color: #42A5F5; }
2041
2042
/*************
2043
* Level Bar *
2044
*************/
2045
levelbar block {
2046
min-width: 36px;
2047
min-height: 4px; }
2048
levelbar.vertical block {
2049
min-width: 4px;
2050
min-height: 36px; }
2051
levelbar trough {
2052
padding: 2px;
2053
border-radius: 2px;
2054
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
2055
border-image: none;
2056
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2057
background-color: #546E7A;
2058
color: #FFFFFF; }
2059
levelbar trough:disabled {
2060
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2061
background-color: #4d646f;
2062
color: rgba(255, 255, 255, 0.4); }
2063
levelbar.horizontal.discrete block {
2064
margin: 0 1px; }
2065
levelbar.vertical.discrete block {
2066
margin: 1px 0; }
2067
levelbar.horizontal.discrete trough {
2068
padding: 2px 1px; }
2069
levelbar.vertical.discrete trough {
2070
padding: 1px 2px; }
2071
levelbar block.low {
2072
background-color: #FF6D00; }
2073
levelbar block.high {
2074
background-color: #42A5F5; }
2075
levelbar block.full {
2076
background-color: #00C853; }
2077
levelbar block.empty {
2078
background-color: alpha(currentColor, 0.3);
2079
color: rgba(255, 255, 255, 0.4); }
2080
2081
/****************
2082
* Print dialog *
2083
*****************/
2084
printdialog paper {
2085
padding: 0;
2086
border: 1px solid rgba(0, 0, 0, 0.2);
2087
background: #546E7A;
2088
color: #FFFFFF; }
2089
printdialog .dialog-action-box {
2090
margin: 12px; }
2091
2092
/**********
2093
* Frames *
2094
**********/
2095
frame > border,
2096
.frame {
2097
margin: 0;
2098
padding: 0;
2099
border: 1px solid rgba(0, 0, 0, 0.2);
2100
border-radius: 0;
2101
box-shadow: none; }
2102
frame > border.flat,
2103
.frame.flat {
2104
border-style: none; }
2105
2106
actionbar > revealer > box {
2107
padding: 6px;
2108
border-top: 1px solid rgba(0, 0, 0, 0.2); }
2109
2110
scrolledwindow viewport.frame {
2111
border-style: none; }
2112
scrolledwindow overshoot.top {
2113
background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2114
background-repeat: no-repeat;
2115
background-position: center top;
2116
background-color: transparent;
2117
border: none;
2118
box-shadow: none; }
2119
scrolledwindow overshoot.bottom {
2120
background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2121
background-repeat: no-repeat;
2122
background-position: center bottom;
2123
background-color: transparent;
2124
border: none;
2125
box-shadow: none; }
2126
scrolledwindow overshoot.left {
2127
background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2128
background-repeat: no-repeat;
2129
background-position: left center;
2130
background-color: transparent;
2131
border: none;
2132
box-shadow: none; }
2133
scrolledwindow overshoot.right {
2134
background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2135
background-repeat: no-repeat;
2136
background-position: right center;
2137
background-color: transparent;
2138
border: none;
2139
box-shadow: none; }
2140
scrolledwindow undershoot.top {
2141
background-color: transparent;
2142
background-image: linear-gradient(to left, rgba(84, 110, 122, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
2143
padding-top: 1px;
2144
background-size: 12px 1px;
2145
background-repeat: repeat-x;
2146
background-origin: content-box;
2147
background-position: left top; }
2148
scrolledwindow undershoot.bottom {
2149
background-color: transparent;
2150
background-image: linear-gradient(to left, rgba(84, 110, 122, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
2151
padding-bottom: 1px;
2152
background-size: 12px 1px;
2153
background-repeat: repeat-x;
2154
background-origin: content-box;
2155
background-position: left bottom; }
2156
scrolledwindow undershoot.left {
2157
background-color: transparent;
2158
background-image: linear-gradient(to top, rgba(84, 110, 122, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
2159
padding-left: 1px;
2160
background-size: 1px 12px;
2161
background-repeat: repeat-y;
2162
background-origin: content-box;
2163
background-position: left top; }
2164
scrolledwindow undershoot.right {
2165
background-color: transparent;
2166
background-image: linear-gradient(to top, rgba(84, 110, 122, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
2167
padding-right: 1px;
2168
background-size: 1px 12px;
2169
background-repeat: repeat-y;
2170
background-origin: content-box;
2171
background-position: right top; }
2172
scrolledwindow junction {
2173
border-style: solid none none solid;
2174
border-width: 1px;
2175
border-color: rgba(0, 0, 0, 0.2);
2176
background-color: #546E7A; }
2177
scrolledwindow junction:dir(rtl) {
2178
border-style: solid solid none none; }
2179
2180
separator {
2181
min-width: 1px;
2182
min-height: 1px;
2183
background: rgba(0, 0, 0, 0.2); }
2184
2185
/*********
2186
* Lists *
2187
*********/
2188
list {
2189
border-color: rgba(0, 0, 0, 0.2);
2190
background-color: #546E7A; }
2191
list row {
2192
padding: 2px; }
2193
2194
row {
2195
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0; }
2196
row:hover {
2197
transition: none; }
2198
row.activatable, .view, iconview, treeview.view header button {
2199
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0) 100%, transparent 0%), image(alpha(currentColor, 0)); }
2200
row.activatable:hover, .view:hover, iconview:hover, treeview.view header button:hover {
2201
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0) 100%, transparent 0%), image(alpha(currentColor, 0.05)); }
2202
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 {
2203
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, background-image 0;
2204
animation: row_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards; }
2205
2206
/*********************
2207
* App Notifications *
2208
*********************/
2209
.app-notification,
2210
.app-notification.frame {
2211
margin: 8px; }
2212
.app-notification border,
2213
.app-notification.frame border {
2214
border: none; }
2215
2216
/*************
2217
* Expanders *
2218
*************/
2219
expander arrow {
2220
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
2221
min-width: 16px;
2222
min-height: 16px;
2223
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
2224
-gtk-icon-transform: rotate(-90deg);
2225
color: rgba(255, 255, 255, 0.75); }
2226
expander arrow:dir(rtl) {
2227
-gtk-icon-transform: rotate(90deg); }
2228
expander arrow:checked {
2229
-gtk-icon-transform: unset; }
2230
expander arrow:hover, expander arrow:active {
2231
color: #FFFFFF; }
2232
expander arrow:disabled {
2233
color: rgba(255, 255, 255, 0.3); }
2234
expander arrow:selected {
2235
color: rgba(255, 255, 255, 0.75); }
2236
expander arrow:selected:hover, expander arrow:selected:active {
2237
color: #FFFFFF; }
2238
expander arrow:selected:disabled {
2239
color: rgba(255, 255, 255, 0.3); }
2240
2241
/************
2242
* Calendar *
2243
***********/
2244
calendar {
2245
padding: 1px;
2246
border: 1px solid rgba(0, 0, 0, 0.2);
2247
color: #FFFFFF; }
2248
calendar:disabled {
2249
color: rgba(255, 255, 255, 0.4); }
2250
calendar:selected {
2251
border-radius: 3px; }
2252
calendar.header {
2253
border: none;
2254
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
2255
border-radius: 0; }
2256
calendar:indeterminate {
2257
color: alpha(currentColor, 0.4); }
2258
calendar.highlight {
2259
color: alpha(currentColor, 0.6);
2260
font-weight: 500; }
2261
2262
/***********
2263
* Dialogs *
2264
***********/
2265
messagedialog.background {
2266
background-color: #607D8B; }
2267
messagedialog .titlebar {
2268
min-height: 24px;
2269
border-style: none;
2270
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
2271
background-color: #607D8B; }
2272
messagedialog.csd.background {
2273
border-bottom-left-radius: 2px;
2274
border-bottom-right-radius: 2px; }
2275
messagedialog.csd .dialog-action-area button {
2276
padding: 8px 16px;
2277
border-top: 1px solid rgba(0, 0, 0, 0.2);
2278
border-radius: 0; }
2279
messagedialog.csd .dialog-action-area button:first-child {
2280
border-bottom-left-radius: 2px; }
2281
messagedialog.csd .dialog-action-area button:last-child {
2282
border-bottom-right-radius: 2px; }
2283
2284
filechooser .dialog-action-box {
2285
border-top: 1px solid rgba(0, 0, 0, 0.2); }
2286
filechooser #pathbarbox {
2287
border-bottom: 1px solid rgba(0, 0, 0, 0.2); }
2288
2289
filechooserbutton:drop(active) {
2290
box-shadow: none; }
2291
2292
/***********
2293
* Sidebar *
2294
***********/
2295
.sidebar {
2296
border-style: none;
2297
background-color: #607D8B; }
2298
stacksidebar.sidebar:dir(ltr) list, stacksidebar.sidebar.left list, stacksidebar.sidebar.left:dir(rtl) list, .sidebar:dir(ltr), .sidebar.left, .sidebar.left:dir(rtl) {
2299
border-right: 1px solid rgba(0, 0, 0, 0.2);
2300
border-left-style: none; }
2301
stacksidebar.sidebar:dir(rtl) list
2302
.sidebar:dir(rtl), stacksidebar.sidebar.right list
2303
.sidebar:dir(rtl), .sidebar.right {
2304
border-left: 1px solid rgba(0, 0, 0, 0.2);
2305
border-right-style: none; }
2306
.sidebar list {
2307
background-color: transparent; }
2308
paned .sidebar.left, paned .sidebar.right, paned .sidebar.left:dir(rtl), paned .sidebar:dir(rtl), paned .sidebar:dir(ltr), paned .sidebar {
2309
border-style: none; }
2310
2311
stacksidebar row {
2312
padding: 10px 4px; }
2313
stacksidebar row > label {
2314
padding-left: 6px;
2315
padding-right: 6px; }
2316
2317
/****************
2318
* File chooser *
2319
****************/
2320
placessidebar > viewport.frame {
2321
border-style: none; }
2322
placessidebar row {
2323
min-height: 32px;
2324
padding: 0; }
2325
placessidebar row > revealer {
2326
padding: 0 12px; }
2327
placessidebar row:selected {
2328
color: #FFFFFF; }
2329
placessidebar row:disabled {
2330
color: rgba(255, 255, 255, 0.4); }
2331
placessidebar row image.sidebar-icon {
2332
opacity: 0.6; }
2333
placessidebar row image.sidebar-icon:dir(ltr) {
2334
padding-right: 8px; }
2335
placessidebar row image.sidebar-icon:dir(rtl) {
2336
padding-left: 8px; }
2337
placessidebar row label.sidebar-label:dir(ltr) {
2338
padding-right: 2px; }
2339
placessidebar row label.sidebar-label:dir(rtl) {
2340
padding-left: 2px; }
2341
button.sidebar-button {
2342
min-height: 24px;
2343
min-width: 24px;
2344
margin-top: 0;
2345
margin-bottom: 0;
2346
padding: 0;
2347
border-radius: 100%;
2348
-gtk-outline-radius: 100%; }
2349
placessidebar row.sidebar-placeholder-row {
2350
min-height: 2px;
2351
padding: 0 8px;
2352
background-image: image(#FF4081);
2353
background-clip: content-box; }
2354
placessidebar row.sidebar-new-bookmark-row {
2355
color: #FF4081; }
2356
placessidebar row:drop(active):not(:disabled) {
2357
box-shadow: inset 0 0 0 2px #FF4081; }
2358
2359
placesview .server-list-button > image {
2360
-gtk-icon-transform: rotate(0turn); }
2361
placesview .server-list-button:checked > image {
2362
-gtk-icon-transform: rotate(-0.5turn); }
2363
placesview > actionbar > revealer > box > label {
2364
padding-left: 8px;
2365
padding-right: 8px; }
2366
2367
/*********
2368
* Paned *
2369
*********/
2370
paned > separator {
2371
min-width: 1px;
2372
min-height: 1px;
2373
-gtk-icon-source: none;
2374
border-style: none;
2375
background-color: transparent;
2376
background-image: image(rgba(0, 0, 0, 0.2));
2377
background-size: 1px 1px; }
2378
paned > separator.wide {
2379
min-width: 6px;
2380
min-height: 6px;
2381
background-color: #455A64;
2382
background-image: image(rgba(0, 0, 0, 0.2)), image(rgba(0, 0, 0, 0.2));
2383
background-size: 1px 1px, 1px 1px; }
2384
paned.horizontal > separator {
2385
background-repeat: repeat-y; }
2386
paned.horizontal > separator:dir(ltr) {
2387
margin: 0 -8px 0 0;
2388
padding: 0 8px 0 0;
2389
background-position: left; }
2390
paned.horizontal > separator:dir(rtl) {
2391
margin: 0 0 0 -8px;
2392
padding: 0 0 0 8px;
2393
background-position: right; }
2394
paned.horizontal > separator.wide {
2395
margin: 0;
2396
padding: 0;
2397
background-repeat: repeat-y, repeat-y;
2398
background-position: left, right; }
2399
paned.vertical > separator {
2400
margin: 0 0 -8px 0;
2401
padding: 0 0 8px 0;
2402
background-repeat: repeat-x;
2403
background-position: top; }
2404
paned.vertical > separator.wide {
2405
margin: 0;
2406
padding: 0;
2407
background-repeat: repeat-x, repeat-x;
2408
background-position: bottom, top; }
2409
2410
/**************
2411
* GtkInfoBar *
2412
**************/
2413
infobar {
2414
border-style: none; }
2415
2416
.info {
2417
background-color: #66BB6A; }
2418
2419
.question {
2420
background-color: #42A5F5; }
2421
2422
.warning {
2423
background-color: #FFA726; }
2424
2425
.error {
2426
background-color: #EF5350; }
2427
2428
.info,
2429
.question,
2430
.warning,
2431
.error {
2432
color: #FFFFFF; }
2433
2434
/************
2435
* Tooltips *
2436
************/
2437
tooltip {
2438
border-radius: 2px;
2439
box-shadow: none; }
2440
tooltip.background {
2441
background-color: rgba(84, 110, 122, 0.9); }
2442
tooltip decoration {
2443
background-color: transparent; }
2444
tooltip label {
2445
min-height: 20px;
2446
padding: 2px 2px; }
2447
tooltip * {
2448
padding: 0;
2449
background-color: transparent;
2450
color: inherit; }
2451
2452
/*****************
2453
* Color Chooser *
2454
*****************/
2455
colorswatch.top {
2456
border-top-left-radius: 2.5px;
2457
border-top-right-radius: 2.5px; }
2458
colorswatch.top overlay {
2459
border-top-left-radius: 2px;
2460
border-top-right-radius: 2px; }
2461
colorswatch.bottom {
2462
border-bottom-left-radius: 2.5px;
2463
border-bottom-right-radius: 2.5px; }
2464
colorswatch.bottom overlay {
2465
border-bottom-left-radius: 2px;
2466
border-bottom-right-radius: 2px; }
2467
colorswatch.left, colorswatch:first-child:not(.top) {
2468
border-top-left-radius: 2.5px;
2469
border-bottom-left-radius: 2.5px; }
2470
colorswatch.left overlay, colorswatch:first-child:not(.top) overlay {
2471
border-top-left-radius: 2px;
2472
border-bottom-left-radius: 2px; }
2473
colorswatch.right, colorswatch:last-child:not(.bottom) {
2474
border-top-right-radius: 2.5px;
2475
border-bottom-right-radius: 2.5px; }
2476
colorswatch.right overlay, colorswatch:last-child:not(.bottom) overlay {
2477
border-top-right-radius: 2px;
2478
border-bottom-right-radius: 2px; }
2479
colorswatch.dark overlay {
2480
color: white; }
2481
colorswatch.light overlay {
2482
color: rgba(0, 0, 0, 0.8); }
2483
colorswatch.dark {
2484
color: white; }
2485
colorswatch.light {
2486
color: rgba(0, 0, 0, 0.8); }
2487
colorswatch:drop(active) {
2488
box-shadow: none; }
2489
colorswatch:drop(active).light overlay {
2490
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; }
2491
colorswatch:drop(active).dark overlay {
2492
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; }
2493
colorswatch overlay {
2494
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
2495
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
2496
colorswatch overlay:hover {
2497
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
2498
colorswatch#add-color-button {
2499
border-radius: 2px 2px 0 0;
2500
color: white; }
2501
colorswatch#add-color-button:only-child {
2502
border-radius: 2px; }
2503
colorswatch#add-color-button overlay {
2504
background-image: linear-gradient(to right, #EF5350 25%, #FFA726 25%, #FFA726 50%, #66BB6A 50%, #66BB6A 75%, #42A5F5 75%);
2505
color: white; }
2506
colorswatch:disabled {
2507
opacity: 0.4; }
2508
colorswatch:disabled overlay {
2509
box-shadow: none; }
2510
colorswatch#editor-color-sample {
2511
border-radius: 2.5px; }
2512
colorswatch#editor-color-sample overlay {
2513
border-radius: 2px; }
2514
2515
colorchooser .popover.osd {
2516
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
2517
border-radius: 2px;
2518
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2519
background-color: #546E7A; }
2520
colorchooser .popover.osd:backdrop {
2521
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
2522
2523
/********
2524
* Misc *
2525
********/
2526
.content-view {
2527
background-color: #455A64; }
2528
2529
/**********************
2530
* Window Decorations *
2531
*********************/
2532
decoration {
2533
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
2534
border-radius: 2px 2px 0 0;
2535
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent;
2536
margin: 8px; }
2537
decoration:backdrop {
2538
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent; }
2539
.fullscreen decoration, .tiled decoration {
2540
border-radius: 0; }
2541
.popup decoration {
2542
box-shadow: none; }
2543
.ssd decoration {
2544
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16); }
2545
.csd.popup decoration {
2546
border-radius: 2px;
2547
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
2548
tooltip.csd decoration {
2549
border-radius: 2px;
2550
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
2551
messagedialog.csd decoration {
2552
border-radius: 2px; }
2553
.solid-csd decoration {
2554
margin: 4px;
2555
border-radius: 0;
2556
box-shadow: none;
2557
background-color: #455A64; }
2558
2559
.view:selected, iconview:selected, .view text selection, iconview text selection,
2560
textview text selection, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection, notebook > stack:not(:only-child) revealer entry selection,
2561
notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) selection,
2562
entry selection, modelbutton.flat:selected, popover.background checkbutton:selected,
2563
popover.background radiobutton:selected,
2564
.menuitem.button.flat:selected, row:selected, calendar:selected {
2565
background-color: #42A5F5; }
2566
row:selected label, label:selected, .view:selected, iconview:selected, .view text selection, iconview text selection,
2567
textview text selection, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection, notebook > stack:not(:only-child) revealer entry selection,
2568
notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) selection,
2569
entry selection, modelbutton.flat:selected, popover.background checkbutton:selected,
2570
popover.background radiobutton:selected,
2571
.menuitem.button.flat:selected, row:selected, calendar:selected {
2572
color: #FFFFFF; }
2573
row:selected label:disabled, label:disabled:selected, .view:disabled:selected, iconview:disabled:selected, .view text selection:disabled, iconview text selection:disabled,
2574
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,
2575
notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) selection:disabled,
2576
entry selection:disabled, modelbutton.flat:disabled:selected, popover.background checkbutton:disabled:selected,
2577
popover.background radiobutton:disabled:selected,
2578
.menuitem.button.flat:disabled:selected, row:disabled:selected, calendar:disabled:selected {
2579
color: rgba(255, 255, 255, 0.4); }
2580
2581
.monospace {
2582
font: Monospace; }
2583
2584
/**********************
2585
* Touch Copy & Paste *
2586
*********************/
2587
cursor-handle {
2588
border-radius: 100px;
2589
background-color: #FF4081;
2590
background-image: none; }
2591
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) {
2592
padding-left: 6px;
2593
border-top-right-radius: 0; }
2594
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) {
2595
padding-right: 6px;
2596
border-top-left-radius: 0; }
2597
cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) {
2598
-GtkWidget-text-handle-width: 24;
2599
-GtkWidget-text-handle-height: 30;
2600
-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")); }
2601
2602
.context-menu {
2603
font: initial; }
2604
2605
button.circular {
2606
border-radius: 100px;
2607
-gtk-outline-radius: 100px; }
2608
button.circular label {
2609
padding: 0; }
2610
2611
.keycap {
2612
min-width: 12px;
2613
min-height: 26px;
2614
margin-top: 2px;
2615
padding-bottom: 2px;
2616
padding-left: 8px;
2617
padding-right: 8px;
2618
border: solid 1px rgba(0, 0, 0, 0.2);
2619
border-radius: 3px;
2620
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.2);
2621
background-color: #546E7A;
2622
color: #FFFFFF;
2623
font-size: smaller; }
2624
2625
*:drop(active) {
2626
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0;
2627
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;
2628
caret-color: #FF4081; }
2629
2630
stackswitcher button.text-button {
2631
min-width: 100px; }
2632
2633
stackswitcher button.circular,
2634
stackswitcher button.text-button.circular {
2635
min-width: 36px;
2636
min-height: 36px;
2637
padding: 0; }
2638
2639
.floating-bar {
2640
min-height: 32px;
2641
padding: 0;
2642
border-style: solid solid none;
2643
border-width: 1px;
2644
border-color: rgba(0, 0, 0, 0.2);
2645
border-radius: 3px 3px 0 0;
2646
background-color: #546E7A;
2647
background-clip: border-box;
2648
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, border-width 0; }
2649
.floating-bar.left {
2650
margin-right: 7px;
2651
border-left-style: none;
2652
border-top-left-radius: 0; }
2653
.floating-bar.right {
2654
margin-left: 7px;
2655
border-right-style: none;
2656
border-top-right-radius: 0; }
2657
.floating-bar button {
2658
min-height: 24px;
2659
min-width: 24px;
2660
margin: 4px;
2661
padding: 0; }
2662
2663
/************
2664
* Nautilus *
2665
************/
2666
.nautilus-window,
2667
.nautilus-window notebook,
2668
.nautilus-window notebook > stack {
2669
background: #546E7A; }
2670
2671
.nautilus-desktop-window,
2672
.nautilus-desktop-window notebook,
2673
.nautilus-desktop-window notebook > stack {
2674
background: transparent; }
2675
2676
.nautilus-desktop.nautilus-canvas-item {
2677
color: #FFFFFF;
2678
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
2679
2680
.nautilus-desktop.nautilus-canvas-item:selected {
2681
text-shadow: none; }
2682
2683
@keyframes needs_attention_keyframes {
2684
0% {
2685
background-color: transparent; }
2686
50% {
2687
background-color: alpha(currentColor, 0.3); }
2688
100% {
2689
background-color: transparent; } }
2690
.nautilus-operations-button-needs-attention {
2691
color: #FF4081;
2692
animation: needs_attention_keyframes 2s cubic-bezier(0.4, 0, 0.2, 1); }
2693
2694
.nautilus-operations-button-needs-attention-multiple {
2695
color: #FF4081;
2696
animation: needs_attention_keyframes 2s cubic-bezier(0.4, 0, 0.2, 1);
2697
animation-iteration-count: 2; }
2698
2699
.disk-space-display.unknown {
2700
background-color: #FF6D00; }
2701
2702
.disk-space-display.used {
2703
background-color: #42A5F5; }
2704
2705
.disk-space-display.free {
2706
background-color: alpha(currentColor, 0.3);
2707
color: rgba(255, 255, 255, 0.4); }
2708
2709
.documents-entry-tag {
2710
margin: 3px -2px 3px 8px;
2711
padding: 0 8px;
2712
border-radius: 100px;
2713
box-shadow: none;
2714
background-color: #42A5F5;
2715
color: #FFFFFF; }
2716
.documents-entry-tag:hover {
2717
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
2718
2719
.documents-entry-tag.button {
2720
margin: 0 -2px;
2721
padding: 4px;
2722
border-radius: 100px;
2723
box-shadow: none;
2724
color: rgba(255, 255, 255, 0.75); }
2725
.documents-entry-tag.button:hover, .documents-entry-tag.button:active {
2726
color: #FFFFFF; }
2727
2728
.nautilus-window searchbar {
2729
border-top: 1px solid rgba(0, 0, 0, 0.2); }
2730
2731
.nautilus-window .searchbar-container {
2732
margin-top: -1px; }
2733
2734
/* GTK NAMED COLORS
2735
----------------
2736
use responsibly! */
2737
/*
2738
widget text/foreground color */
2739
@define-color theme_fg_color #FFFFFF;
2740
/*
2741
text color for entries, views and content in general */
2742
@define-color theme_text_color #FFFFFF;
2743
/*
2744
widget base background color */
2745
@define-color theme_bg_color #455A64;
2746
/*
2747
text widgets and the like base background color */
2748
@define-color theme_base_color #546E7A;
2749
/*
2750
base background color of selections */
2751
@define-color theme_selected_bg_color #42A5F5;
2752
/*
2753
text/foreground color of selections */
2754
@define-color theme_selected_fg_color #FFFFFF;
2755
/*
2756
base background color of insensitive widgets */
2757
@define-color insensitive_bg_color #455A64;
2758
/*
2759
text foreground color of insensitive widgets */
2760
@define-color insensitive_fg_color rgba(255, 255, 255, 0.4);
2761
/*
2762
insensitive text widgets and the like base background color */
2763
@define-color insensitive_base_color #4d646f;
2764
/*
2765
widget text/foreground color on backdrop windows */
2766
@define-color theme_unfocused_fg_color #FFFFFF;
2767
/*
2768
text color for entries, views and content in general on backdrop windows */
2769
@define-color theme_unfocused_text_color #FFFFFF;
2770
/*
2771
widget base background color on backdrop windows */
2772
@define-color theme_unfocused_bg_color #455A64;
2773
/*
2774
text widgets and the like base background color on backdrop windows */
2775
@define-color theme_unfocused_base_color #546E7A;
2776
/*
2777
base background color of selections on backdrop windows */
2778
@define-color theme_unfocused_selected_bg_color #42A5F5;
2779
/*
2780
text/foreground color of selections on backdrop windows */
2781
@define-color theme_unfocused_selected_fg_color #FFFFFF;
2782
/*
2783
widgets main borders color */
2784
@define-color borders rgba(0, 0, 0, 0.2);
2785
/*
2786
widgets main borders color on backdrop windows */
2787
@define-color unfocused_borders rgba(0, 0, 0, 0.2);
2788
/*
2789
these are pretty self explicative */
2790
@define-color warning_color #FF6D00;
2791
@define-color error_color #DD2C00;
2792
@define-color success_color #00C853;
2793
@define-color content_view_bg #546E7A;
2794