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