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