ASCII text, with very long lines (356)
1
@keyframes ripple_effect {
2
to {
3
background-size: 1000% 1000%;
4
}
5
}
6
@keyframes header_ripple_effect {
8
from {
9
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 0%, transparent 0%);
10
}
11
to {
12
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 100%, transparent 0%);
13
}
14
}
15
* {
17
background-clip: padding-box;
18
-GtkToolButton-icon-spacing: 0;
19
-GtkTextView-error-underline-color: #DD2C00;
20
-GtkScrolledWindow-scrollbar-spacing: 0;
21
-GtkToolItemGroup-expander-size: 11;
22
-GtkWidget-text-handle-width: 24;
23
-GtkWidget-text-handle-height: 24;
24
-GtkDialog-button-spacing: 4;
25
-GtkDialog-action-area-border: 0;
26
outline-style: solid;
27
outline-width: 2px;
28
outline-color: transparent;
29
outline-offset: -4px;
30
-gtk-outline-radius: 2px;
31
-gtk-secondary-caret-color: #42A5F5;
32
}
33
switch:focus slider,
35
notebook:focus tab,
36
*:focus {
37
outline-color: alpha(currentColor, 0.3);
38
}
39
/***************
41
* Base States *
42
***************/
43
.background {
44
background-color: #F5F5F5;
45
color: rgba(0, 0, 0, 0.8);
46
}
47
/*
49
These wildcard seems unavoidable, need to investigate.
50
Wildcards are bad and troublesome, use them with care,
51
or better, just don't.
52
Everytime a wildcard is used a kitten dies, painfully.
53
*/
54
*:disabled {
55
-gtk-icon-effect: dim;
56
}
57
.gtkstyle-fallback {
59
background-color: #F5F5F5;
60
color: rgba(0, 0, 0, 0.8);
61
}
62
.gtkstyle-fallback:hover {
64
background-color: #e8e8e8;
65
color: rgba(0, 0, 0, 0.8);
66
}
67
.gtkstyle-fallback:active {
69
background-color: gainsboro;
70
color: rgba(0, 0, 0, 0.8);
71
}
72
.gtkstyle-fallback:disabled {
74
background-color: #F5F5F5;
75
color: rgba(0, 0, 0, 0.32);
76
}
77
.gtkstyle-fallback:selected {
79
background-color: #42A5F5;
80
color: #FFFFFF;
81
}
82
.view {
84
background-color: #FFFFFF;
85
color: rgba(0, 0, 0, 0.8);
86
}
87
.view:disabled {
89
color: rgba(0, 0, 0, 0.32);
90
}
91
textview text {
93
background-color: #FFFFFF;
94
}
95
textview border {
97
background-color: #FAFAFA;
98
}
99
iconview, .nautilus-canvas-item, .caja-canvas-item {
101
border-radius: 2px;
102
}
103
.rubberband,
105
rubberband,
106
flowbox rubberband,
107
treeview.view rubberband,
108
.content-view rubberband,
109
.content-view .rubberband {
110
border: 1px solid #40C4FF;
111
background-color: rgba(64, 196, 255, 0.3);
112
}
113
flowbox flowboxchild {
115
padding: 4px;
116
border-radius: 2px;
117
}
118
.content-view .tile:selected {
120
background-color: transparent;
121
color: inherit;
122
}
123
label {
125
caret-color: currentColor;
126
}
127
label.separator {
129
color: rgba(0, 0, 0, 0.8);
130
}
131
label selection {
133
background-color: #42A5F5;
134
color: #FFFFFF;
135
}
136
label:disabled {
138
color: rgba(0, 0, 0, 0.32);
139
}
140
tab label:disabled,
142
button label:disabled {
143
color: inherit;
144
}
145
.dim-label, label.separator, .titlebar:not(headerbar) .subtitle,
147
headerbar .subtitle {
148
opacity: 0.6;
149
}
150
assistant .sidebar {
152
padding: 4px 0;
153
}
154
assistant .sidebar label {
156
min-height: 36px;
157
padding: 0 12px;
158
color: rgba(0, 0, 0, 0.48);
159
font-weight: 500;
160
}
161
assistant .sidebar label.highlight {
163
color: rgba(0, 0, 0, 0.8);
164
}
165
popover.background.touch-selection, popover.background.magnifier, popover.background.osd, .app-notification, .osd .scale-popup, .nautilus-window .floating-bar, .osd {
167
opacity: 0.9;
168
}
169
/*********************
171
* Spinner Animation *
172
*********************/
173
@keyframes spin {
174
to {
175
-gtk-icon-transform: rotate(1turn);
176
}
177
}
178
@keyframes spin_colors {
180
1% {
181
color: #66BB6A;
182
}
183
25% {
184
color: #66BB6A;
185
}
186
26% {
187
color: #42A5F5;
188
}
189
50% {
190
color: #42A5F5;
191
}
192
51% {
193
color: #FFA726;
194
}
195
75% {
196
color: #FFA726;
197
}
198
76% {
199
color: #EF5350;
200
}
201
100% {
202
color: #EF5350;
203
}
204
}
205
spinner {
207
background: none;
208
opacity: 0;
209
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
210
}
211
spinner:checked {
213
opacity: 1;
214
animation: spin 1s linear infinite, spin_colors 4s linear infinite;
215
}
216
spinner:checked:disabled {
218
opacity: 0.4;
219
}
220
/****************
222
* Text Entries *
223
****************/
224
spinbutton:not(.vertical),
225
entry {
226
min-height: 36px;
227
padding: 0 8px;
228
border-radius: 2px;
229
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
230
border-image: none;
231
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
232
background-color: #FFFFFF;
233
color: rgba(0, 0, 0, 0.8);
234
}
235
spinbutton:focus:not(.vertical),
237
entry:focus {
238
border-image: none;
239
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
240
}
241
spinbutton:disabled:not(.vertical),
243
entry:disabled {
244
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
245
background-color: #FAFAFA;
246
color: rgba(0, 0, 0, 0.32);
247
}
248
spinbutton.flat:not(.vertical), notebook > stack:not(:only-child) entry:not(.search),
250
notebook > stack:not(:only-child) spinbutton:not(.vertical), colorchooser .popover.osd spinbutton:not(.vertical), layoutpane entry.search, editortweak entry.search, #login_window entry,
251
entry.flat {
252
border-radius: 0;
253
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
254
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
255
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
256
background-color: transparent;
257
color: rgba(0, 0, 0, 0.8);
258
}
259
spinbutton.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry:focus:not(.search),
261
notebook > stack:not(:only-child) spinbutton:focus:not(.vertical), colorchooser .popover.osd spinbutton:focus:not(.vertical), layoutpane entry.search:focus, editortweak entry.search:focus, #login_window entry:focus,
262
entry.flat:focus {
263
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
264
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
265
}
266
spinbutton.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry:disabled:not(.search),
268
notebook > stack:not(:only-child) spinbutton:disabled:not(.vertical), colorchooser .popover.osd spinbutton:disabled:not(.vertical), layoutpane entry.search:disabled, editortweak entry.search:disabled, #login_window entry:disabled,
269
entry.flat:disabled {
270
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
271
background-color: transparent;
272
color: rgba(0, 0, 0, 0.32);
273
}
274
spinbutton:not(.vertical) image,
276
entry image {
277
color: alpha(currentColor, 0.75);
278
}
279
spinbutton:not(.vertical) image:hover, spinbutton:not(.vertical) image:active,
281
entry image:hover,
282
entry image:active {
283
color: currentColor;
284
}
285
spinbutton:not(.vertical) image:disabled,
287
entry image:disabled {
288
color: alpha(currentColor, 0.6);
289
}
290
spinbutton:not(.vertical) image.left,
292
entry image.left {
293
margin-left: 2px;
294
margin-right: 6px;
295
}
296
spinbutton:not(.vertical) image.right,
298
entry image.right {
299
margin-left: 6px;
300
margin-right: 2px;
301
}
302
spinbutton:not(.vertical) undershoot.left,
304
entry undershoot.left {
305
background-color: transparent;
306
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
307
padding-left: 1px;
308
background-size: 1px 12px;
309
background-repeat: repeat-y;
310
background-origin: content-box;
311
background-position: left top;
312
}
313
spinbutton:not(.vertical) undershoot.right,
315
entry undershoot.right {
316
background-color: transparent;
317
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
318
padding-right: 1px;
319
background-size: 1px 12px;
320
background-repeat: repeat-y;
321
background-origin: content-box;
322
background-position: right top;
323
}
324
spinbutton.error:not(.vertical),
326
entry.error {
327
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
328
border-image: none;
329
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
330
background-color: #DD2C00;
331
color: #FFFFFF;
332
}
333
spinbutton.error:focus:not(.vertical),
335
entry.error:focus {
336
border-image: none;
337
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
338
}
339
spinbutton.error:disabled:not(.vertical),
341
entry.error:disabled {
342
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
343
background-color: #FAFAFA;
344
color: rgba(0, 0, 0, 0.32);
345
}
346
spinbutton.error.flat:not(.vertical), notebook > stack:not(:only-child) entry.error:not(.search),
348
notebook > stack:not(:only-child) spinbutton.error:not(.vertical), colorchooser .popover.osd spinbutton.error:not(.vertical), layoutpane entry.error.search, editortweak entry.error.search, #login_window entry.error,
349
entry.error.flat {
350
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
351
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #DD2C00 0%, transparent 0%) 0 0 0/0 0 0px;
352
box-shadow: inset 0 -1px #DD2C00;
353
background-color: transparent;
354
color: rgba(0, 0, 0, 0.8);
355
}
356
spinbutton.error.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry.error:focus:not(.search),
358
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, #login_window entry.error:focus,
359
entry.error.flat:focus {
360
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #DD2C00 100%, transparent 0%) 0 0 2/0 0 2px;
361
box-shadow: inset 0 -1px #DD2C00;
362
}
363
spinbutton.error.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry.error:disabled:not(.search),
365
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, #login_window entry.error:disabled,
366
entry.error.flat:disabled {
367
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
368
background-color: transparent;
369
color: rgba(0, 0, 0, 0.32);
370
}
371
spinbutton.warning:not(.vertical),
373
entry.warning {
374
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
375
border-image: none;
376
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
377
background-color: #FF6D00;
378
color: #FFFFFF;
379
}
380
spinbutton.warning:focus:not(.vertical),
382
entry.warning:focus {
383
border-image: none;
384
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
385
}
386
spinbutton.warning:disabled:not(.vertical),
388
entry.warning:disabled {
389
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
390
background-color: #FAFAFA;
391
color: rgba(0, 0, 0, 0.32);
392
}
393
spinbutton.warning.flat:not(.vertical), notebook > stack:not(:only-child) entry.warning:not(.search),
395
notebook > stack:not(:only-child) spinbutton.warning:not(.vertical), colorchooser .popover.osd spinbutton.warning:not(.vertical), layoutpane entry.warning.search, editortweak entry.warning.search, #login_window entry.warning,
396
entry.warning.flat {
397
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
398
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FF6D00 0%, transparent 0%) 0 0 0/0 0 0px;
399
box-shadow: inset 0 -1px #FF6D00;
400
background-color: transparent;
401
color: rgba(0, 0, 0, 0.8);
402
}
403
spinbutton.warning.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry.warning:focus:not(.search),
405
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, #login_window entry.warning:focus,
406
entry.warning.flat:focus {
407
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FF6D00 100%, transparent 0%) 0 0 2/0 0 2px;
408
box-shadow: inset 0 -1px #FF6D00;
409
}
410
spinbutton.warning.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry.warning:disabled:not(.search),
412
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, #login_window entry.warning:disabled,
413
entry.warning.flat:disabled {
414
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
415
background-color: transparent;
416
color: rgba(0, 0, 0, 0.32);
417
}
418
spinbutton:not(.vertical) progress,
420
entry progress {
421
margin: 2px -6px;
422
border-bottom: 2px solid #42A5F5;
423
background-color: transparent;
424
}
425
.linked:not(.vertical) > spinbutton.flat:not(.vertical), notebook > stack:not(:only-child) .linked:not(.vertical) > entry:not(.search),
427
notebook > stack:not(:only-child) .linked:not(.vertical) > spinbutton:not(.vertical), colorchooser .popover.osd .linked:not(.vertical) > spinbutton:not(.vertical), layoutpane .linked:not(.vertical) > entry.search, editortweak .linked:not(.vertical) > entry.search, #login_window .linked:not(.vertical) > entry,
428
.linked.vertical > spinbutton.flat:not(.vertical), notebook > stack:not(:only-child)
429
.linked.vertical > entry:not(.search),
430
notebook > stack:not(:only-child)
431
.linked.vertical > spinbutton:not(.vertical), colorchooser .popover.osd
432
.linked.vertical > spinbutton:not(.vertical), layoutpane
433
.linked.vertical > entry.search, editortweak
434
.linked.vertical > entry.search, #login_window
435
.linked.vertical > entry, .linked:not(.vertical) >
436
entry.flat,
437
.linked.vertical >
438
entry.flat {
439
border-radius: 0;
440
}
441
treeview entry.flat, treeview entry {
443
min-height: 0;
444
padding: 2px;
445
border-radius: 0;
446
background-color: #FFFFFF;
447
}
448
treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:focus {
450
border-image: none;
451
box-shadow: none;
452
}
453
/***********
455
* Buttons *
456
***********/
457
@keyframes needs_attention {
458
from {
459
background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent));
460
}
461
to {
462
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#FF4081), to(transparent));
463
}
464
}
465
button {
468
min-height: 24px;
469
min-width: 16px;
470
padding: 6px 10px;
471
border-radius: 2px;
472
font-weight: 500;
473
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1), background-size 0.5s cubic-bezier(0, 0, 0.2, 1), background-image 1s cubic-bezier(0, 0, 0.2, 1);
474
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 0 0 9999px transparent;
475
background-color: #FAFAFA;
476
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
477
background-repeat: no-repeat;
478
background-position: center;
479
background-size: 1000% 1000%;
480
color: rgba(0, 0, 0, 0.6);
481
}
482
button:hover {
485
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 0 0 9999px transparent;
486
color: rgba(0, 0, 0, 0.8);
487
}
488
button:active {
491
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
492
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
493
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 0 0 9999px alpha(currentColor, 0.15);
494
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
495
background-size: 0% 0%;
496
color: rgba(0, 0, 0, 0.8);
497
}
498
button:disabled {
501
box-shadow: none;
502
background-color: alpha(currentColor, 0.3);
503
color: rgba(0, 0, 0, 0.24);
504
}
505
button:checked {
508
background-color: #42A5F5;
509
color: #FFFFFF;
510
}
511
button:checked:disabled {
514
background-color: alpha(currentColor, 0.3);
515
color: rgba(66, 165, 245, 0.4);
516
}
517
modelbutton.flat,
519
.menuitem.button.flat, spinbutton:not(.vertical) button, spinbutton.vertical button, popover.background.menu button,
520
popover.background button.model, notebook > header > tabs > arrow, scrollbar button, check,
521
radio, calendar.button, messagedialog.csd .dialog-action-area button, button.sidebar-button, .gedit-search-slider button, PanelToplevel > widget > button, .lightdm-gtk-greeter button, :not(headerbar) .caja-pathbar button, .caja-pathbar :not(headerbar) button, :not(headerbar)
522
.path-bar button, layouttabbar button, .mate-panel-menu-bar #PanelApplet button:not(.flat), toolbar button, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
523
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,
524
button.flat {
525
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0.5s cubic-bezier(0, 0, 0.2, 1), background-image 1s cubic-bezier(0, 0, 0.2, 1);
526
box-shadow: inset 0 0 0 9999px transparent;
527
background-color: transparent;
528
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
529
background-repeat: no-repeat;
530
background-position: center;
531
background-size: 1000% 1000%;
532
color: alpha(currentColor, 0.75);
533
}
534
modelbutton.flat:hover,
536
.menuitem.button.flat:hover, spinbutton:not(.vertical) button:hover, spinbutton.vertical button:hover, popover.background.menu button:hover,
537
popover.background button.model:hover, notebook > header > tabs > arrow:hover, scrollbar button:hover, check:hover,
538
radio:hover, calendar.button:hover, messagedialog.csd .dialog-action-area button:hover, button.sidebar-button:hover, .gedit-search-slider button:hover, PanelToplevel > widget > button:hover, .lightdm-gtk-greeter button:hover, :not(headerbar) .caja-pathbar button:hover, .caja-pathbar :not(headerbar) button:hover, :not(headerbar)
539
.path-bar button:hover, layouttabbar button:hover, .mate-panel-menu-bar #PanelApplet button:hover:not(.flat), toolbar button:hover, .titlebar:not(headerbar) button:hover:not(.suggested-action):not(.destructive-action),
540
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,
541
button.flat:hover {
542
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
543
color: currentColor;
544
}
545
modelbutton.flat:active,
547
.menuitem.button.flat:active, spinbutton:not(.vertical) button:active, spinbutton.vertical button:active, popover.background.menu button:active,
548
popover.background button.model:active, notebook > header > tabs > arrow:active, scrollbar button:active, check:active,
549
radio:active, calendar.button:active, messagedialog.csd .dialog-action-area button:active, button.sidebar-button:active, .gedit-search-slider button:active, PanelToplevel > widget > button:active, .lightdm-gtk-greeter button:active, :not(headerbar) .caja-pathbar button:active, .caja-pathbar :not(headerbar) button:active, :not(headerbar)
550
.path-bar button:active, layouttabbar button:active, .mate-panel-menu-bar #PanelApplet button:active:not(.flat), toolbar button:active, .titlebar:not(headerbar) button:active:not(.suggested-action):not(.destructive-action),
551
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,
552
button.flat:active {
553
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
554
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
555
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
556
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
557
background-size: 0% 0%;
558
color: currentColor;
559
}
560
modelbutton.flat:disabled,
562
.menuitem.button.flat:disabled, spinbutton:not(.vertical) button:disabled, spinbutton.vertical button:disabled, popover.background.menu button:disabled,
563
popover.background button.model:disabled, notebook > header > tabs > arrow:disabled, scrollbar button:disabled, check:disabled,
564
radio:disabled, calendar.button:disabled, messagedialog.csd .dialog-action-area button:disabled, button.sidebar-button:disabled, .gedit-search-slider button:disabled, PanelToplevel > widget > button:disabled, .lightdm-gtk-greeter button:disabled, :not(headerbar) .caja-pathbar button:disabled, .caja-pathbar :not(headerbar) button:disabled, :not(headerbar)
565
.path-bar button:disabled, layouttabbar button:disabled, .mate-panel-menu-bar #PanelApplet button:disabled:not(.flat), toolbar button:disabled, .titlebar:not(headerbar) button:disabled:not(.suggested-action):not(.destructive-action),
566
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,
567
button.flat:disabled {
568
box-shadow: none;
569
background-color: transparent;
570
color: alpha(currentColor, 0.3);
571
}
572
:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar)
574
.path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar #PanelApplet button:checked:not(.flat), toolbar button:checked, .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action),
575
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,
576
button.flat:checked {
577
background-color: alpha(currentColor, 0.3);
578
color: currentColor;
579
}
580
:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar)
582
.path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar #PanelApplet button:checked:disabled:not(.flat), toolbar button:checked:disabled, .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action),
583
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,
584
button.flat:checked:disabled {
585
background-color: alpha(currentColor, 0.3);
586
color: alpha(currentColor, 0.4);
587
}
588
button.text-button {
591
padding-left: 16px;
592
padding-right: 16px;
593
}
594
button.image-button {
597
min-width: 24px;
598
padding: 6px;
599
}
600
button.text-button.image-button label:first-child {
603
margin-left: 10px;
604
}
605
button.text-button.image-button label:last-child {
608
margin-right: 10px;
609
}
610
button.text-button.image-button image:not(:only-child) {
613
margin: 0 4px;
614
}
615
toolbar .linked > button, .titlebar:not(headerbar) .linked > button:not(.suggested-action):not(.destructive-action),
617
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
618
.linked.vertical > button, .titlebar:not(headerbar)
619
.linked.vertical > button:not(.suggested-action):not(.destructive-action),
620
headerbar
621
.linked.vertical > button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box
622
.linked.vertical > button:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification
623
.linked.vertical > button, .linked >
624
button.flat,
625
.linked.vertical >
626
button.flat {
627
border-radius: 2px;
628
}
629
infobar.info button:disabled, infobar.question button:disabled, infobar.warning button:disabled, infobar.error button:disabled, row:selected
631
button:disabled {
632
color: rgba(255, 255, 255, 0.3);
633
}
634
button.osd {
637
padding: 12px 16px;
638
}
639
button.osd.image-button {
642
padding: 12px;
643
}
644
button.osd:disabled {
647
opacity: 0;
648
}
649
button.suggested-action {
652
background-color: #FF4081;
653
color: #FFFFFF;
654
}
655
button.suggested-action:disabled {
658
box-shadow: none;
659
background-color: alpha(currentColor, 0.3);
660
color: rgba(0, 0, 0, 0.32);
661
}
662
button.suggested-action:checked {
665
background-color: #ff79a7;
666
}
667
button.suggested-action.flat {
670
background-color: transparent;
671
color: #FF4081;
672
}
673
button.suggested-action.flat:disabled {
676
box-shadow: none;
677
background-color: transparent;
678
color: alpha(currentColor, 0.4);
679
}
680
button.suggested-action.flat:checked {
683
background-color: alpha(currentColor, 0.3);
684
}
685
button.destructive-action {
688
background-color: #FF5252;
689
color: #FFFFFF;
690
}
691
button.destructive-action:disabled {
694
box-shadow: none;
695
background-color: alpha(currentColor, 0.3);
696
color: rgba(0, 0, 0, 0.32);
697
}
698
button.destructive-action:checked {
701
background-color: #ff8686;
702
}
703
button.destructive-action.flat {
706
background-color: transparent;
707
color: #FF5252;
708
}
709
button.destructive-action.flat:disabled {
712
box-shadow: none;
713
background-color: transparent;
714
color: alpha(currentColor, 0.4);
715
}
716
button.destructive-action.flat:checked {
719
background-color: alpha(currentColor, 0.3);
720
}
721
.stack-switcher >
723
button {
724
outline-offset: -4px;
725
}
726
.stack-switcher >
728
button > label {
729
padding-left: 6px;
730
padding-right: 6px;
731
}
732
.stack-switcher >
734
button > image {
735
padding-left: 6px;
736
padding-right: 6px;
737
padding-top: 3px;
738
padding-bottom: 3px;
739
}
740
.stack-switcher >
742
button.text-button {
743
padding-left: 10px;
744
padding-right: 10px;
745
}
746
.stack-switcher >
748
button.image-button {
749
padding-left: 4px;
750
padding-right: 4px;
751
}
752
.stack-switcher >
754
button.needs-attention:checked > label,
755
.stack-switcher >
756
button.needs-attention:checked > image {
757
animation: none;
758
background-image: none;
759
}
760
button separator {
763
min-width: 0;
764
min-height: 0;
765
background-color: transparent;
766
}
767
.primary-toolbar
769
button {
770
-gtk-icon-shadow: none;
771
}
772
button.image-button:not(.text-button), toolbar .linked > button.image-button:not(.text-button), .titlebar:not(headerbar) .linked > button.image-button:not(.text-button):not(.suggested-action):not(.destructive-action),
775
headerbar .linked > button.image-button:not(.text-button):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked > button.image-button:not(.text-button):not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification .linked > button.image-button:not(.text-button), toolbar
776
.linked.vertical > button.image-button:not(.text-button),
777
headerbar
778
.linked.vertical > button.image-button:not(.text-button):not(.suggested-action):not(.destructive-action), .app-notification
779
.linked.vertical > button.image-button:not(.text-button), .linked > button.flat.image-button:not(.text-button),
780
.linked.vertical > button.flat.image-button:not(.text-button), .inline-toolbar button:not(.text-button), check,
781
radio, button.titlebutton, .nautilus-window headerbar > revealer > button,
782
button.close,
783
button.circular {
784
border-radius: 9999px;
785
-gtk-outline-radius: 9999px;
786
}
787
spinbutton:not(.vertical) button, notebook > header tab button.flat, button.sidebar-button, .nautilus-window .floating-bar button, .gedit-document-panel row button.flat, .gedit-search-slider button:dir(ltr), .gedit-search-slider button:dir(rtl), .pluma-window paned.horizontal box.vertical box.horizontal button.flat {
789
min-height: 24px;
790
min-width: 24px;
791
padding: 0;
792
border-radius: 9999px;
793
-gtk-outline-radius: 9999px;
794
}
795
.stack-switcher >
797
button.needs-attention > label,
798
.stack-switcher >
799
button.needs-attention > image, stacksidebar row.needs-attention > label {
800
animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
801
background-repeat: no-repeat;
802
background-position: right 3px;
803
background-size: 6px 6px;
804
}
805
.stack-switcher >
807
button.needs-attention > label:dir(rtl),
808
.stack-switcher >
809
button.needs-attention > image:dir(rtl), stacksidebar row.needs-attention > label:dir(rtl) {
810
background-position: left 3px;
811
}
812
.linked:not(.vertical) > combobox:not(:only-child) > box > button.combo, .linked:not(.vertical) > spinbutton:not(:only-child):not(.vertical), .linked:not(.vertical) > entry:not(:only-child), .linked > button:not(:only-child) {
814
border-radius: 0;
815
-gtk-outline-radius: 2px;
816
}
817
.linked:not(.vertical) > combobox:not(:only-child):first-child > box > button.combo, .linked:not(.vertical) > spinbutton:not(:only-child):first-child:not(.vertical), .linked:not(.vertical) > entry:not(:only-child):first-child, .linked > button:not(:only-child):first-child, combobox.linked button:not(:only-child):nth-child(2):dir(rtl) {
819
border-radius: 2px 0 0 2px;
820
}
821
.linked:not(.vertical) > combobox:not(:only-child):last-child > box > button.combo, .linked:not(.vertical) > spinbutton:not(:only-child):last-child:not(.vertical), .linked:not(.vertical) > entry:not(:only-child):last-child, .linked > button:not(:only-child):last-child, combobox.linked button:not(:only-child):nth-child(2):dir(ltr) {
823
border-radius: 0 2px 2px 0;
824
}
825
.linked.vertical > combobox:not(:only-child) > box > button.combo, .linked.vertical > spinbutton:not(:only-child):not(.vertical), .linked.vertical > entry:not(:only-child), .linked.vertical > button:not(:only-child) {
827
border-radius: 0;
828
-gtk-outline-radius: 2px;
829
}
830
.linked.vertical > combobox:not(:only-child):first-child > box > button.combo, .linked.vertical > spinbutton:not(:only-child):first-child:not(.vertical), .linked.vertical > entry:not(:only-child):first-child, .linked.vertical > button:not(:only-child):first-child {
832
border-radius: 2px 2px 0 0;
833
}
834
.linked.vertical > combobox:not(:only-child):last-child > box > button.combo, .linked.vertical > spinbutton:not(:only-child):last-child:not(.vertical), .linked.vertical > entry:not(:only-child):last-child, .linked.vertical > button:not(:only-child):last-child {
836
border-radius: 0 0 2px 2px;
837
}
838
/* menu buttons */
840
modelbutton.flat,
841
.menuitem.button.flat {
842
min-height: 28px;
843
padding: 0 8px;
844
border-radius: 2px;
845
color: inherit;
846
}
847
modelbutton.flat check,
849
modelbutton.flat radio,
850
.menuitem.button.flat check,
851
.menuitem.button.flat radio {
852
box-shadow: none;
853
background-image: none;
854
}
855
modelbutton.flat check:not(:checked):not(:indeterminate),
857
modelbutton.flat radio:not(:checked):not(:indeterminate),
858
.menuitem.button.flat check:not(:checked):not(:indeterminate),
859
.menuitem.button.flat radio:not(:checked):not(:indeterminate) {
860
color: alpha(currentColor, 0.6);
861
}
862
modelbutton.flat check:last-child,
864
modelbutton.flat radio:last-child,
865
.menuitem.button.flat check:last-child,
866
.menuitem.button.flat radio:last-child {
867
margin-left: -8px;
868
margin-right: -16px;
869
}
870
modelbutton.flat check:first-child,
872
modelbutton.flat radio:first-child,
873
.menuitem.button.flat check:first-child,
874
.menuitem.button.flat radio:first-child {
875
margin-left: -16px;
876
margin-right: -8px;
877
}
878
modelbutton.flat arrow {
880
background: none;
881
}
882
modelbutton.flat arrow:hover {
884
background: none;
885
}
886
modelbutton.flat arrow.left {
888
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
889
}
890
modelbutton.flat arrow.right {
892
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
893
}
894
button.color {
896
min-height: 24px;
897
min-width: 24px;
898
padding: 6px;
899
}
900
/*********
902
* Links *
903
*********/
904
*:link, button:link,
905
button:visited, *:link:hover, button:hover:link,
906
button:hover:visited, *:link:active, button:active:link,
907
button:active:visited {
908
color: #42A5F5;
909
}
910
*:link:visited,
912
button:visited, *:link:visited:hover,
913
button:visited:hover, *:link:visited:active,
914
button:visited:active {
915
color: #E040FB;
916
}
917
infobar.info *:link, infobar.info button:link, infobar.info
919
button:visited, infobar.question *:link, infobar.question button:link, infobar.question
920
button:visited, infobar.warning *:link, infobar.warning button:link, infobar.warning
921
button:visited, infobar.error *:link, infobar.error button:link, infobar.error
922
button:visited, *:link:selected, button:selected:link,
923
button:selected:visited, .selection-mode.titlebar:not(headerbar) .subtitle:link,
924
headerbar.selection-mode .subtitle:link,
925
*:selected *:link,
926
*:selected button:link,
927
*:selected
928
button:visited {
929
color: #FFFFFF;
930
}
931
button:link > label,
933
button:visited > label {
934
text-decoration-line: underline;
935
}
936
/*****************
938
* GtkSpinButton *
939
*****************/
940
spinbutton:not(.vertical) {
941
padding: 0;
942
}
943
notebook > stack:not(:only-child) spinbutton:not(.vertical) entry, notebook > stack:not(:only-child) spinbutton:not(.vertical) entry:focus, notebook > stack:not(:only-child) spinbutton:not(.vertical) entry:disabled,
945
spinbutton:not(.vertical) entry {
946
min-width: 32px;
947
margin: 0;
948
border-image: none;
949
border-radius: 0;
950
box-shadow: none;
951
background-color: transparent;
952
}
953
spinbutton:not(.vertical) button {
955
border: solid 6px transparent;
956
}
957
spinbutton:not(.vertical) button.up:dir(ltr), spinbutton:not(.vertical) button.down:dir(rtl) {
959
margin-left: -3px;
960
}
961
spinbutton:not(.vertical) button.up:dir(rtl), spinbutton:not(.vertical) button.down:dir(ltr) {
963
margin-right: -3px;
964
}
965
spinbutton.vertical:disabled {
967
color: rgba(0, 0, 0, 0.32);
968
}
969
spinbutton.vertical:drop(active) {
971
box-shadow: none;
972
}
973
spinbutton.vertical entry {
975
min-height: 36px;
976
min-width: 48px;
977
padding: 0;
978
}
979
spinbutton.vertical button {
981
min-height: 36px;
982
min-width: 48px;
983
padding: 0;
984
}
985
spinbutton.vertical button.up {
987
border-radius: 2px 2px 0 0;
988
}
989
spinbutton.vertical button.down {
991
border-radius: 0 0 2px 2px;
992
}
993
treeview spinbutton:not(.vertical) {
995
min-height: 0;
996
border-style: none;
997
border-radius: 0;
998
}
999
treeview spinbutton:not(.vertical) entry {
1001
min-height: 0;
1002
padding: 1px 2px;
1003
}
1004
/**************
1006
* ComboBoxes *
1007
**************/
1008
combobox arrow {
1009
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1010
min-height: 16px;
1011
min-width: 16px;
1012
}
1013
combobox decoration,
1015
combobox button.combo:checked {
1016
transition: none;
1017
}
1018
combobox button.combo cellview:dir(ltr) {
1020
margin-left: -2px;
1021
}
1022
combobox button.combo cellview:dir(rtl) {
1024
margin-right: -2px;
1025
}
1026
combobox #gtk-combobox-popup-menu {
1028
padding: 2px 0;
1029
}
1030
combobox #gtk-combobox-popup-menu menuitem {
1032
min-height: 32px;
1033
padding: 0 8px;
1034
}
1035
combobox #gtk-combobox-popup-menu > arrow.top {
1037
margin-top: -2px;
1038
}
1039
combobox #gtk-combobox-popup-menu > arrow.bottom {
1041
margin-bottom: -6px;
1042
}
1043
combobox:drop(active) {
1045
box-shadow: none;
1046
}
1047
notebook > stack:not(:only-child) button.combo, #login_window #user_combobox button {
1049
border-radius: 0;
1050
background-image: none;
1051
font-weight: inherit;
1052
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1053
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1054
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
1055
background-color: transparent;
1056
color: rgba(0, 0, 0, 0.8);
1057
}
1058
notebook > stack:not(:only-child) button.combo:hover, #login_window #user_combobox button:hover {
1060
box-shadow: inset 0 -2px alpha(currentColor, 0.3);
1061
}
1062
notebook > stack:not(:only-child) button.combo:checked, #login_window #user_combobox button:checked {
1064
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1065
}
1066
notebook > stack:not(:only-child) button.combo:disabled, #login_window #user_combobox button:disabled {
1068
color: rgba(0, 0, 0, 0.32);
1069
}
1070
/************
1072
* Toolbars *
1073
************/
1074
toolbar {
1075
-GtkWidget-window-dragging: true;
1076
padding: 3px;
1077
background-color: #F5F5F5;
1078
}
1079
.osd toolbar {
1081
background-color: transparent;
1082
}
1083
toolbar.osd, .app-notification, frame.documents-dropdown {
1085
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1086
padding: 6px;
1087
border-radius: 2px;
1088
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);
1089
background-color: #FFFFFF;
1090
}
1091
toolbar.osd:backdrop, .app-notification:backdrop, frame.documents-dropdown:backdrop {
1093
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);
1094
}
1095
toolbar.osd.left, .left.app-notification, frame.left.documents-dropdown, toolbar.osd.right, .right.app-notification, frame.right.documents-dropdown, toolbar.osd.top, .top.app-notification, frame.top.documents-dropdown, toolbar.osd.bottom, .bottom.app-notification, frame.bottom.documents-dropdown {
1097
border-radius: 0;
1098
}
1099
toolbar.horizontal separator {
1101
margin: 3px;
1102
}
1103
toolbar.vertical separator {
1105
margin: 3px;
1106
}
1107
toolbar:not(.inline-toolbar):not(.osd) scale,
1109
toolbar:not(.inline-toolbar):not(.osd) entry,
1110
toolbar:not(.inline-toolbar):not(.osd) spinbutton,
1111
toolbar:not(.inline-toolbar):not(.osd) button {
1112
margin: 3px;
1113
}
1114
toolbar:not(.inline-toolbar):not(.osd) .linked entry:not(:first-child),
1116
toolbar:not(.inline-toolbar):not(.osd) .linked spinbutton:not(:first-child),
1117
toolbar:not(.inline-toolbar):not(.osd) .linked button:not(:first-child) {
1118
margin-left: 0;
1119
}
1120
toolbar:not(.inline-toolbar):not(.osd) .linked entry:not(:last-child),
1122
toolbar:not(.inline-toolbar):not(.osd) .linked spinbutton:not(:last-child),
1123
toolbar:not(.inline-toolbar):not(.osd) .linked button:not(:last-child) {
1124
margin-right: 0;
1125
}
1126
toolbar:not(.inline-toolbar):not(.osd) switch {
1128
margin: 9px 3px;
1129
}
1130
.inline-toolbar {
1132
padding: 6px;
1133
border-style: solid;
1134
border-width: 0 1px 1px;
1135
border-color: rgba(0, 0, 0, 0.1);
1136
background-color: #FAFAFA;
1137
}
1138
searchbar,
1140
.location-bar {
1141
padding: 6px;
1142
border-style: solid;
1143
border-width: 0 0 1px;
1144
border-color: rgba(0, 0, 0, 0.1);
1145
background-color: #F5F5F5;
1146
background-clip: border-box;
1147
}
1148
/***************
1150
* Header bars *
1151
***************/
1152
.titlebar:not(headerbar),
1153
headerbar {
1154
transition: background-color 0.2s cubic-bezier(0, 0, 0.2, 1);
1155
min-height: 48px;
1156
padding: 0 6px;
1157
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);
1158
background-color: #E0E0E0;
1159
color: rgba(0, 0, 0, 0.8);
1160
}
1161
.titlebar:disabled:not(headerbar) :not(button) > label,
1163
headerbar:disabled :not(button) > label {
1164
color: rgba(0, 0, 0, 0.32);
1165
}
1166
.titlebar:backdrop:not(headerbar),
1168
headerbar:backdrop {
1169
color: rgba(0, 0, 0, 0.6);
1170
}
1171
.titlebar:backdrop:disabled:not(headerbar) :not(button) > label,
1173
headerbar:backdrop:disabled :not(button) > label {
1174
color: rgba(0, 0, 0, 0.24);
1175
}
1176
.titlebar:not(headerbar) .title,
1178
headerbar .title {
1179
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1180
padding: 0 12px;
1181
font-weight: bold;
1182
}
1183
.titlebar:not(headerbar) .subtitle,
1185
headerbar .subtitle {
1186
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1187
padding: 0 12px;
1188
font-size: smaller;
1189
}
1190
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
1192
headerbar button:not(.suggested-action):not(.destructive-action) {
1193
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1194
}
1195
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1197
headerbar button:not(.suggested-action):not(.destructive-action):checked {
1198
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1199
}
1200
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1202
headerbar button:not(.suggested-action):not(.destructive-action):checked,
1203
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled {
1204
background-color: transparent;
1205
}
1206
.titlebar:not(headerbar) button.suggested-action:disabled, .titlebar:not(headerbar) button.destructive-action:disabled,
1208
headerbar button.suggested-action:disabled,
1209
headerbar button.destructive-action:disabled {
1210
color: alpha(currentColor, 0.4);
1211
}
1212
.selection-mode.titlebar:not(headerbar),
1214
headerbar.selection-mode {
1215
transition: background-color 0.00001s 0.3s;
1216
animation: header_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1);
1217
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);
1218
background-color: #42A5F5;
1219
color: #FFFFFF;
1220
}
1221
.selection-mode.titlebar:backdrop:not(headerbar),
1223
headerbar.selection-mode:backdrop {
1224
color: rgba(255, 255, 255, 0.75);
1225
}
1226
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
1228
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action) {
1229
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px;
1230
color: currentColor;
1231
}
1232
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled,
1234
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled {
1235
color: alpha(currentColor, 0.4);
1236
}
1237
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1239
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked {
1240
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
1241
color: currentColor;
1242
}
1243
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1245
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled {
1246
color: alpha(currentColor, 0.4);
1247
}
1248
.selection-mode.titlebar:not(headerbar) .selection-menu,
1250
headerbar.selection-mode .selection-menu {
1251
padding-left: 16px;
1252
padding-right: 16px;
1253
}
1254
.selection-mode.titlebar:not(headerbar) .selection-menu GtkArrow,
1256
headerbar.selection-mode .selection-menu GtkArrow {
1257
-GtkArrow-arrow-scaling: 1;
1258
}
1259
.selection-mode.titlebar:not(headerbar) .selection-menu .arrow,
1261
headerbar.selection-mode .selection-menu .arrow {
1262
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1263
}
1264
.fullscreen .titlebar:not(headerbar),
1266
.tiled .titlebar:not(headerbar),
1267
.maximized .titlebar:not(headerbar), .fullscreen
1268
headerbar,
1269
.tiled
1270
headerbar,
1271
.maximized
1272
headerbar {
1273
border-radius: 0;
1274
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1275
}
1276
.default-decoration.titlebar:not(headerbar),
1278
headerbar.default-decoration {
1279
min-height: 24px;
1280
padding: 6px;
1281
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
1282
}
1283
.fullscreen .default-decoration.titlebar:not(headerbar),
1285
.tiled .default-decoration.titlebar:not(headerbar),
1286
.maximized .default-decoration.titlebar:not(headerbar), .fullscreen
1287
headerbar.default-decoration,
1288
.tiled
1289
headerbar.default-decoration,
1290
.maximized
1291
headerbar.default-decoration {
1292
box-shadow: none;
1293
}
1294
.default-decoration.titlebar:not(headerbar) button.titlebutton,
1296
headerbar.default-decoration button.titlebutton {
1297
min-height: 24px;
1298
min-width: 24px;
1299
margin: 0;
1300
padding: 0;
1301
}
1302
.background:not(.csd) .default-decoration.titlebar:not(headerbar) button.titlebutton:active, .background:not(.csd)
1304
headerbar.default-decoration button.titlebutton:active {
1305
background-size: 1000% 1000%;
1306
}
1307
headerbar entry,
1309
headerbar spinbutton,
1310
headerbar button {
1311
margin-top: 6px;
1312
margin-bottom: 6px;
1313
}
1314
headerbar switch {
1316
margin-top: 12px;
1317
margin-bottom: 12px;
1318
}
1319
headerbar spinbutton button {
1321
margin-top: 0;
1322
margin-bottom: 0;
1323
}
1324
.background:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) .titlebar {
1326
border-top-left-radius: 2px;
1327
border-top-right-radius: 2px;
1328
}
1329
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) separator:first-child + headerbar,
1331
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) headerbar:first-child {
1332
border-top-left-radius: 2px;
1333
}
1334
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) headerbar:last-child {
1336
border-top-right-radius: 2px;
1337
}
1338
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) stack headerbar:first-child, window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) stack headerbar:last-child {
1340
border-top-left-radius: 2px;
1341
border-top-right-radius: 2px;
1342
}
1343
window.csd > .titlebar:not(headerbar) {
1345
padding: 0;
1346
background-color: transparent;
1347
background-image: none;
1348
border-style: none;
1349
box-shadow: none;
1350
}
1351
.titlebar:not(headerbar) > separator {
1353
background-color: #E0E0E0;
1354
background-image: image(rgba(0, 0, 0, 0.1));
1355
}
1356
/************
1358
* Pathbars *
1359
************/
1360
.caja-pathbar button,
1361
.path-bar button {
1362
padding-left: 6px;
1363
padding-right: 6px;
1364
}
1365
.caja-pathbar button label:not(:only-child):first-child,
1367
.path-bar button label:not(:only-child):first-child {
1368
margin-left: 4px;
1369
}
1370
.caja-pathbar button label:not(:only-child):last-child,
1372
.path-bar button label:not(:only-child):last-child {
1373
margin-right: 4px;
1374
}
1375
.caja-pathbar button.slider-button,
1377
.path-bar button.slider-button {
1378
padding-left: 4px;
1379
padding-right: 4px;
1380
}
1381
:not(headerbar) .caja-pathbar button, .caja-pathbar :not(headerbar) button, :not(headerbar)
1383
.path-bar button {
1384
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1385
border-radius: 2px;
1386
}
1387
:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar)
1389
.path-bar button:checked {
1390
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1391
}
1392
:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar)
1394
.path-bar button:checked, :not(headerbar)
1395
.path-bar button:checked:disabled {
1396
background-color: transparent;
1397
}
1398
/**************
1400
* Tree Views *
1401
**************/
1402
treeview.view {
1403
border-left-color: alpha(currentColor, 0.3);
1404
border-top-color: rgba(0, 0, 0, 0.1);
1405
}
1406
* {
1408
-GtkTreeView-horizontal-separator: 4;
1409
-GtkTreeView-grid-line-width: 1;
1410
-GtkTreeView-grid-line-pattern: '';
1411
-GtkTreeView-tree-line-width: 1;
1412
-GtkTreeView-tree-line-pattern: '';
1413
-GtkTreeView-expander-size: 16;
1414
}
1415
treeview.view.separator {
1417
min-height: 5px;
1418
color: rgba(0, 0, 0, 0.1);
1419
}
1420
treeview.view:drop(active) {
1422
border-style: solid none;
1423
border-width: 1px;
1424
border-color: #FF4081;
1425
}
1426
treeview.view:drop(active).after {
1428
border-top-style: none;
1429
}
1430
treeview.view:drop(active).before {
1432
border-bottom-style: none;
1433
}
1434
treeview.view.expander {
1436
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1437
-gtk-icon-transform: rotate(-90deg);
1438
color: rgba(0, 0, 0, 0.6);
1439
}
1440
treeview.view.expander:dir(rtl) {
1442
-gtk-icon-transform: rotate(90deg);
1443
}
1444
treeview.view.expander:checked {
1446
-gtk-icon-transform: unset;
1447
}
1448
treeview.view.expander:hover, treeview.view.expander:active {
1450
color: rgba(0, 0, 0, 0.8);
1451
}
1452
treeview.view.expander:disabled {
1454
color: rgba(0, 0, 0, 0.24);
1455
}
1456
treeview.view.expander:selected {
1458
color: rgba(255, 255, 255, 0.75);
1459
}
1460
treeview.view.expander:selected:hover, treeview.view.expander:selected:active {
1462
color: #FFFFFF;
1463
}
1464
treeview.view.expander:selected:disabled {
1466
color: rgba(255, 255, 255, 0.3);
1467
}
1468
treeview.view.progressbar {
1470
border-bottom: 4px solid #42A5F5;
1471
box-shadow: none;
1472
background-color: transparent;
1473
}
1474
treeview.view.progressbar:selected {
1476
border-bottom-color: currentColor;
1477
}
1478
treeview.view.trough {
1480
border-bottom: 4px solid rgba(66, 165, 245, 0.3);
1481
box-shadow: none;
1482
background-color: transparent;
1483
}
1484
treeview.view.trough:selected {
1486
border-bottom-color: alpha(currentColor, 0.3);
1487
}
1488
treeview.view header button {
1490
padding: 2px 6px;
1491
border-style: none solid solid none;
1492
border-width: 1px;
1493
border-color: rgba(0, 0, 0, 0.1);
1494
border-radius: 0;
1495
background-clip: border-box;
1496
}
1497
treeview.view header button, treeview.view header button:hover, treeview.view header button:active {
1499
box-shadow: none;
1500
}
1501
treeview.view header button, treeview.view header button:disabled {
1503
background-color: #FFFFFF;
1504
}
1505
treeview.view header button:last-child {
1507
border-right-style: none;
1508
}
1509
treeview.view button.dnd,
1511
treeview.view header.button.dnd {
1512
padding: 2px 6px;
1513
border-style: none solid solid;
1514
border-width: 1px;
1515
border-color: rgba(0, 0, 0, 0.1);
1516
border-radius: 0;
1517
box-shadow: none;
1518
background-color: #FFFFFF;
1519
background-clip: border-box;
1520
color: #42A5F5;
1521
}
1522
treeview.view acceleditor > label {
1524
background-color: #42A5F5;
1525
}
1526
/*********
1528
* Menus *
1529
*********/
1530
menubar,
1531
.menubar {
1532
-GtkWidget-window-dragging: true;
1533
padding: 0;
1534
background-color: #E0E0E0;
1535
}
1536
menubar > menuitem,
1538
.menubar > menuitem {
1539
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
1540
min-height: 20px;
1541
padding: 4px 8px;
1542
color: rgba(0, 0, 0, 0.6);
1543
}
1544
menubar > menuitem:hover,
1546
.menubar > menuitem:hover {
1547
transition: none;
1548
background-color: alpha(currentColor, 0.15);
1549
color: rgba(0, 0, 0, 0.8);
1550
}
1551
menubar > menuitem:disabled,
1553
.menubar > menuitem:disabled {
1554
color: rgba(0, 0, 0, 0.24);
1555
}
1556
.csd.popup {
1558
border-radius: 2px;
1559
}
1560
menu,
1562
.menu,
1563
.context-menu {
1564
margin: 4px 0;
1565
padding: 4px 0;
1566
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
1567
background-color: #FFFFFF;
1568
border: 1px solid rgba(0, 0, 0, 0.1);
1569
}
1570
.csd menu, .csd
1572
.menu, .csd
1573
.context-menu {
1574
border: none;
1575
border-radius: 2px;
1576
}
1577
menu menuitem,
1579
.menu menuitem,
1580
.context-menu menuitem {
1581
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
1582
min-height: 20px;
1583
min-width: 40px;
1584
padding: 4px 8px;
1585
font: initial;
1586
text-shadow: none;
1587
}
1588
menu menuitem:hover,
1590
.menu menuitem:hover,
1591
.context-menu menuitem:hover {
1592
transition: none;
1593
background-color: alpha(currentColor, 0.15);
1594
}
1595
menu menuitem:disabled,
1597
.menu menuitem:disabled,
1598
.context-menu menuitem:disabled {
1599
color: rgba(0, 0, 0, 0.32);
1600
}
1601
menu menuitem arrow,
1603
.menu menuitem arrow,
1604
.context-menu menuitem arrow {
1605
min-height: 16px;
1606
min-width: 16px;
1607
}
1608
menu menuitem arrow:dir(ltr),
1610
.menu menuitem arrow:dir(ltr),
1611
.context-menu menuitem arrow:dir(ltr) {
1612
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1613
margin-left: 8px;
1614
}
1615
menu menuitem arrow:dir(rtl),
1617
.menu menuitem arrow:dir(rtl),
1618
.context-menu menuitem arrow:dir(rtl) {
1619
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl");
1620
margin-right: 8px;
1621
}
1622
menu menuitem label:dir(rtl), menu menuitem label:dir(ltr),
1624
.menu menuitem label:dir(rtl),
1625
.menu menuitem label:dir(ltr),
1626
.context-menu menuitem label:dir(rtl),
1627
.context-menu menuitem label:dir(ltr) {
1628
color: inherit;
1629
}
1630
menu > arrow,
1632
.menu > arrow,
1633
.context-menu > arrow {
1634
min-height: 16px;
1635
min-width: 16px;
1636
padding: 4px;
1637
background-color: #FFFFFF;
1638
color: rgba(0, 0, 0, 0.6);
1639
}
1640
menu > arrow.top,
1642
.menu > arrow.top,
1643
.context-menu > arrow.top {
1644
margin-top: -4px;
1645
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
1646
border-radius: 2px 2px 0 0;
1647
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
1648
}
1649
menu > arrow.bottom,
1651
.menu > arrow.bottom,
1652
.context-menu > arrow.bottom {
1653
margin-bottom: -12px;
1654
border-top: 1px solid rgba(0, 0, 0, 0.1);
1655
border-radius: 0 0 2px 2px;
1656
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1657
}
1658
menu > arrow:hover,
1660
.menu > arrow:hover,
1661
.context-menu > arrow:hover {
1662
background-image: image(alpha(currentColor, 0.15));
1663
color: rgba(0, 0, 0, 0.8);
1664
}
1665
menu > arrow:disabled,
1667
.menu > arrow:disabled,
1668
.context-menu > arrow:disabled {
1669
border-color: transparent;
1670
background-color: transparent;
1671
color: transparent;
1672
}
1673
menu separator,
1675
.menu separator,
1676
.context-menu separator {
1677
margin: 4px 0;
1678
}
1679
menuitem accelerator {
1681
color: alpha(currentColor, 0.6);
1682
}
1683
.popup:not(.csd) menu menuitem {
1685
color: #333333;
1686
}
1687
.popup:not(.csd) menu menuitem:hover {
1689
background-color: #e0e0e0;
1690
}
1691
.popup:not(.csd) menu menuitem:disabled {
1693
color: #adadad;
1694
}
1695
.popup:not(.csd) menu accelerator {
1697
color: #858585;
1698
}
1699
/************
1701
* Popovers *
1702
************/
1703
popover.background {
1704
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1705
padding: 2px;
1706
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
1707
background-color: #FAFAFA;
1708
}
1709
popover.background:backdrop {
1711
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1712
}
1713
popover.background, .csd popover.background {
1715
border-style: solid;
1716
border-width: 1px;
1717
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3);
1718
border-radius: 3px;
1719
}
1720
popover.background > stack {
1722
margin: -4px;
1723
}
1724
popover.background > toolbar {
1726
margin: -2px;
1727
}
1728
popover.background > list,
1730
popover.background > .view,
1731
popover.background > toolbar {
1732
border-style: none;
1733
box-shadow: none;
1734
background-color: transparent;
1735
}
1736
popover.background.menu button,
1738
popover.background button.model {
1739
min-height: 32px;
1740
padding: 0 8px;
1741
border-radius: 2px;
1742
}
1743
popover.background separator {
1745
margin: 4px 0;
1746
}
1747
popover.background list separator {
1749
margin: 0;
1750
}
1751
/*************
1753
* Notebooks *
1754
*************/
1755
notebook > header {
1756
border-width: 1px;
1757
border-color: rgba(0, 0, 0, 0.1);
1758
background-color: #F5F5F5;
1759
background-clip: border-box;
1760
}
1761
notebook > header.top {
1763
border-bottom-style: solid;
1764
}
1765
notebook > header.top > tabs {
1767
margin-bottom: -1px;
1768
}
1769
notebook > header.top > tabs > tab:hover {
1771
box-shadow: inset 0 -2px alpha(currentColor, 0.3);
1772
}
1773
notebook > header.top > tabs > tab:checked {
1775
box-shadow: inset 0 -2px #42A5F5;
1776
}
1777
notebook > header.bottom {
1779
border-top-style: solid;
1780
}
1781
notebook > header.bottom > tabs {
1783
margin-top: -1px;
1784
}
1785
notebook > header.bottom > tabs > tab:hover {
1787
box-shadow: inset 0 2px alpha(currentColor, 0.3);
1788
}
1789
notebook > header.bottom > tabs > tab:checked {
1791
box-shadow: inset 0 2px #42A5F5;
1792
}
1793
notebook > header.left {
1795
border-right-style: solid;
1796
}
1797
notebook > header.left > tabs {
1799
margin-right: -1px;
1800
}
1801
notebook > header.left > tabs > tab:hover {
1803
box-shadow: inset -2px 0 alpha(currentColor, 0.3);
1804
}
1805
notebook > header.left > tabs > tab:checked {
1807
box-shadow: inset -2px 0 #42A5F5;
1808
}
1809
notebook > header.right {
1811
border-left-style: solid;
1812
}
1813
notebook > header.right > tabs {
1815
margin-left: -1px;
1816
}
1817
notebook > header.right > tabs > tab:hover {
1819
box-shadow: inset 2px 0 alpha(currentColor, 0.3);
1820
}
1821
notebook > header.right > tabs > tab:checked {
1823
box-shadow: inset 2px 0 #42A5F5;
1824
}
1825
notebook > header.top > tabs > arrow {
1827
border-top-style: none;
1828
}
1829
notebook > header.bottom > tabs > arrow {
1831
border-bottom-style: none;
1832
}
1833
notebook > header.top > tabs > arrow, notebook > header.bottom > tabs > arrow {
1835
padding-left: 4px;
1836
padding-right: 4px;
1837
}
1838
notebook > header.top > tabs > arrow.down, notebook > header.bottom > tabs > arrow.down {
1840
margin-left: -8px;
1841
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
1842
}
1843
notebook > header.top > tabs > arrow.up, notebook > header.bottom > tabs > arrow.up {
1845
margin-right: -8px;
1846
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1847
}
1848
notebook > header.left > tabs > arrow {
1850
border-left-style: none;
1851
}
1852
notebook > header.right > tabs > arrow {
1854
border-right-style: none;
1855
}
1856
notebook > header.left > tabs > arrow, notebook > header.right > tabs > arrow {
1858
padding-top: 4px;
1859
padding-bottom: 4px;
1860
}
1861
notebook > header.left > tabs > arrow.down, notebook > header.right > tabs > arrow.down {
1863
margin-top: -8px;
1864
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
1865
}
1866
notebook > header.left > tabs > arrow.up, notebook > header.right > tabs > arrow.up {
1868
margin-bottom: -8px;
1869
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1870
}
1871
notebook > header > tabs > arrow {
1873
min-height: 16px;
1874
min-width: 16px;
1875
border-radius: 0;
1876
}
1877
notebook > header tab {
1879
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
1880
min-height: 24px;
1881
min-width: 24px;
1882
padding: 6px 12px;
1883
outline-offset: -6px;
1884
border-width: 1px;
1885
border-color: transparent;
1886
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 10%, transparent 0%);
1887
background-repeat: no-repeat;
1888
background-position: center;
1889
background-size: 0% 0%;
1890
color: rgba(0, 0, 0, 0.6);
1891
font-weight: 500;
1892
}
1893
notebook > header tab:hover {
1895
color: rgba(0, 0, 0, 0.8);
1896
}
1897
notebook > header tab:hover.reorderable-page {
1899
border-color: rgba(0, 0, 0, 0.1);
1900
background-color: #FAFAFA;
1901
}
1902
notebook > header tab:disabled {
1904
color: rgba(0, 0, 0, 0.24);
1905
}
1906
notebook > header tab:checked {
1908
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0.3s cubic-bezier(0, 0, 0.2, 1), background-image 0.8s cubic-bezier(0, 0, 0.2, 1);
1909
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
1910
background-size: 1000% 1000%;
1911
color: rgba(0, 0, 0, 0.8);
1912
}
1913
notebook > header tab:checked:disabled {
1915
color: rgba(0, 0, 0, 0.32);
1916
}
1917
notebook > header tab:checked.reorderable-page {
1919
border-color: rgba(0, 0, 0, 0.1);
1920
background-color: #FFFFFF;
1921
}
1922
notebook > header tab button.flat:last-child {
1924
margin-left: 6px;
1925
margin-right: -6px;
1926
}
1927
notebook > header tab button.flat:first-child {
1929
margin-left: -6px;
1930
margin-right: 6px;
1931
}
1932
notebook > header.top tabs, notebook > header.bottom tabs {
1934
padding-left: 8px;
1935
padding-right: 8px;
1936
}
1937
notebook > header.top tabs:not(:only-child):first-child, notebook > header.bottom tabs:not(:only-child):first-child {
1939
margin-left: 0;
1940
}
1941
notebook > header.top tabs:not(:only-child):last-child, notebook > header.bottom tabs:not(:only-child):last-child {
1943
margin-right: 0;
1944
}
1945
notebook > header.top tabs tab.reorderable-page, notebook > header.bottom tabs tab.reorderable-page {
1947
margin: 0 -1px;
1948
border-style: none solid;
1949
}
1950
notebook > header.left tabs, notebook > header.right tabs {
1952
padding-top: 8px;
1953
padding-bottom: 8px;
1954
}
1955
notebook > header.left tabs:not(:only-child):first-child, notebook > header.right tabs:not(:only-child):first-child {
1957
margin-top: 0;
1958
}
1959
notebook > header.left tabs:not(:only-child):last-child, notebook > header.right tabs:not(:only-child):last-child {
1961
margin-bottom: 0;
1962
}
1963
notebook > header.left tabs tab.reorderable-page, notebook > header.right tabs tab.reorderable-page {
1965
margin: -1px 0;
1966
border-style: solid none;
1967
}
1968
notebook > stack:not(:only-child) {
1970
background-color: #FFFFFF;
1971
}
1972
/**************
1974
* Scrollbars *
1975
**************/
1976
scrollbar {
1977
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1978
background-color: #FFFFFF;
1979
background-clip: padding-box;
1980
}
1981
* {
1983
-GtkScrollbar-has-backward-stepper: false;
1984
-GtkScrollbar-has-forward-stepper: false;
1985
}
1986
scrollbar.top {
1988
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
1989
}
1990
scrollbar.bottom {
1992
border-top: 1px solid rgba(0, 0, 0, 0.1);
1993
}
1994
scrollbar.left {
1996
border-right: 1px solid rgba(0, 0, 0, 0.1);
1997
}
1998
scrollbar.right {
2000
border-left: 1px solid rgba(0, 0, 0, 0.1);
2001
}
2002
scrollbar slider {
2004
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0;
2005
min-width: 8px;
2006
min-height: 8px;
2007
border: 4px solid transparent;
2008
border-radius: 9999px;
2009
background-clip: padding-box;
2010
background-color: rgba(0, 0, 0, 0.48);
2011
}
2012
scrollbar slider:hover {
2014
background-color: rgba(0, 0, 0, 0.6);
2015
}
2016
scrollbar slider:active {
2018
background-color: rgba(0, 0, 0, 0.8);
2019
}
2020
scrollbar slider:disabled {
2022
background-color: rgba(0, 0, 0, 0.192);
2023
}
2024
scrollbar.fine-tune slider {
2026
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0, min-width 0, min-height 0;
2027
min-width: 4px;
2028
min-height: 4px;
2029
}
2030
scrollbar.fine-tune.horizontal slider {
2032
margin: 2px 0;
2033
}
2034
scrollbar.fine-tune.vertical slider {
2036
margin: 0 2px;
2037
}
2038
scrollbar.overlay-indicator:not(.dragging):not(.hovering) {
2040
border-color: transparent;
2041
background-color: transparent;
2042
}
2043
scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider {
2045
min-width: 4px;
2046
min-height: 4px;
2047
margin: 3px;
2048
border: 1px solid rgba(255, 255, 255, 0.3);
2049
}
2050
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button {
2052
min-width: 4px;
2053
min-height: 4px;
2054
margin: 3px;
2055
border: 1px solid rgba(255, 255, 255, 0.3);
2056
border-radius: 9999px;
2057
background-color: rgba(0, 0, 0, 0.48);
2058
background-clip: padding-box;
2059
-gtk-icon-source: none;
2060
}
2061
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled {
2063
background-color: rgba(0, 0, 0, 0.192);
2064
}
2065
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider {
2067
min-width: 24px;
2068
}
2069
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal button {
2071
min-width: 8px;
2072
}
2073
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider {
2075
min-height: 24px;
2076
}
2077
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button {
2079
min-height: 8px;
2080
}
2081
scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering {
2083
background-color: rgba(255, 255, 255, 0.9);
2084
}
2085
scrollbar.horizontal slider {
2087
min-width: 24px;
2088
}
2089
scrollbar.vertical slider {
2091
min-height: 24px;
2092
}
2093
scrollbar button {
2095
min-width: 16px;
2096
min-height: 16px;
2097
padding: 0;
2098
border-radius: 0;
2099
}
2100
scrollbar.vertical button.down {
2102
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
2103
}
2104
scrollbar.vertical button.up {
2106
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
2107
}
2108
scrollbar.horizontal button.down {
2110
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
2111
}
2112
scrollbar.horizontal button.up {
2114
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
2115
}
2116
/**********
2118
* Switch *
2119
**********/
2120
switch {
2121
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2122
margin: 6px 0;
2123
border: 4px solid transparent;
2124
border-radius: 9999px;
2125
background-color: alpha(currentColor, 0.3);
2126
background-clip: padding-box;
2127
font-size: 0;
2128
}
2129
switch:disabled {
2131
color: alpha(currentColor, 0.4);
2132
}
2133
switch:checked {
2135
background-color: rgba(255, 64, 129, 0.5);
2136
}
2137
switch:checked:disabled {
2139
background-color: rgba(255, 64, 129, 0.2);
2140
color: rgba(0, 0, 0, 0.32);
2141
}
2142
switch slider {
2144
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
2145
border-image: none;
2146
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2147
background-color: #FFFFFF;
2148
color: rgba(0, 0, 0, 0.8);
2149
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0;
2150
min-width: 24px;
2151
min-height: 24px;
2152
margin: -4px 0 -4px -4px;
2153
border-radius: 9999px;
2154
-gtk-outline-radius: 9999px;
2155
}
2156
switch:hover slider {
2158
border-image: none;
2159
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2160
}
2161
switch:checked slider {
2163
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.00001s 0.3s;
2164
animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1);
2165
margin: -4px -4px -4px 0;
2166
background-color: #FF4081;
2167
color: #FFFFFF;
2168
}
2169
switch:disabled slider {
2171
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2172
background-color: #FAFAFA;
2173
color: rgba(0, 0, 0, 0.32);
2174
}
2175
switch:checked:disabled slider {
2177
animation: none;
2178
}
2179
/*************************
2181
* Check and Radio items *
2182
*************************/
2183
.view.content-view.check:not(list),
2184
.content-view .tile check:not(list) {
2185
min-height: 40px;
2186
min-width: 40px;
2187
margin: 0;
2188
padding: 0;
2189
box-shadow: none;
2190
background-color: transparent;
2191
background-image: none;
2192
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2193
}
2194
.view.content-view.check:not(list):hover, .view.content-view.check:not(list):active,
2196
.content-view .tile check:not(list):hover,
2197
.content-view .tile check:not(list):active {
2198
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2199
}
2200
.view.content-view.check:not(list),
2202
.content-view .tile check:not(list) {
2203
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-unchecked.png"), url("assets/selectionmode-checkbox-unchecked@2.png"));
2204
}
2205
.view.content-view.check:not(list):checked,
2207
.content-view .tile check:not(list):checked {
2208
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-checked.png"), url("assets/selectionmode-checkbox-checked@2.png"));
2209
}
2210
checkbutton.text-button,
2212
radiobutton.text-button {
2213
padding: 2px;
2214
outline-offset: 0;
2215
}
2216
checkbutton.text-button label:not(:only-child),
2218
radiobutton.text-button label:not(:only-child) {
2219
margin: 0 4px;
2220
}
2221
check,
2223
radio {
2224
min-height: 24px;
2225
min-width: 24px;
2226
margin: -12px;
2227
padding: 12px;
2228
}
2229
check:checked, check:indeterminate,
2231
radio:checked,
2232
radio:indeterminate {
2233
color: #FF4081;
2234
}
2235
check:checked:disabled, check:indeterminate:disabled,
2237
radio:checked:disabled,
2238
radio:indeterminate:disabled {
2239
color: rgba(255, 64, 129, 0.4);
2240
}
2241
row check:not(:checked):not(:indeterminate), row
2243
radio:not(:checked):not(:indeterminate) {
2244
color: alpha(currentColor, 0.75);
2245
}
2246
row check:not(:checked):not(:indeterminate):hover, row check:not(:checked):not(:indeterminate):active, row
2248
radio:not(:checked):not(:indeterminate):hover, row
2249
radio:not(:checked):not(:indeterminate):active {
2250
color: currentColor;
2251
}
2252
row check:not(:checked):not(:indeterminate):disabled, row
2254
radio:not(:checked):not(:indeterminate):disabled {
2255
color: alpha(currentColor, 0.3);
2256
}
2257
menu menuitem check, menu menuitem
2259
radio {
2260
transition: none;
2261
min-height: 16px;
2262
min-width: 16px;
2263
margin: 0;
2264
padding: 0;
2265
}
2266
menu menuitem check:dir(ltr), menu menuitem
2268
radio:dir(ltr) {
2269
margin-right: 8px;
2270
}
2271
menu menuitem check:dir(rtl), menu menuitem
2273
radio:dir(rtl) {
2274
margin-left: 8px;
2275
}
2276
menu menuitem check:not(:checked):not(:indeterminate), menu menuitem
2278
radio:not(:checked):not(:indeterminate) {
2279
color: alpha(currentColor, 0.6);
2280
}
2281
menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem
2283
radio, menu menuitem
2284
radio:hover, menu menuitem
2285
radio:disabled {
2286
box-shadow: none;
2287
}
2288
check {
2291
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.symbolic.png")));
2292
}
2293
check:checked {
2296
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.symbolic.png")));
2297
}
2298
check:indeterminate {
2301
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.symbolic.png")));
2302
}
2303
radio {
2306
border-image-slice: 24;
2307
border-image-width: 24px;
2308
}
2309
radio {
2312
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.symbolic.png")));
2313
}
2314
radio:indeterminate {
2317
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-mixed-symbolic.symbolic.png")));
2318
}
2319
radio {
2322
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent));
2323
}
2324
radio:checked:not(:indeterminate) {
2327
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.10417, to(#FF4081), to(transparent));
2328
}
2329
radio:checked:not(:indeterminate):disabled {
2332
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.10417, to(rgba(255, 64, 129, 0.4)), to(transparent));
2333
}
2334
window.background:not(.csd) > widget > checkbutton > check,
2336
menu menuitem check {
2337
border-radius: 2px;
2338
-gtk-outline-radius: 2px;
2339
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-checkbox-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/small-checkbox-unchecked-symbolic.symbolic.png")));
2340
}
2341
window.background:not(.csd) > widget > checkbutton > check:checked,
2343
menu menuitem check:checked {
2344
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-checkbox-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/small-checkbox-checked-symbolic.symbolic.png")));
2345
}
2346
window.background:not(.csd) > widget > checkbutton > check:indeterminate,
2348
menu menuitem check:indeterminate {
2349
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-checkbox-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/small-checkbox-mixed-symbolic.symbolic.png")));
2350
}
2351
window.background:not(.csd) > widget > radiobutton > radio,
2353
menu menuitem radio {
2354
border-image: none;
2355
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-radio-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/small-radio-unchecked-symbolic.symbolic.png")));
2356
}
2357
window.background:not(.csd) > widget > radiobutton > radio:checked,
2359
menu menuitem radio:checked {
2360
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-radio-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/small-radio-checked-symbolic.symbolic.png")));
2361
}
2362
window.background:not(.csd) > widget > radiobutton > radio:indeterminate,
2364
menu menuitem radio:indeterminate {
2365
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/small-radio-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/small-radio-mixed-symbolic.symbolic.png")));
2366
}
2367
check:not(:checked):active {
2369
-gtk-icon-transform: rotate(90deg);
2370
}
2371
check:not(:checked):indeterminate:active,
2373
radio:not(:checked):indeterminate:active {
2374
-gtk-icon-transform: scaleX(-1);
2375
}
2376
check:not(:checked),
2378
radio:not(:checked) {
2379
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0.5s cubic-bezier(0, 0, 0.2, 1), background-image 1s cubic-bezier(0, 0, 0.2, 1), -gtk-icon-transform 0;
2380
}
2381
check:not(:checked):active,
2383
radio:not(:checked):active {
2384
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0, -gtk-icon-transform 0;
2385
}
2386
menu menuitem check:not(:checked), menu menuitem
2388
radio:not(:checked) {
2389
transition: none;
2390
}
2391
treeview.view check,
2393
treeview.view radio {
2394
padding: 0;
2395
}
2396
treeview.view check:hover,
2398
treeview.view radio:hover {
2399
box-shadow: inset 0 0 0 9999px alpha(rgba(0, 0, 0, 0.8), 0.05);
2400
}
2401
treeview.view check:hover:disabled,
2403
treeview.view radio:hover:disabled {
2404
box-shadow: none;
2405
}
2406
treeview.view check:hover:selected,
2408
treeview.view radio:hover:selected {
2409
box-shadow: inset 0 0 0 9999px alpha(#FFFFFF, 0.05);
2410
}
2411
treeview.view check,
2413
treeview.view radio {
2414
color: rgba(0, 0, 0, 0.6);
2415
}
2416
treeview.view check:hover, treeview.view check:active,
2418
treeview.view radio:hover,
2419
treeview.view radio:active {
2420
color: rgba(0, 0, 0, 0.8);
2421
}
2422
treeview.view check:disabled,
2424
treeview.view radio:disabled {
2425
color: rgba(0, 0, 0, 0.24);
2426
}
2427
treeview.view check:checked, treeview.view check:indeterminate,
2429
treeview.view radio:checked,
2430
treeview.view radio:indeterminate {
2431
color: #FF4081;
2432
}
2433
treeview.view check:checked:disabled, treeview.view check:indeterminate:disabled,
2435
treeview.view radio:checked:disabled,
2436
treeview.view radio:indeterminate:disabled {
2437
color: rgba(255, 64, 129, 0.4);
2438
}
2439
treeview.view check:selected,
2441
treeview.view radio:selected {
2442
color: rgba(255, 255, 255, 0.75);
2443
}
2444
treeview.view check:selected:hover, treeview.view check:selected:active,
2446
treeview.view radio:selected:hover,
2447
treeview.view radio:selected:active {
2448
color: #FFFFFF;
2449
}
2450
treeview.view check:selected:disabled,
2452
treeview.view radio:selected:disabled {
2453
color: rgba(255, 255, 255, 0.3);
2454
}
2455
treeview.view check:selected:checked, treeview.view check:selected:indeterminate,
2457
treeview.view radio:selected:checked,
2458
treeview.view radio:selected:indeterminate {
2459
color: #FF4081;
2460
}
2461
treeview.view check:selected:checked:disabled, treeview.view check:selected:indeterminate:disabled,
2463
treeview.view radio:selected:checked:disabled,
2464
treeview.view radio:selected:indeterminate:disabled {
2465
color: rgba(255, 64, 129, 0.4);
2466
}
2467
treeview.view radio:checked {
2469
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-checked-symbolic.symbolic.png")));
2470
border-image: none;
2471
}
2472
/************
2474
* GtkScale *
2475
************/
2476
scale {
2477
min-height: 12px;
2478
min-width: 12px;
2479
padding: 12px;
2480
}
2481
scale * {
2483
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2484
}
2485
scale slider {
2487
min-height: 24px;
2488
min-width: 24px;
2489
margin: -10px;
2490
}
2491
scale trough {
2493
outline-offset: 2px;
2494
background-color: alpha(currentColor, 0.3);
2495
}
2496
scale trough:disabled {
2498
color: rgba(0, 0, 0, 0.32);
2499
}
2500
scale highlight {
2502
background-color: #FF4081;
2503
}
2504
scale highlight:disabled {
2506
background-color: transparent;
2507
}
2508
scale fill {
2510
background-color: alpha(currentColor, 0.3);
2511
}
2512
scale fill:disabled {
2514
background-color: transparent;
2515
}
2516
scale slider {
2518
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
2519
background-repeat: no-repeat;
2520
background-position: center;
2521
background-size: calc(100% - 8px);
2522
}
2523
scale slider {
2525
background-image: -gtk-scaled(url("assets/scale-slider.png"), url("assets/scale-slider@2.png"));
2526
}
2527
scale slider:disabled {
2529
background-image: -gtk-scaled(url("assets/scale-slider-disabled.png"), url("assets/scale-slider-disabled@2.png"));
2530
}
2531
scale slider:hover {
2533
background-size: calc(100% - 4px);
2534
}
2535
scale slider:active {
2537
background-size: calc(100% - 0px);
2538
}
2539
scale.fine-tune slider {
2541
background-size: calc(100% - 12px);
2542
}
2543
scale value {
2545
color: alpha(currentColor, 0.6);
2546
}
2547
scale marks {
2549
color: alpha(currentColor, 0.3);
2550
}
2551
scale marks.top {
2553
margin-bottom: 8px;
2554
margin-top: -16px;
2555
}
2556
scale marks.bottom {
2558
margin-top: 8px;
2559
margin-bottom: -16px;
2560
}
2561
scale marks.top {
2563
margin-right: 8px;
2564
margin-left: -16px;
2565
}
2566
scale marks.bottom {
2568
margin-left: 8px;
2569
margin-right: -16px;
2570
}
2571
scale.horizontal indicator {
2573
min-height: 8px;
2574
min-width: 1px;
2575
}
2576
scale.vertical indicator {
2578
min-height: 1px;
2579
min-width: 8px;
2580
}
2581
scale.horizontal.marks-before:not(.marks-after) slider {
2583
min-height: 30px;
2584
min-width: 24px;
2585
margin-top: -16px;
2586
background-position: center calc(100% - 4px);
2587
}
2588
scale.horizontal.marks-before:not(.marks-after) slider {
2590
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider.png"), url("assets/scale-horz-marks-before-slider@2.png"));
2591
}
2592
scale.horizontal.marks-before:not(.marks-after) slider:disabled {
2594
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider-disabled.png"), url("assets/scale-horz-marks-before-slider-disabled@2.png"));
2595
}
2596
scale.horizontal.marks-before:not(.marks-after) slider:hover {
2598
background-position: center calc(100% - 2px);
2599
}
2600
scale.horizontal.marks-before:not(.marks-after) slider:active {
2602
background-position: center calc(100% - 0px);
2603
}
2604
scale.horizontal.marks-before:not(.marks-after).fine-tune slider {
2606
background-position: center calc(100% - 6px);
2607
}
2608
scale.horizontal.marks-after:not(.marks-before) slider {
2610
min-height: 30px;
2611
min-width: 24px;
2612
margin-bottom: -16px;
2613
background-position: center calc(4px);
2614
}
2615
scale.horizontal.marks-after:not(.marks-before) slider {
2617
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider.png"), url("assets/scale-horz-marks-after-slider@2.png"));
2618
}
2619
scale.horizontal.marks-after:not(.marks-before) slider:disabled {
2621
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider-disabled.png"), url("assets/scale-horz-marks-after-slider-disabled@2.png"));
2622
}
2623
scale.horizontal.marks-after:not(.marks-before) slider:hover {
2625
background-position: center calc(2px);
2626
}
2627
scale.horizontal.marks-after:not(.marks-before) slider:active {
2629
background-position: center calc(0px);
2630
}
2631
scale.horizontal.marks-after:not(.marks-before).fine-tune slider {
2633
background-position: center calc(6px);
2634
}
2635
scale.vertical.marks-before:not(.marks-after) slider {
2637
min-height: 24px;
2638
min-width: 30px;
2639
margin-left: -16px;
2640
background-position: calc(4px) center;
2641
}
2642
scale.vertical.marks-before:not(.marks-after) slider {
2644
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider.png"), url("assets/scale-vert-marks-before-slider@2.png"));
2645
}
2646
scale.vertical.marks-before:not(.marks-after) slider:disabled {
2648
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider-disabled.png"), url("assets/scale-vert-marks-before-slider-disabled@2.png"));
2649
}
2650
scale.vertical.marks-before:not(.marks-after) slider:hover {
2652
background-position: calc(2px) center;
2653
}
2654
scale.vertical.marks-before:not(.marks-after) slider:active {
2656
background-position: calc(0px) center;
2657
}
2658
scale.vertical.marks-before:not(.marks-after).fine-tune slider {
2660
background-position: calc(6px) center;
2661
}
2662
scale.vertical.marks-after:not(.marks-before) slider {
2664
min-height: 24px;
2665
min-width: 30px;
2666
margin-right: -16px;
2667
background-position: calc(100% - 4px) center;
2668
}
2669
scale.vertical.marks-after:not(.marks-before) slider {
2671
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider.png"), url("assets/scale-vert-marks-after-slider@2.png"));
2672
}
2673
scale.vertical.marks-after:not(.marks-before) slider:disabled {
2675
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider-disabled.png"), url("assets/scale-vert-marks-after-slider-disabled@2.png"));
2676
}
2677
scale.vertical.marks-after:not(.marks-before) slider:hover {
2679
background-position: calc(100% - 2px) center;
2680
}
2681
scale.vertical.marks-after:not(.marks-before) slider:active {
2683
background-position: calc(100% - 0px) center;
2684
}
2685
scale.vertical.marks-after:not(.marks-before).fine-tune slider {
2687
background-position: calc(100% - 6px) center;
2688
}
2689
scale.color {
2691
min-height: 0;
2692
min-width: 0;
2693
}
2694
scale.color.horizontal {
2696
padding: 0 0 12px 0;
2697
}
2698
scale.color.horizontal slider:dir(ltr), scale.color.horizontal slider:dir(rtl) {
2700
margin-bottom: -12px;
2701
margin-top: -2px;
2702
}
2703
scale.color.vertical:dir(ltr) {
2705
padding: 0 0 0 12px;
2706
}
2707
scale.color.vertical:dir(ltr) slider {
2709
margin-left: -12px;
2710
margin-right: -2px;
2711
}
2712
scale.color.vertical:dir(rtl) {
2714
padding: 0 12px 0 0;
2715
}
2716
scale.color.vertical:dir(rtl) slider {
2718
margin-right: -12px;
2719
margin-left: -2px;
2720
}
2721
/*****************
2723
* Progress bars *
2724
*****************/
2725
progressbar {
2726
color: rgba(0, 0, 0, 0.48);
2727
font-size: smaller;
2728
}
2729
progressbar.horizontal trough,
2731
progressbar.horizontal progress {
2732
min-height: 4px;
2733
}
2734
progressbar.vertical trough,
2736
progressbar.vertical progress {
2737
min-width: 4px;
2738
}
2739
progressbar trough {
2741
background-color: rgba(66, 165, 245, 0.3);
2742
}
2743
progressbar progress {
2745
background-color: #42A5F5;
2746
}
2747
progressbar trough.empty progress {
2749
all: unset;
2750
}
2751
/*************
2753
* Level Bar *
2754
*************/
2755
levelbar block {
2756
min-width: 36px;
2757
min-height: 4px;
2758
}
2759
levelbar.vertical block {
2761
min-width: 4px;
2762
min-height: 36px;
2763
}
2764
levelbar trough {
2766
padding: 2px;
2767
border-radius: 2px;
2768
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
2769
border-image: none;
2770
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2771
background-color: #FFFFFF;
2772
color: rgba(0, 0, 0, 0.8);
2773
}
2774
levelbar trough:disabled {
2776
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2777
background-color: #FAFAFA;
2778
color: rgba(0, 0, 0, 0.32);
2779
}
2780
levelbar.horizontal.discrete block {
2782
margin: 0 1px;
2783
}
2784
levelbar.horizontal.discrete trough {
2786
padding: 2px 1px;
2787
}
2788
levelbar.vertical.discrete block {
2790
margin: 1px 0;
2791
}
2792
levelbar.vertical.discrete trough {
2794
padding: 1px 2px;
2795
}
2796
levelbar block.low {
2798
background-color: #FF6D00;
2799
}
2800
levelbar block.high, levelbar block:not(.empty) {
2802
background-color: #42A5F5;
2803
}
2804
levelbar block.full {
2806
background-color: #00C853;
2807
}
2808
levelbar block.empty {
2810
background-color: alpha(currentColor, 0.3);
2811
color: rgba(0, 0, 0, 0.32);
2812
}
2813
/****************
2815
* Print dialog *
2816
*****************/
2817
printdialog paper {
2818
padding: 0;
2819
border: 1px solid rgba(0, 0, 0, 0.1);
2820
background-color: #FFFFFF;
2821
color: rgba(0, 0, 0, 0.8);
2822
}
2823
printdialog .dialog-action-box {
2825
margin: 12px;
2826
}
2827
/**********
2829
* Frames *
2830
**********/
2831
frame > border,
2832
.frame {
2833
margin: 0;
2834
padding: 0;
2835
border: 1px solid rgba(0, 0, 0, 0.1);
2836
border-radius: 0;
2837
box-shadow: none;
2838
}
2839
frame > border.flat,
2841
.frame.flat,
2842
frame.flat > border {
2843
border-style: none;
2844
}
2845
actionbar > revealer > box {
2847
padding: 6px;
2848
border-top: 1px solid rgba(0, 0, 0, 0.1);
2849
}
2850
scrolledwindow viewport.frame {
2852
border-style: none;
2853
}
2854
overshoot.top {
2856
background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2857
background-repeat: no-repeat;
2858
background-position: center top;
2859
background-color: transparent;
2860
border: none;
2861
box-shadow: none;
2862
}
2863
overshoot.bottom {
2865
background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2866
background-repeat: no-repeat;
2867
background-position: center bottom;
2868
background-color: transparent;
2869
border: none;
2870
box-shadow: none;
2871
}
2872
overshoot.left {
2874
background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2875
background-repeat: no-repeat;
2876
background-position: left center;
2877
background-color: transparent;
2878
border: none;
2879
box-shadow: none;
2880
}
2881
overshoot.right {
2883
background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2884
background-repeat: no-repeat;
2885
background-position: right center;
2886
background-color: transparent;
2887
border: none;
2888
box-shadow: none;
2889
}
2890
undershoot.top {
2892
background-color: transparent;
2893
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
2894
padding-top: 1px;
2895
background-size: 12px 1px;
2896
background-repeat: repeat-x;
2897
background-origin: content-box;
2898
background-position: left top;
2899
}
2900
undershoot.bottom {
2902
background-color: transparent;
2903
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
2904
padding-bottom: 1px;
2905
background-size: 12px 1px;
2906
background-repeat: repeat-x;
2907
background-origin: content-box;
2908
background-position: left bottom;
2909
}
2910
undershoot.left {
2912
background-color: transparent;
2913
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
2914
padding-left: 1px;
2915
background-size: 1px 12px;
2916
background-repeat: repeat-y;
2917
background-origin: content-box;
2918
background-position: left top;
2919
}
2920
undershoot.right {
2922
background-color: transparent;
2923
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
2924
padding-right: 1px;
2925
background-size: 1px 12px;
2926
background-repeat: repeat-y;
2927
background-origin: content-box;
2928
background-position: right top;
2929
}
2930
junction {
2932
border-style: solid none none solid;
2933
border-width: 1px;
2934
border-color: rgba(0, 0, 0, 0.1);
2935
background-color: #FFFFFF;
2936
}
2937
junction:dir(rtl) {
2939
border-style: solid solid none none;
2940
}
2941
separator {
2943
min-width: 1px;
2944
min-height: 1px;
2945
background-color: rgba(0, 0, 0, 0.1);
2946
}
2947
/*********
2949
* Lists *
2950
*********/
2951
list {
2952
border-color: rgba(0, 0, 0, 0.1);
2953
background-color: #FFFFFF;
2954
}
2955
list row {
2957
padding: 2px;
2958
}
2959
row.activatable, .view, treeview.view header button {
2961
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, background-size 0.5s cubic-bezier(0, 0, 0.2, 1), background-image 1s cubic-bezier(0, 0, 0.2, 1);
2962
box-shadow: inset 0 0 0 9999px transparent;
2963
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
2964
background-repeat: no-repeat;
2965
background-position: center;
2966
background-size: 1000% 1000%;
2967
}
2968
row.activatable:hover, .view:hover, treeview.view header button:hover {
2970
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, box-shadow 0, background-size 0.5s cubic-bezier(0, 0, 0.2, 1), background-image 1s cubic-bezier(0, 0, 0.2, 1);
2971
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.05);
2972
}
2973
row.activatable.has-open-popup, .has-open-popup.view, treeview.view header button.has-open-popup, row.activatable:active, .view:active, treeview.view header button:active {
2975
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, background-size 0, background-image 0;
2976
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
2977
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
2978
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
2979
background-size: 0% 0%;
2980
}
2981
/*********************
2983
* App Notifications *
2984
*********************/
2985
.app-notification {
2986
margin: 8px;
2987
}
2988
.app-notification.frame,
2990
.app-notification border {
2991
border-style: none;
2992
}
2993
/*************
2995
* Expanders *
2996
*************/
2997
expander arrow {
2998
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
2999
min-width: 16px;
3000
min-height: 16px;
3001
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
3002
-gtk-icon-transform: rotate(-90deg);
3003
color: rgba(0, 0, 0, 0.6);
3004
}
3005
expander arrow:dir(rtl) {
3007
-gtk-icon-transform: rotate(90deg);
3008
}
3009
expander arrow:checked {
3011
-gtk-icon-transform: unset;
3012
}
3013
expander arrow:hover, expander arrow:active {
3015
color: rgba(0, 0, 0, 0.8);
3016
}
3017
expander arrow:disabled {
3019
color: rgba(0, 0, 0, 0.24);
3020
}
3021
expander arrow:selected {
3023
color: rgba(255, 255, 255, 0.75);
3024
}
3025
expander arrow:selected:hover, expander arrow:selected:active {
3027
color: #FFFFFF;
3028
}
3029
expander arrow:selected:disabled {
3031
color: rgba(255, 255, 255, 0.3);
3032
}
3033
/************
3035
* Calendar *
3036
************/
3037
calendar {
3038
padding: 1px;
3039
border: 1px solid rgba(0, 0, 0, 0.1);
3040
color: rgba(0, 0, 0, 0.8);
3041
}
3042
calendar:disabled {
3044
color: rgba(0, 0, 0, 0.32);
3045
}
3046
calendar:selected {
3048
border-radius: 3px;
3049
}
3050
calendar.header {
3052
border-style: none none solid;
3053
border-radius: 0;
3054
}
3055
calendar.highlight {
3057
color: alpha(currentColor, 0.6);
3058
font-weight: 500;
3059
}
3060
calendar:indeterminate {
3062
color: alpha(currentColor, 0.4);
3063
}
3064
/***********
3066
* Dialogs *
3067
***********/
3068
messagedialog.background {
3069
background-color: #FAFAFA;
3070
}
3071
messagedialog .titlebar {
3073
min-height: 24px;
3074
border-style: none;
3075
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
3076
background-color: #FAFAFA;
3077
color: rgba(0, 0, 0, 0.8);
3078
}
3079
messagedialog .titlebar:backdrop {
3081
color: rgba(0, 0, 0, 0.6);
3082
}
3083
messagedialog.csd.background {
3085
border-bottom-left-radius: 2px;
3086
border-bottom-right-radius: 2px;
3087
}
3088
messagedialog.csd .dialog-action-area button {
3090
padding: 8px 16px;
3091
border-top: 1px solid rgba(0, 0, 0, 0.1);
3092
border-radius: 0;
3093
}
3094
messagedialog.csd .dialog-action-area button:first-child {
3096
border-bottom-left-radius: 2px;
3097
}
3098
messagedialog.csd .dialog-action-area button:last-child {
3100
border-bottom-right-radius: 2px;
3101
}
3102
filechooser .dialog-action-box {
3104
border-top: 1px solid rgba(0, 0, 0, 0.1);
3105
}
3106
filechooser #pathbarbox {
3108
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3109
background-color: #F5F5F5;
3110
}
3111
filechooserbutton:drop(active) {
3113
box-shadow: none;
3114
}
3115
/***********
3117
* Sidebar *
3118
***********/
3119
.sidebar {
3120
border-style: none;
3121
background-color: #FAFAFA;
3122
}
3123
stacksidebar.sidebar:dir(ltr) list, stacksidebar.sidebar.left list, stacksidebar.sidebar.left:dir(rtl) list, .sidebar:dir(ltr), .sidebar.left, .sidebar.left:dir(rtl) {
3125
border-right: 1px solid rgba(0, 0, 0, 0.1);
3126
border-left-style: none;
3127
}
3128
stacksidebar.sidebar:dir(rtl) list, stacksidebar.sidebar.right list, .sidebar:dir(rtl), .sidebar.right {
3130
border-left: 1px solid rgba(0, 0, 0, 0.1);
3131
border-right-style: none;
3132
}
3133
.sidebar list {
3135
background-color: transparent;
3136
}
3137
paned .sidebar.left, paned .sidebar.right, paned .sidebar.left:dir(rtl), paned .sidebar:dir(rtl), paned .sidebar:dir(ltr), paned .sidebar {
3139
border-style: none;
3140
}
3141
stacksidebar row {
3143
padding: 10px 4px;
3144
}
3145
stacksidebar row > label {
3147
padding-left: 6px;
3148
padding-right: 6px;
3149
}
3150
/****************
3152
* File chooser *
3153
****************/
3154
placessidebar > viewport.frame {
3155
border-style: none;
3156
}
3157
placessidebar list {
3159
padding: 1px 0 4px;
3160
}
3161
placessidebar row {
3163
min-height: 32px;
3164
margin: -1px 0;
3165
padding: 0;
3166
}
3167
placessidebar row > revealer {
3169
padding: 0 12px;
3170
}
3171
placessidebar row:selected {
3173
color: #FFFFFF;
3174
}
3175
placessidebar row:disabled {
3177
color: rgba(0, 0, 0, 0.32);
3178
}
3179
placessidebar row image.sidebar-icon {
3181
opacity: 0.6;
3182
}
3183
placessidebar row image.sidebar-icon:dir(ltr) {
3185
padding-right: 8px;
3186
}
3187
placessidebar row image.sidebar-icon:dir(rtl) {
3189
padding-left: 8px;
3190
}
3191
placessidebar row label.sidebar-label:dir(ltr) {
3193
padding-right: 2px;
3194
}
3195
placessidebar row label.sidebar-label:dir(rtl) {
3197
padding-left: 2px;
3198
}
3199
placessidebar row.sidebar-placeholder-row {
3201
min-height: 2px;
3202
padding: 0 8px;
3203
background-image: image(#FF4081);
3204
background-clip: content-box;
3205
}
3206
placessidebar row.sidebar-new-bookmark-row {
3208
color: #FF4081;
3209
}
3210
placessidebar row:drop(active):not(:disabled) {
3212
box-shadow: inset 0 0 0 2px #FF4081;
3213
}
3214
placesview .server-list-button > image {
3216
-gtk-icon-transform: rotate(0turn);
3217
}
3218
placesview .server-list-button:checked > image {
3220
-gtk-icon-transform: rotate(-0.5turn);
3221
}
3222
placesview > actionbar > revealer > box > label {
3224
padding-left: 8px;
3225
padding-right: 8px;
3226
}
3227
/*********
3229
* Paned *
3230
*********/
3231
paned > separator {
3232
min-width: 1px;
3233
min-height: 1px;
3234
-gtk-icon-source: none;
3235
border-style: none;
3236
background-color: transparent;
3237
background-image: image(rgba(0, 0, 0, 0.1));
3238
background-size: 1px 1px;
3239
background-clip: content-box;
3240
}
3241
paned > separator.wide {
3243
min-width: 6px;
3244
min-height: 6px;
3245
background-color: #F5F5F5;
3246
background-image: image(rgba(0, 0, 0, 0.1)), image(rgba(0, 0, 0, 0.1));
3247
background-size: 1px 1px, 1px 1px;
3248
}
3249
paned.horizontal > separator {
3251
background-repeat: repeat-y;
3252
}
3253
paned.horizontal > separator:dir(ltr) {
3255
margin: 0 -8px 0 0;
3256
padding: 0 8px 0 0;
3257
background-position: left;
3258
}
3259
paned.horizontal > separator:dir(rtl) {
3261
margin: 0 0 0 -8px;
3262
padding: 0 0 0 8px;
3263
background-position: right;
3264
}
3265
paned.horizontal > separator.wide {
3267
margin: 0;
3268
padding: 0;
3269
background-repeat: repeat-y, repeat-y;
3270
background-position: left, right;
3271
}
3272
paned.vertical > separator {
3274
margin: 0 0 -8px 0;
3275
padding: 0 0 8px 0;
3276
background-repeat: repeat-x;
3277
background-position: top;
3278
}
3279
paned.vertical > separator.wide {
3281
margin: 0;
3282
padding: 0;
3283
background-repeat: repeat-x, repeat-x;
3284
background-position: bottom, top;
3285
}
3286
/**************
3288
* GtkInfoBar *
3289
**************/
3290
infobar {
3291
border-style: none;
3292
}
3293
infobar.info {
3295
background-color: #66BB6A;
3296
}
3297
infobar.question {
3299
background-color: #42A5F5;
3300
}
3301
infobar.warning {
3303
background-color: #FFA726;
3304
}
3305
infobar.error {
3307
background-color: #EF5350;
3308
}
3309
infobar.info > label, infobar.info, infobar.question > label, infobar.question, infobar.warning > label, infobar.warning, infobar.error > label, infobar.error {
3311
color: #FFFFFF;
3312
}
3313
/************
3315
* Tooltips *
3316
************/
3317
tooltip {
3318
border-radius: 2px;
3319
box-shadow: none;
3320
}
3321
tooltip.background {
3323
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
3324
background-color: rgba(255, 255, 255, 0.9);
3325
}
3326
tooltip:not(.csd):not(.unity-csd) {
3328
border: 1px solid rgba(0, 0, 0, 0.1);
3329
border-radius: 3px;
3330
background-clip: padding-box;
3331
}
3332
tooltip decoration {
3334
background-color: transparent;
3335
}
3336
tooltip label {
3338
min-height: 20px;
3339
padding: 0 2px;
3340
}
3341
/*****************
3343
* Color Chooser *
3344
*****************/
3345
colorswatch.top {
3346
border-top-left-radius: 2.5px;
3347
border-top-right-radius: 2.5px;
3348
}
3349
colorswatch.top overlay {
3351
border-top-left-radius: 2px;
3352
border-top-right-radius: 2px;
3353
}
3354
colorswatch.bottom {
3356
border-bottom-left-radius: 2.5px;
3357
border-bottom-right-radius: 2.5px;
3358
}
3359
colorswatch.bottom overlay {
3361
border-bottom-left-radius: 2px;
3362
border-bottom-right-radius: 2px;
3363
}
3364
colorswatch.left, colorswatch:first-child:not(.top) {
3366
border-top-left-radius: 2.5px;
3367
border-bottom-left-radius: 2.5px;
3368
}
3369
colorswatch.left overlay, colorswatch:first-child:not(.top) overlay {
3371
border-top-left-radius: 2px;
3372
border-bottom-left-radius: 2px;
3373
}
3374
colorswatch.right, colorswatch:last-child:not(.bottom) {
3376
border-top-right-radius: 2.5px;
3377
border-bottom-right-radius: 2.5px;
3378
}
3379
colorswatch.right overlay, colorswatch:last-child:not(.bottom) overlay {
3381
border-top-right-radius: 2px;
3382
border-bottom-right-radius: 2px;
3383
}
3384
colorswatch.dark overlay {
3386
color: #FFFFFF;
3387
}
3388
colorswatch.light overlay {
3390
color: rgba(0, 0, 0, 0.8);
3391
}
3392
colorswatch.dark {
3394
color: #FFFFFF;
3395
}
3396
colorswatch.light {
3398
color: rgba(0, 0, 0, 0.8);
3399
}
3400
colorswatch:drop(active) {
3402
box-shadow: none;
3403
}
3404
colorswatch:drop(active).light overlay {
3406
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;
3407
}
3408
colorswatch:drop(active).dark overlay {
3410
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;
3411
}
3412
colorswatch overlay {
3414
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3415
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3416
}
3417
colorswatch overlay:hover {
3419
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3420
}
3421
colorswatch#add-color-button {
3423
border-radius: 2px 2px 0 0;
3424
color: #FFFFFF;
3425
}
3426
colorswatch#add-color-button:only-child {
3428
border-radius: 2px;
3429
}
3430
colorswatch#add-color-button overlay {
3432
background-image: linear-gradient(to right, #EF5350 25%, #FFA726 25%, #FFA726 50%, #66BB6A 50%, #66BB6A 75%, #42A5F5 75%);
3433
color: #FFFFFF;
3434
}
3435
colorswatch:disabled {
3437
opacity: 0.4;
3438
}
3439
colorswatch:disabled overlay {
3441
box-shadow: none;
3442
}
3443
colorswatch#editor-color-sample {
3445
border-radius: 2.5px;
3446
}
3447
colorswatch#editor-color-sample overlay {
3449
border-radius: 2px;
3450
}
3451
colorchooser .popover.osd {
3453
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3454
border-radius: 2px;
3455
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);
3456
background-color: #FFFFFF;
3457
}
3458
colorchooser .popover.osd:backdrop {
3460
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);
3461
}
3462
/********
3464
* Misc *
3465
********/
3466
.content-view {
3467
background-color: #F5F5F5;
3468
}
3469
/**********************
3471
* Window Decorations *
3472
**********************/
3473
decoration {
3474
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3475
border-radius: 2px 2px 0 0;
3476
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent;
3477
margin: 8px;
3478
}
3479
decoration:backdrop {
3481
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent;
3482
}
3483
.maximized decoration,
3485
.fullscreen decoration,
3486
.tiled decoration {
3487
border-radius: 0;
3488
}
3489
.popup decoration {
3491
box-shadow: none;
3492
}
3493
.ssd decoration {
3495
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16);
3496
}
3497
.csd.popup decoration {
3499
border-radius: 2px;
3500
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3501
}
3502
tooltip.csd decoration {
3504
border-radius: 2px;
3505
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3506
}
3507
messagedialog.csd decoration {
3509
border-radius: 2px;
3510
}
3511
.solid-csd decoration {
3513
margin: 0;
3514
border-radius: 0;
3515
box-shadow: none;
3516
background-color: #E0E0E0;
3517
}
3518
.view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3520
entry selection, modelbutton.flat:selected,
3521
.menuitem.button.flat:selected, popover.background.menu button:checked,
3522
popover.background button.model:checked, row:selected, calendar:selected, text:selected {
3523
background-color: #42A5F5;
3524
}
3525
row:selected label, label:selected, .view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3527
entry selection, modelbutton.flat:selected,
3528
.menuitem.button.flat:selected, popover.background.menu button:checked,
3529
popover.background button.model:checked, row:selected, calendar:selected, text:selected {
3530
color: #FFFFFF;
3531
}
3532
row:selected label:disabled, label:disabled:selected, .view selection:disabled, .view:disabled:selected, flowbox flowboxchild:disabled:selected, label:disabled selection, spinbutton:not(.vertical) selection:disabled,
3534
entry selection:disabled, modelbutton.flat:disabled:selected,
3535
.menuitem.button.flat:disabled:selected, popover.background.menu button:disabled:checked,
3536
popover.background button.model:disabled:checked, row:disabled:selected, calendar:disabled:selected, text:disabled:selected {
3537
color: rgba(255, 255, 255, 0.4);
3538
}
3539
.monospace {
3541
font-family: monospace;
3542
}
3543
/**********************
3545
* Touch Copy & Paste *
3546
**********************/
3547
cursor-handle {
3548
border-radius: 9999px;
3549
background-color: #FF4081;
3550
background-image: none;
3551
}
3552
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) {
3554
padding-left: 6px;
3555
border-top-right-radius: 0;
3556
}
3557
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) {
3559
padding-right: 6px;
3560
border-top-left-radius: 0;
3561
}
3562
cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) {
3564
-GtkWidget-text-handle-width: 24;
3565
-GtkWidget-text-handle-height: 30;
3566
-gtk-icon-source: -gtk-scaled(url("assets/scale-horz-marks-before-slider.png"), url("assets/scale-horz-marks-before-slider@2.png"));
3567
}
3568
.context-menu {
3570
font: initial;
3571
}
3572
.keycap {
3574
min-width: 12px;
3575
min-height: 26px;
3576
margin-top: 2px;
3577
padding-bottom: 2px;
3578
padding-left: 8px;
3579
padding-right: 8px;
3580
border: solid 1px rgba(0, 0, 0, 0.1);
3581
border-radius: 3px;
3582
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.1);
3583
background-color: #FFFFFF;
3584
color: rgba(0, 0, 0, 0.8);
3585
font-size: smaller;
3586
}
3587
:not(decoration):not(window):drop(active) {
3589
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
3590
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;
3591
caret-color: #FF4081;
3592
}
3593
stackswitcher button.text-button {
3595
min-width: 100px;
3596
}
3597
stackswitcher button.circular,
3599
stackswitcher button.text-button.circular {
3600
min-width: 36px;
3601
min-height: 36px;
3602
padding: 0;
3603
}
3604
/************
3606
* Nautilus *
3607
************/
3608
.nautilus-window,
3609
.nautilus-window notebook,
3610
.nautilus-window notebook > stack {
3611
background-color: #FFFFFF;
3612
}
3613
.nautilus-desktop.nautilus-canvas-item:not(:selected), .caja-desktop.caja-canvas-item:not(:selected) {
3615
color: #FFFFFF;
3616
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3617
}
3618
@keyframes needs_attention_keyframes {
3620
to {
3621
background-color: alpha(currentColor, 0.3);
3622
}
3623
}
3624
.nautilus-operations-button-needs-attention {
3626
animation: needs_attention_keyframes 0.3s cubic-bezier(0.4, 0, 0.2, 1) 2 alternate;
3627
}
3628
.nautilus-operations-button-needs-attention-multiple {
3630
animation: needs_attention_keyframes 0.3s cubic-bezier(0.4, 0, 0.2, 1) 4 alternate;
3631
}
3632
.nautilus-window .floating-bar {
3634
min-height: 32px;
3635
padding: 0;
3636
border-style: solid solid none;
3637
border-width: 1px;
3638
border-color: rgba(0, 0, 0, 0.1);
3639
border-radius: 3px 3px 0 0;
3640
background-color: #FFFFFF;
3641
background-clip: padding-box;
3642
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), border-width 0;
3643
}
3644
.nautilus-window .floating-bar.bottom.left {
3646
margin-right: 7px;
3647
border-left-style: none;
3648
border-top-left-radius: 0;
3649
}
3650
.nautilus-window .floating-bar.bottom.right {
3652
margin-left: 7px;
3653
border-right-style: none;
3654
border-top-right-radius: 0;
3655
}
3656
.nautilus-window .floating-bar button {
3658
margin: 4px;
3659
}
3660
.disk-space-display.unknown {
3662
background-color: #FF6D00;
3663
}
3664
.disk-space-display.used {
3666
background-color: #42A5F5;
3667
}
3668
.disk-space-display.free {
3670
background-color: alpha(currentColor, 0.3);
3671
color: rgba(0, 0, 0, 0.32);
3672
}
3673
.documents-entry-tag, .photos-entry-tag {
3675
margin: 3px -2px 3px 8px;
3676
padding: 0 8px;
3677
border-radius: 9999px;
3678
box-shadow: none;
3679
background-color: #42A5F5;
3680
color: #FFFFFF;
3681
}
3682
.documents-entry-tag:hover, .photos-entry-tag:hover {
3684
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3685
}
3686
.documents-entry-tag.button, .button.photos-entry-tag {
3688
margin: 0 -2px;
3689
padding: 4px;
3690
border-radius: 9999px;
3691
box-shadow: none;
3692
color: rgba(255, 255, 255, 0.75);
3693
}
3694
.documents-entry-tag.button:hover, .button.photos-entry-tag:hover, .documents-entry-tag.button:active, .button.photos-entry-tag:active {
3696
color: #FFFFFF;
3697
}
3698
.nautilus-window searchbar {
3700
border-top: 1px solid rgba(0, 0, 0, 0.1);
3701
}
3702
.nautilus-window .searchbar-container {
3704
margin-top: -1px;
3705
}
3706
.nautilus-window paned > separator {
3708
background-color: #F5F5F5;
3709
}
3710
/*********
3712
* gedit *
3713
*********/
3714
.open-document-selector-name-label {
3715
font-weight: bold;
3716
}
3717
.open-document-selector-path-label {
3719
color: alpha(currentColor, 0.6);
3720
font-size: smaller;
3721
}
3722
.gedit-document-panel {
3724
background-color: #FAFAFA;
3725
}
3726
.gedit-document-panel row button.flat {
3728
margin-top: 8px;
3729
margin-bottom: 8px;
3730
}
3731
.gedit-document-panel-group-row:not(:first-child) {
3733
border-top: 1px solid rgba(0, 0, 0, 0.1);
3734
}
3735
.gedit-side-panel-paned statusbar {
3737
border-top: 1px solid rgba(0, 0, 0, 0.1);
3738
}
3739
.gedit-search-slider {
3741
margin: 4px 4px 8px;
3742
}
3743
.gedit-search-slider entry:dir(ltr), .gedit-search-slider entry:dir(rtl) {
3745
border-radius: 2px;
3746
}
3747
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag, .gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
3749
all: unset;
3750
color: alpha(currentColor, 0.6);
3751
}
3752
.gedit-search-slider entry:dir(ltr) {
3754
margin-right: -66px;
3755
padding-right: 66px;
3756
}
3757
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag {
3759
margin-left: 6px;
3760
}
3761
.gedit-search-slider entry:dir(ltr) image.right {
3763
margin-right: 0;
3764
}
3765
.gedit-search-slider entry:dir(rtl) {
3767
margin-left: -66px;
3768
padding-left: 66px;
3769
}
3770
.gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
3772
margin-right: 6px;
3773
}
3774
.gedit-search-slider entry:dir(rtl) image.left {
3776
margin-left: 0;
3777
}
3778
.gedit-search-slider entry.error ~ button {
3780
color: rgba(255, 255, 255, 0.75);
3781
}
3782
.gedit-search-slider entry.error ~ button:hover, .gedit-search-slider entry.error ~ button:active {
3784
color: #FFFFFF;
3785
}
3786
.gedit-search-slider entry.error ~ button:disabled {
3788
color: rgba(255, 255, 255, 0.3);
3789
}
3790
.gedit-search-slider button {
3792
border: solid 6px transparent;
3793
}
3794
.gedit-search-slider button:last-child:dir(ltr), .gedit-search-slider button:not(:first-child):dir(rtl) {
3796
margin-left: -3px;
3797
}
3798
.gedit-search-slider button:first-child:dir(rtl), .gedit-search-slider button:not(:last-child):dir(ltr) {
3800
margin-right: -3px;
3801
}
3802
frame.gedit-map-frame > border:dir(ltr) {
3804
border-style: none none none solid;
3805
}
3806
frame.gedit-map-frame > border:dir(rtl) {
3808
border-style: none solid none none;
3809
}
3810
/**************
3812
* Tweak Tool *
3813
**************/
3814
.tweak-categories {
3815
background-image: image(#FAFAFA);
3816
}
3817
.tweak-categories separator {
3819
min-width: 0;
3820
min-height: 0;
3821
background-color: transparent;
3822
}
3823
.tweak {
3825
padding: 3px;
3826
}
3827
.tweak.title:hover {
3829
box-shadow: none;
3830
}
3831
.tweak-group-white,
3833
.tweak-white,
3834
.tweak-white:hover {
3835
background-image: image(#FFFFFF);
3836
}
3837
.tweak-startup,
3839
.tweak-startup:hover {
3840
background-image: image(#FFFFFF);
3841
}
3842
.tweak-group-startup {
3844
background-image: image(#FFFFFF);
3845
border: 1px solid rgba(0, 0, 0, 0.1);
3846
}
3847
/***********
3849
* Builder *
3850
***********/
3851
workbench stack.titlebar {
3852
padding: 0;
3853
}
3854
workbench:not(.tiled):not(.maximized):not(.fullscreen) stack.titlebar headerbar {
3856
border-radius: 2px 2px 0 0;
3857
}
3858
perspectiveswitcher {
3860
background-color: #F5F5F5;
3861
}
3862
perspectiveswitcher button:checked {
3864
color: #42A5F5;
3865
}
3866
layouttabbar {
3868
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3869
background-color: #F5F5F5;
3870
}
3871
layouttabbar > box > button {
3873
margin: 2px 0;
3874
}
3875
layouttab {
3877
margin: 0 8px;
3878
border-style: none solid;
3879
border-width: 1px;
3880
border-color: rgba(0, 0, 0, 0.1);
3881
box-shadow: inset 0 -2px #42A5F5;
3882
background-color: #FFFFFF;
3883
}
3884
layouttab separator.vertical {
3886
margin: 8px 4px;
3887
}
3888
layouttab button.text-button, layouttab button.image-button, layouttab button {
3890
margin-top: 8px;
3891
margin-bottom: 8px;
3892
padding: 0 4px;
3893
}
3894
layout {
3896
border: 1px solid rgba(0, 0, 0, 0.1);
3897
-PnlDockBin-handle-size: 1;
3898
}
3899
entry.search-missing {
3901
background-color: #DD2C00;
3902
color: #FFFFFF;
3903
}
3904
workbench treeview.image {
3906
color: alpha(currentColor, 0.6);
3907
}
3908
workbench treeview.image:selected {
3910
color: rgba(255, 255, 255, 0.6);
3911
}
3912
dockbin {
3914
border: 1px solid rgba(0, 0, 0, 0.1);
3915
-PnlDockBin-handle-size: 1;
3916
}
3917
dockpaned {
3919
border: 1px solid rgba(0, 0, 0, 0.1);
3920
}
3921
eggsearchbar box.search-bar {
3923
padding: 0 8px;
3924
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3925
background-color: #F5F5F5;
3926
}
3927
docktabstrip {
3929
padding: 0 8px;
3930
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3931
background-color: #F5F5F5;
3932
}
3933
docktab {
3935
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
3936
min-height: 24px;
3937
min-width: 24px;
3938
margin-bottom: -1px;
3939
padding: 6px 6px;
3940
outline-offset: -6px;
3941
border-width: 1px;
3942
border-color: transparent;
3943
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 10%, transparent 0%);
3944
background-repeat: no-repeat;
3945
background-position: center;
3946
background-size: 0% 0%;
3947
color: rgba(0, 0, 0, 0.6);
3948
font-weight: 500;
3949
}
3950
docktab:hover {
3952
box-shadow: inset 0 -2px alpha(currentColor, 0.3);
3953
color: rgba(0, 0, 0, 0.8);
3954
}
3955
docktab:checked {
3957
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0.3s cubic-bezier(0, 0, 0.2, 1), background-image 0.8s cubic-bezier(0, 0, 0.2, 1);
3958
box-shadow: inset 0 -2px #42A5F5;
3959
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
3960
background-size: 1000% 1000%;
3961
color: rgba(0, 0, 0, 0.8);
3962
}
3963
dockoverlayedge {
3965
background-color: #F5F5F5;
3966
}
3967
dockoverlayedge docktabstrip {
3969
padding: 0;
3970
border: none;
3971
}
3972
dockoverlayedge.left-edge docktab:hover {
3974
box-shadow: inset -2px 0 alpha(currentColor, 0.3);
3975
}
3976
dockoverlayedge.left-edge docktab:checked {
3978
box-shadow: inset -2px 0 #42A5F5;
3979
}
3980
dockoverlayedge.right-edge docktab:hover {
3982
box-shadow: inset 2px 0 alpha(currentColor, 0.3);
3983
}
3984
dockoverlayedge.right-edge docktab:checked {
3986
box-shadow: inset 2px 0 #42A5F5;
3987
}
3988
pillbox {
3990
background-color: #F5F5F5;
3991
border-radius: 2px;
3992
}
3993
buildperspective row {
3995
padding: 10px;
3996
}
3997
layoutpane entry.search {
3999
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.1);
4000
background-color: #FFFFFF;
4001
}
4002
editortweak entry.search {
4004
margin-bottom: -1px;
4005
box-shadow: none;
4006
}
4007
frame.gb-search-frame {
4009
border-bottom-right-radius: 5px;
4010
}
4011
.gb-search-entry-occurrences-tag {
4013
box-shadow: none;
4014
background-color: transparent;
4015
}
4016
docktabstrip {
4018
min-height: 39px;
4019
}
4020
workbench preferences preferencesgroup list entry {
4022
padding-top: 8px;
4023
padding-bottom: 8px;
4024
}
4025
/**********
4027
* Photos *
4028
**********/
4029
GdMainIconView.content-view {
4030
-GdMainIconView-icon-size: 48;
4031
}
4032
.documents-counter {
4034
margin: 8px;
4035
border-radius: 9999px;
4036
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
4037
background-color: #FF4081;
4038
color: #FFFFFF;
4039
font-weight: bold;
4040
}
4041
.documents-scrolledwin.frame {
4043
border-style: none;
4044
}
4045
.photos-fade-in {
4047
opacity: 1;
4048
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
4049
}
4050
.photos-fade-out {
4052
opacity: 0;
4053
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
4054
}
4055
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) {
4057
border-style: none none none solid;
4058
}
4059
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(rtl) {
4061
border-style: none solid none none;
4062
}
4063
/*********
4065
* Music *
4066
*********/
4067
.side-panel:dir(ltr) {
4068
border-style: solid;
4069
border-color: rgba(0, 0, 0, 0.1);
4070
}
4071
.side-panel:dir(rtl) {
4073
border-style: solid;
4074
border-color: rgba(0, 0, 0, 0.1);
4075
}
4076
.side-panel .view {
4078
background-image: image(#FAFAFA);
4079
}
4080
.side-panel .view:hover {
4082
background-image: image(rgba(242, 242, 242, 0.99));
4083
}
4084
.side-panel .view:selected {
4086
background-image: image(#42A5F5);
4087
}
4088
.side-panel .view:selected:hover {
4090
background-image: image(#4baaf6);
4091
}
4092
.songs-list:hover {
4094
background-image: image(alpha(currentColor, 0.05));
4095
}
4096
frame.documents-dropdown {
4098
margin: 8px;
4099
}
4100
frame.documents-dropdown > border {
4102
border: none;
4103
}
4104
box.vertical:not(.titlebar) > revealer > toolbar.search-bar {
4106
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4107
}
4108
box.vertical:not(.titlebar) > revealer > toolbar.search-bar button > widget {
4110
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4111
}
4112
/*********
4114
* To Do *
4115
*********/
4116
task-row {
4117
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
4118
margin: 0 -4px;
4119
}
4120
task-row:hover {
4122
transition: none;
4123
}
4124
task-row label {
4126
margin: 0 8px;
4127
}
4128
task-row image {
4130
margin: 0 4px;
4131
}
4132
task-list-view > box > revealer > box > button {
4134
min-height: 36px;
4135
margin: -4px;
4136
padding: 0 12px;
4137
}
4138
task-list-view > box > revealer > box > button label {
4140
margin: 0 8px;
4141
}
4142
task-list-view > box > revealer > box > button image {
4144
margin: 0 4px;
4145
}
4146
/*******
4148
* eog *
4149
*******/
4150
#eog-thumb-nav scrolledwindow {
4151
border-top: none;
4152
}
4153
#eog-thumb-nav button {
4155
-gtk-outline-radius: 2px;
4156
}
4157
/*************
4159
* Evolution *
4160
*************/
4161
frame.taskbar > border {
4162
border-style: solid none none;
4163
}
4164
box.vertical > paned.horizontal notebook widget .frame {
4166
border-style: none;
4167
}
4168
/********
4170
* gitg *
4171
********/
4172
frame.commit-frame > border {
4173
border-style: solid none none;
4174
}
4175
/**************
4177
* Characters *
4178
**************/
4179
box.dialog-vbox scrolledwindow.related {
4180
border: 1px solid rgba(0, 0, 0, 0.1);
4181
}
4182
list.categories {
4184
background-image: image(#FAFAFA);
4185
}
4186
/**************
4188
* Calculator *
4189
**************/
4190
button.title label {
4191
min-height: 36px;
4192
}
4193
/*********
4195
* Tilix *
4196
*********/
4197
overlay > revealer.left > scrolledwindow.frame,
4198
overlay > revealer.right > scrolledwindow.frame {
4199
border-style: none;
4200
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22);
4201
}
4202
overlay > revealer.left > scrolledwindow.frame {
4204
margin-right: 32px;
4205
}
4206
overlay > revealer.right > scrolledwindow.frame {
4208
margin-left: 32px;
4209
}
4210
.terminix-session-sidebar,
4212
.tilix-session-sidebar {
4213
background-image: image(#FAFAFA);
4214
}
4215
button.image-button.session-new-button {
4217
min-width: 32px;
4218
}
4219
/***********
4221
* Eclipse *
4222
***********/
4223
window.background > box.vertical > scrolledwindow > widget toolbar {
4224
padding: 2px;
4225
}
4226
window.background > box.vertical > scrolledwindow > widget toolbar separator,
4228
window.background > box.vertical > scrolledwindow > widget toolbar button {
4229
margin: 2px;
4230
}
4231
window.background > box.vertical > scrolledwindow > widget toolbar button {
4233
border-radius: 2px;
4234
}
4235
/***********
4237
* Firefox *
4238
***********/
4239
window.background:not(.csd) > widget > separator {
4240
color: rgba(0, 0, 0, 0.2);
4241
}
4242
window.background:not(.csd) > widget > scrollbar {
4244
background-clip: border-box;
4245
}
4246
window.background:not(.csd) > widget > scrollbar,
4248
window.background:not(.csd) > widget > frame > border {
4249
border-color: rgba(0, 0, 0, 0.2);
4250
}
4251
window.background:not(.csd) > widget > entry,
4253
window.background:not(.csd) > widget > button > button {
4254
border: 1px solid rgba(0, 0, 0, 0.2);
4255
border-radius: 3px;
4256
box-shadow: none;
4257
}
4258
window.background:not(.csd) > widget > entry {
4260
min-height: 30px;
4261
}
4262
window.background:not(.csd) > widget > entry:focus {
4264
border-color: #42A5F5;
4265
}
4266
window.background:not(.csd) > widget > button > button {
4268
padding: 4px 8px;
4269
background-size: auto;
4270
}
4271
window.background:not(.csd) > widget > button > button:hover {
4273
background-image: image(alpha(currentColor, 0.05));
4274
}
4275
window.background:not(.csd) > widget > button > button:active {
4277
background-image: image(alpha(currentColor, 0.1));
4278
}
4279
window.background:not(.csd) > window > menu,
4281
window.background:not(.csd) > menu > menu {
4282
border: none;
4283
}
4284
window.background:not(.csd) > widget > menubar {
4286
color: rgba(0, 0, 0, 0.6);
4287
}
4288
window.background:not(.csd) > widget > menubar:hover {
4290
color: rgba(0, 0, 0, 0.8);
4291
}
4292
window.background:not(.csd) > widget > menubar:disabled {
4294
color: rgba(0, 0, 0, 0.24);
4295
}
4296
window.background:not(.csd) > widget > frame {
4298
color: rgba(0, 0, 0, 0.2);
4299
}
4300
window.background:not(.csd) > widget > checkbutton > check,
4302
window.background:not(.csd) > widget > radiobutton > radio {
4303
margin: 0;
4304
padding: 0;
4305
}
4306
window.background:not(.csd) > window.background > menu > separator {
4308
color: rgba(0, 0, 0, 0.1);
4309
}
4310
/***********
4312
* Synapse *
4313
***********/
4314
box.vertical > widget > widget:selected {
4315
background-color: #42A5F5;
4316
}
4317
/*********
4319
* Unity *
4320
*********/
4321
UnityDecoration {
4322
-UnityDecoration-extents: 28px 0 0 0;
4323
-UnityDecoration-input-extents: 8px;
4324
-UnityDecoration-shadow-offset-x: 0;
4325
-UnityDecoration-shadow-offset-y: 3px;
4326
-UnityDecoration-active-shadow-color: rgba(0, 0, 0, 0.48);
4327
-UnityDecoration-active-shadow-radius: 18px;
4328
-UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32);
4329
-UnityDecoration-inactive-shadow-radius: 6px;
4330
-UnityDecoration-glow-size: 8px;
4331
-UnityDecoration-glow-color: #42A5F5;
4332
-UnityDecoration-title-indent: 4px;
4333
-UnityDecoration-title-fade: 32px;
4334
-UnityDecoration-title-alignment: 0.0;
4335
}
4336
UnityDecoration .top {
4338
padding: 0 2px;
4339
border-style: none;
4340
border-radius: 2px 2px 0 0;
4341
box-shadow: inset 0 1px rgba(255, 255, 255, 0.2);
4342
background-color: #cfcfcf;
4343
color: rgba(0, 0, 0, 0.8);
4344
}
4345
UnityDecoration .top:backdrop {
4347
color: rgba(0, 0, 0, 0.6);
4348
}
4349
UnityDecoration .menuitem {
4351
color: alpha(currentColor, 0.75);
4352
}
4353
UnityDecoration .menuitem:hover {
4355
box-shadow: inset 0 -2px #42A5F5;
4356
background-color: transparent;
4357
color: currentColor;
4358
}
4359
.background:not(.csd) headerbar:not(.titlebar) {
4361
border-radius: 0;
4362
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
4363
}
4364
.background:not(.csd) headerbar:not(.titlebar).inline-toolbar {
4366
border-style: none;
4367
}
4368
UnityPanelWidget,
4370
.unity-panel {
4371
background-color: #cfcfcf;
4372
color: rgba(0, 0, 0, 0.8);
4373
}
4374
UnityPanelWidget:backdrop,
4376
.unity-panel:backdrop {
4377
color: rgba(0, 0, 0, 0.6);
4378
}
4379
.unity-panel.menuitem,
4381
.unity-panel .menuitem {
4382
color: alpha(currentColor, 0.75);
4383
}
4384
.unity-panel.menubar.menuitem:hover,
4386
.unity-panel.menubar .menuitem *:hover {
4387
box-shadow: inset 0 -2px #42A5F5;
4388
background-color: transparent;
4389
color: currentColor;
4390
}
4391
.menu IdoPlaybackMenuItem.menuitem:active {
4393
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
4394
animation: spin 1s linear infinite;
4395
color: #42A5F5;
4396
}
4397
/**************
4399
* Mate-Panel *
4400
**************/
4401
.mate-panel-menu-bar menubar,
4402
#PanelApplet-window-menu-applet-button {
4403
background-color: transparent;
4404
}
4405
#PanelPlug,
4407
PanelToplevel.background {
4408
background-color: #cfcfcf;
4409
color: rgba(0, 0, 0, 0.8);
4410
font-weight: 500;
4411
}
4412
PanelToplevel > widget > button {
4414
padding: 0 4px;
4415
border-radius: 0;
4416
}
4417
PanelSeparator {
4419
color: rgba(0, 0, 0, 0.1);
4420
}
4421
MatePanelAppletFrameDBus {
4423
border-style: solid;
4424
border-width: 0 1px;
4425
border-color: rgba(0, 0, 0, 0.1);
4426
}
4427
.mate-panel-menu-bar menubar menuitem {
4429
padding: 4px;
4430
}
4431
.mate-panel-menu-bar menubar menu menuitem {
4433
padding: 6px;
4434
}
4435
.mate-panel-menu-bar #PanelApplet button {
4437
-GtkWidget-window-dragging: true;
4438
padding: 4px;
4439
border-radius: 0;
4440
}
4441
PanelApplet.wnck-applet .wnck-pager {
4443
background-color: transparent;
4444
color: #40C4FF;
4445
}
4446
PanelApplet.wnck-applet .wnck-pager:hover {
4448
background-color: alpha(currentColor, 0.15);
4449
}
4450
PanelApplet.wnck-applet .wnck-pager:active {
4452
background-color: alpha(currentColor, 0.3);
4453
}
4454
PanelApplet.wnck-applet .wnck-pager:selected {
4456
background-color: #42A5F5;
4457
}
4458
#MatePanelPopupWindow {
4460
border: 1px solid rgba(0, 0, 0, 0.1);
4461
border-radius: 3px;
4462
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
4463
}
4464
#MatePanelPopupWindow frame > border {
4466
border-style: none;
4467
}
4468
#MatePanelPopupWindow ClockMap {
4470
border: 1px solid rgba(0, 0, 0, 0.1);
4471
}
4472
na-tray-applet {
4474
-NaTrayApplet-icon-padding: 3px;
4475
-NaTrayApplet-icon-size: 16;
4476
}
4477
.mate-panel-menu-bar {
4479
-PanelMenuBar-icon-visible: true;
4480
}
4481
.mate-panel-applet-slider {
4483
background-color: transparent;
4484
}
4485
.mate-panel-applet-slider frame {
4487
border: 1px solid rgba(0, 0, 0, 0.1);
4488
border-radius: 3px;
4489
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
4490
background-color: #F5F5F5;
4491
}
4492
.mate-panel-applet-slider frame frame {
4494
all: unset;
4495
}
4496
.mate-panel-applet-slider frame > border {
4498
border-style: none;
4499
}
4500
/*********************
4502
* CAJA File manager *
4503
*********************/
4504
.caja-navigation-window button.toggle.image-button {
4505
border-radius: 2px;
4506
}
4507
.caja-pathbar button {
4509
margin: 0 -1px 0 -2px;
4510
}
4511
.caja-pathbar button > widget {
4513
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4514
-GtkArrow-arrow-scaling: 1;
4515
}
4516
.caja-side-pane notebook viewport.frame,
4518
.caja-side-pane notebook widget .vertical {
4519
background-color: #FFFFFF;
4520
}
4521
.caja-side-pane notebook,
4523
.caja-notebook {
4524
border-top: 1px solid rgba(0, 0, 0, 0.1);
4525
}
4526
.caja-side-pane notebook .frame,
4528
.caja-notebook .frame {
4529
border-style: none;
4530
}
4531
.caja-navigation-window statusbar {
4533
margin: 0 -10px;
4534
padding: 0 4px;
4535
border-top: 1px solid rgba(0, 0, 0, 0.1);
4536
}
4537
.caja-notebook frame > border {
4539
border-style: none;
4540
}
4541
#caja-extra-view-widget {
4543
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4544
background-color: #F5F5F5;
4545
}
4546
#caja-extra-view-widget > box > box > label {
4548
font-weight: bold;
4549
}
4550
/*********
4552
* Pluma *
4553
*********/
4554
.pluma-window statusbar {
4555
margin: 0 -10px;
4556
padding: 0 4px;
4557
border-top: 1px solid rgba(0, 0, 0, 0.1);
4558
}
4559
.pluma-window statusbar frame > border {
4561
border-style: none;
4562
}
4563
.pluma-window statusbar frame button.flat {
4565
padding: 0 4px;
4566
border-radius: 0;
4567
}
4568
.pluma-window statusbar frame button.flat widget {
4570
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4571
-GtkArrow-arrow-scaling: 1;
4572
}
4573
.pluma-print-preview toolbar {
4575
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4576
}
4577
.pluma-window paned.horizontal box.vertical box.horizontal button.flat {
4579
margin: 1px;
4580
}
4581
.pluma-window paned.horizontal box.vertical .frame {
4583
border-style: none;
4584
}
4585
.pluma-window paned.horizontal box.vertical notebook.frame {
4587
margin-top: -1px;
4588
border-top: 1px solid rgba(0, 0, 0, 0.1);
4589
}
4590
.pluma-window paned.horizontal box.vertical notebook.frame box.vertical toolbar.horizontal {
4592
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4593
}
4594
/*********
4596
* Atril *
4597
*********/
4598
.atril-window paned.horizontal box.vertical .frame {
4599
border-style: none;
4600
}
4601
.atril-window paned.horizontal box.vertical notebook .frame {
4603
border-top: 1px solid rgba(0, 0, 0, 0.1);
4604
}
4605
/* mate-screensaver lock dialog */
4607
.lock-dialog {
4608
border-radius: 2px;
4609
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), inset 0 1px rgba(255, 255, 255, 0.4);
4610
}
4611
.lock-dialog frame > border {
4613
border-style: none;
4614
}
4615
/************************
4617
* LightDM GTK+ Greeter *
4618
************************/
4619
#panel_window {
4620
background-color: rgba(0, 0, 0, 0.3);
4621
color: #FFFFFF;
4622
}
4623
#panel_window menubar,
4625
#panel_window separator {
4626
background-color: transparent;
4627
}
4628
#panel_window separator {
4630
padding: 0 4px;
4631
}
4632
#panel_window separator:first-child {
4634
padding: 0 8px;
4635
}
4636
#panel_window menubar > menuitem {
4638
color: rgba(255, 255, 255, 0.75);
4639
}
4640
#panel_window menubar > menuitem:hover {
4642
color: #FFFFFF;
4643
}
4644
#panel_window menubar > menuitem:disabled label {
4646
color: rgba(255, 255, 255, 0.3);
4647
}
4648
#login_window,
4650
#shutdown_dialog,
4651
#restart_dialog {
4652
margin: 8px;
4653
border-radius: 2px;
4654
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);
4655
background-color: #FAFAFA;
4656
}
4657
#content_frame {
4659
padding-bottom: 20px;
4660
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4661
}
4662
#buttonbox_frame {
4664
padding-top: 24px;
4665
}
4666
#buttonbox_frame button {
4668
margin: -16px;
4669
}
4670
#greeter_infobar {
4672
margin-top: -1px;
4673
}
4674
/* GTK NAMED COLORS
4676
----------------
4677
use responsibly! */
4678
/*
4679
widget text/foreground color */
4680
@define-color theme_fg_color rgba(0, 0, 0, 0.8);
4681
/*
4682
text color for entries, views and content in general */
4683
@define-color theme_text_color rgba(0, 0, 0, 0.8);
4684
/*
4685
widget base background color */
4686
@define-color theme_bg_color #F5F5F5;
4687
/*
4688
text widgets and the like base background color */
4689
@define-color theme_base_color #FFFFFF;
4690
/*
4691
base background color of selections */
4692
@define-color theme_selected_bg_color #42A5F5;
4693
/*
4694
text/foreground color of selections */
4695
@define-color theme_selected_fg_color #FFFFFF;
4696
/*
4697
base background color of insensitive widgets */
4698
@define-color insensitive_bg_color #F5F5F5;
4699
/*
4700
text foreground color of insensitive widgets */
4701
@define-color insensitive_fg_color rgba(0, 0, 0, 0.32);
4702
/*
4703
insensitive text widgets and the like base background color */
4704
@define-color insensitive_base_color #FAFAFA;
4705
/*
4706
widget text/foreground color on backdrop windows */
4707
@define-color theme_unfocused_fg_color rgba(0, 0, 0, 0.8);
4708
/*
4709
text color for entries, views and content in general on backdrop windows */
4710
@define-color theme_unfocused_text_color rgba(0, 0, 0, 0.8);
4711
/*
4712
widget base background color on backdrop windows */
4713
@define-color theme_unfocused_bg_color #F5F5F5;
4714
/*
4715
text widgets and the like base background color on backdrop windows */
4716
@define-color theme_unfocused_base_color #FFFFFF;
4717
/*
4718
base background color of selections on backdrop windows */
4719
@define-color theme_unfocused_selected_bg_color #42A5F5;
4720
/*
4721
text/foreground color of selections on backdrop windows */
4722
@define-color theme_unfocused_selected_fg_color #FFFFFF;
4723
/*
4724
insensitive color on backdrop windows */
4725
@define-color unfocused_insensitive_color rgba(0, 0, 0, 0.32);
4726
/*
4727
widgets main borders color */
4728
@define-color borders rgba(0, 0, 0, 0.1);
4729
/*
4730
widgets main borders color on backdrop windows */
4731
@define-color unfocused_borders rgba(0, 0, 0, 0.1);
4732
/*
4733
these are pretty self explicative */
4734
@define-color warning_color #FF6D00;
4735
@define-color error_color #DD2C00;
4736
@define-color success_color #00C853;
4737
/*
4738
FIXME this is really an API */
4739
@define-color content_view_bg #FFFFFF;
4740
@define-color placeholder_text_color rgba(128, 128, 128, 0.88);
4741