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