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.css

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