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