ASCII text, with very long lines (417)
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: 32px;
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: 32px;
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), entry.preferences-search, 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), entry.preferences-search:focus, 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), entry.preferences-search:disabled, 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), entry.error.preferences-search, 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), entry.error.preferences-search:focus, 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), entry.error.preferences-search:disabled, 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), entry.warning.preferences-search, 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), entry.warning.preferences-search:focus, 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), entry.warning.preferences-search:disabled, 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), .linked:not(.vertical) > entry.preferences-search, 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),
433
.linked.vertical > entry.preferences-search, layoutpane
434
.linked.vertical > entry.search, editortweak
435
.linked.vertical > entry.search, #login_window
436
.linked.vertical > entry, .linked:not(.vertical) >
437
entry.flat,
438
.linked.vertical >
439
entry.flat {
440
border-radius: 0;
441
}
442
treeview entry.flat, treeview entry {
444
min-height: 0;
445
padding: 2px;
446
border-radius: 0;
447
background-color: #FFFFFF;
448
}
449
treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:focus {
451
border-image: none;
452
box-shadow: none;
453
}
454
/***********
456
* Buttons *
457
***********/
458
@keyframes needs_attention {
459
from {
460
background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent));
461
}
462
to {
463
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#FF4081), to(transparent));
464
}
465
}
466
button {
469
min-height: 24px;
470
min-width: 16px;
471
padding: 4px 8px;
472
border-radius: 2px;
473
font-weight: 500;
474
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);
475
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;
476
background-color: #FAFAFA;
477
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
478
background-repeat: no-repeat;
479
background-position: center;
480
background-size: 1000% 1000%;
481
color: rgba(0, 0, 0, 0.6);
482
}
483
button:hover {
486
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;
487
color: rgba(0, 0, 0, 0.8);
488
}
489
button:active {
492
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
493
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
494
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);
495
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
496
background-size: 0% 0%;
497
color: rgba(0, 0, 0, 0.8);
498
}
499
button:disabled {
502
box-shadow: none;
503
background-color: alpha(currentColor, 0.3);
504
color: rgba(0, 0, 0, 0.24);
505
}
506
button:checked {
509
background-color: #42A5F5;
510
color: #FFFFFF;
511
}
512
button:checked:disabled {
515
background-color: alpha(currentColor, 0.3);
516
color: rgba(66, 165, 245, 0.4);
517
}
518
modelbutton.flat,
520
.menuitem.button.flat, spinbutton:not(.vertical) button, spinbutton.vertical button, popover.background.menu button,
521
popover.background button.model, notebook > header > tabs > arrow, scrollbar button, check,
522
radio, calendar.button, messagedialog.csd .dialog-action-area button, button.sidebar-button, .gedit-search-slider button, popover.messagepopover .popover-action-area button, PanelToplevel > widget > button, .lightdm-gtk-greeter button, :not(headerbar) .caja-pathbar button, .caja-pathbar :not(headerbar) button, :not(headerbar)
523
.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),
524
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,
525
button.flat {
526
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);
527
box-shadow: inset 0 0 0 9999px transparent;
528
background-color: transparent;
529
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
530
background-repeat: no-repeat;
531
background-position: center;
532
background-size: 1000% 1000%;
533
color: alpha(currentColor, 0.75);
534
}
535
modelbutton.flat:hover,
537
.menuitem.button.flat:hover, spinbutton:not(.vertical) button:hover, spinbutton.vertical button:hover, popover.background.menu button:hover,
538
popover.background button.model:hover, notebook > header > tabs > arrow:hover, scrollbar button:hover, check:hover,
539
radio:hover, calendar.button:hover, messagedialog.csd .dialog-action-area button:hover, button.sidebar-button:hover, .gedit-search-slider button:hover, popover.messagepopover .popover-action-area 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)
540
.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),
541
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,
542
button.flat:hover {
543
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
544
color: currentColor;
545
}
546
modelbutton.flat:active,
548
.menuitem.button.flat:active, spinbutton:not(.vertical) button:active, spinbutton.vertical button:active, popover.background.menu button:active,
549
popover.background button.model:active, notebook > header > tabs > arrow:active, scrollbar button:active, check:active,
550
radio:active, calendar.button:active, messagedialog.csd .dialog-action-area button:active, button.sidebar-button:active, .gedit-search-slider button:active, popover.messagepopover .popover-action-area 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)
551
.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),
552
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,
553
button.flat:active {
554
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
555
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
556
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
557
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
558
background-size: 0% 0%;
559
color: currentColor;
560
}
561
modelbutton.flat:disabled,
563
.menuitem.button.flat:disabled, spinbutton:not(.vertical) button:disabled, spinbutton.vertical button:disabled, popover.background.menu button:disabled,
564
popover.background button.model:disabled, notebook > header > tabs > arrow:disabled, scrollbar button:disabled, check:disabled,
565
radio:disabled, calendar.button:disabled, messagedialog.csd .dialog-action-area button:disabled, button.sidebar-button:disabled, .gedit-search-slider button:disabled, popover.messagepopover .popover-action-area 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)
566
.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),
567
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,
568
button.flat:disabled {
569
box-shadow: none;
570
background-color: transparent;
571
color: alpha(currentColor, 0.3);
572
}
573
:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar)
575
.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),
576
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,
577
button.flat:checked {
578
background-color: alpha(currentColor, 0.3);
579
color: currentColor;
580
}
581
:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar)
583
.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),
584
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,
585
button.flat:checked:disabled {
586
background-color: alpha(currentColor, 0.3);
587
color: alpha(currentColor, 0.4);
588
}
589
button.text-button {
592
padding-left: 16px;
593
padding-right: 16px;
594
}
595
button.image-button {
598
min-width: 24px;
599
padding: 4px;
600
}
601
button.text-button.image-button label:first-child {
604
margin-left: 12px;
605
}
606
button.text-button.image-button label:last-child {
609
margin-right: 12px;
610
}
611
button.text-button.image-button image:not(:only-child) {
614
margin: 0 4px;
615
}
616
toolbar .linked > button, .titlebar:not(headerbar) .linked > button:not(.suggested-action):not(.destructive-action),
618
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
619
.linked.vertical > button, .titlebar:not(headerbar)
620
.linked.vertical > button:not(.suggested-action):not(.destructive-action),
621
headerbar
622
.linked.vertical > button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box
623
.linked.vertical > button:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification
624
.linked.vertical > button, .linked >
625
button.flat,
626
.linked.vertical >
627
button.flat {
628
border-radius: 2px;
629
}
630
infobar.info button:disabled, infobar.question button:disabled, infobar.warning button:disabled, infobar.error button:disabled, row:selected
632
button:disabled {
633
color: rgba(255, 255, 255, 0.3);
634
}
635
button.osd {
638
padding: 10px 14px;
639
}
640
button.osd.image-button {
643
padding: 10px;
644
}
645
button.osd:disabled {
648
opacity: 0;
649
}
650
button.suggested-action {
653
background-color: #FF4081;
654
color: #FFFFFF;
655
}
656
button.suggested-action:disabled {
659
box-shadow: none;
660
background-color: alpha(currentColor, 0.3);
661
color: rgba(0, 0, 0, 0.32);
662
}
663
button.suggested-action:checked {
666
background-color: #ff79a7;
667
}
668
button.suggested-action.flat {
671
background-color: transparent;
672
color: #FF4081;
673
}
674
button.suggested-action.flat:disabled {
677
box-shadow: none;
678
background-color: transparent;
679
color: alpha(currentColor, 0.4);
680
}
681
button.suggested-action.flat:checked {
684
background-color: alpha(currentColor, 0.3);
685
}
686
button.destructive-action {
689
background-color: #FF5252;
690
color: #FFFFFF;
691
}
692
button.destructive-action:disabled {
695
box-shadow: none;
696
background-color: alpha(currentColor, 0.3);
697
color: rgba(0, 0, 0, 0.32);
698
}
699
button.destructive-action:checked {
702
background-color: #ff8686;
703
}
704
button.destructive-action.flat {
707
background-color: transparent;
708
color: #FF5252;
709
}
710
button.destructive-action.flat:disabled {
713
box-shadow: none;
714
background-color: transparent;
715
color: alpha(currentColor, 0.4);
716
}
717
button.destructive-action.flat:checked {
720
background-color: alpha(currentColor, 0.3);
721
}
722
.stack-switcher >
724
button {
725
outline-offset: -4px;
726
}
727
.stack-switcher >
729
button > label {
730
padding-left: 6px;
731
padding-right: 6px;
732
}
733
.stack-switcher >
735
button > image {
736
padding-left: 6px;
737
padding-right: 6px;
738
padding-top: 3px;
739
padding-bottom: 3px;
740
}
741
.stack-switcher >
743
button.text-button {
744
padding-left: 10px;
745
padding-right: 10px;
746
}
747
.stack-switcher >
749
button.image-button {
750
padding-left: 2px;
751
padding-right: 2px;
752
}
753
.stack-switcher >
755
button.needs-attention:checked > label,
756
.stack-switcher >
757
button.needs-attention:checked > image {
758
animation: none;
759
background-image: none;
760
}
761
button separator {
764
min-width: 0;
765
min-height: 0;
766
background-color: transparent;
767
}
768
.primary-toolbar
770
button {
771
-gtk-icon-shadow: none;
772
}
773
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),
776
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
777
.linked.vertical > button.image-button:not(.text-button),
778
headerbar
779
.linked.vertical > button.image-button:not(.text-button):not(.suggested-action):not(.destructive-action), .app-notification
780
.linked.vertical > button.image-button:not(.text-button), .linked > button.flat.image-button:not(.text-button),
781
.linked.vertical > button.flat.image-button:not(.text-button), .inline-toolbar button:not(.text-button), check,
782
radio, button.titlebutton, .nautilus-window headerbar > revealer > button,
783
button.close,
784
button.circular {
785
border-radius: 9999px;
786
-gtk-outline-radius: 9999px;
787
}
788
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 {
790
min-height: 20px;
791
min-width: 20px;
792
padding: 0;
793
border-radius: 9999px;
794
-gtk-outline-radius: 9999px;
795
}
796
.stack-switcher >
798
button.needs-attention > label,
799
.stack-switcher >
800
button.needs-attention > image, stacksidebar row.needs-attention > label {
801
animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
802
background-repeat: no-repeat;
803
background-position: right 3px;
804
background-size: 6px 6px;
805
}
806
.stack-switcher >
808
button.needs-attention > label:dir(rtl),
809
.stack-switcher >
810
button.needs-attention > image:dir(rtl), stacksidebar row.needs-attention > label:dir(rtl) {
811
background-position: left 3px;
812
}
813
.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) {
815
border-radius: 0;
816
-gtk-outline-radius: 2px;
817
}
818
.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) {
820
border-radius: 2px 0 0 2px;
821
}
822
.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) {
824
border-radius: 0 2px 2px 0;
825
}
826
.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) {
828
border-radius: 0;
829
-gtk-outline-radius: 2px;
830
}
831
.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 {
833
border-radius: 2px 2px 0 0;
834
}
835
.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 {
837
border-radius: 0 0 2px 2px;
838
}
839
/* menu buttons */
841
modelbutton.flat,
842
.menuitem.button.flat {
843
min-height: 28px;
844
padding: 0 8px;
845
border-radius: 2px;
846
color: inherit;
847
}
848
modelbutton.flat check,
850
modelbutton.flat radio,
851
.menuitem.button.flat check,
852
.menuitem.button.flat radio {
853
box-shadow: none;
854
background-image: none;
855
}
856
modelbutton.flat check:not(:checked):not(:indeterminate),
858
modelbutton.flat radio:not(:checked):not(:indeterminate),
859
.menuitem.button.flat check:not(:checked):not(:indeterminate),
860
.menuitem.button.flat radio:not(:checked):not(:indeterminate) {
861
color: alpha(currentColor, 0.6);
862
}
863
modelbutton.flat check:last-child,
865
modelbutton.flat radio:last-child,
866
.menuitem.button.flat check:last-child,
867
.menuitem.button.flat radio:last-child {
868
margin-left: -8px;
869
margin-right: -16px;
870
}
871
modelbutton.flat check:first-child,
873
modelbutton.flat radio:first-child,
874
.menuitem.button.flat check:first-child,
875
.menuitem.button.flat radio:first-child {
876
margin-left: -16px;
877
margin-right: -8px;
878
}
879
modelbutton.flat arrow {
881
background: none;
882
}
883
modelbutton.flat arrow:hover {
885
background: none;
886
}
887
modelbutton.flat arrow.left {
889
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
890
}
891
modelbutton.flat arrow.right {
893
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
894
}
895
button.color {
897
min-height: 20px;
898
min-width: 20px;
899
padding: 6px;
900
}
901
/*********
903
* Links *
904
*********/
905
*:link, button:link,
906
button:visited, *:link:hover, button:hover:link,
907
button:hover:visited, *:link:active, button:active:link,
908
button:active:visited {
909
color: #42A5F5;
910
}
911
*:link:visited,
913
button:visited, *:link:visited:hover,
914
button:visited:hover, *:link:visited:active,
915
button:visited:active {
916
color: #E040FB;
917
}
918
infobar.info *:link, infobar.info button:link, infobar.info
920
button:visited, infobar.question *:link, infobar.question button:link, infobar.question
921
button:visited, infobar.warning *:link, infobar.warning button:link, infobar.warning
922
button:visited, infobar.error *:link, infobar.error button:link, infobar.error
923
button:visited, *:link:selected, button:selected:link,
924
button:selected:visited, .selection-mode.titlebar:not(headerbar) .subtitle:link,
925
headerbar.selection-mode .subtitle:link,
926
*:selected *:link,
927
*:selected button:link,
928
*:selected
929
button:visited {
930
color: #FFFFFF;
931
}
932
button:link > label,
934
button:visited > label {
935
text-decoration-line: underline;
936
}
937
/*****************
939
* GtkSpinButton *
940
*****************/
941
spinbutton:not(.vertical) {
942
padding: 0;
943
}
944
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,
946
spinbutton:not(.vertical) entry {
947
min-width: 28px;
948
margin: 0;
949
border-image: none;
950
border-radius: 0;
951
box-shadow: none;
952
background-color: transparent;
953
}
954
spinbutton:not(.vertical) button {
956
border: solid 6px transparent;
957
}
958
spinbutton:not(.vertical) button.up:dir(ltr), spinbutton:not(.vertical) button.down:dir(rtl) {
960
margin-left: -3px;
961
}
962
spinbutton:not(.vertical) button.up:dir(rtl), spinbutton:not(.vertical) button.down:dir(ltr) {
964
margin-right: -3px;
965
}
966
spinbutton.vertical:disabled {
968
color: rgba(0, 0, 0, 0.32);
969
}
970
spinbutton.vertical:drop(active) {
972
box-shadow: none;
973
}
974
spinbutton.vertical entry {
976
min-height: 32px;
977
min-width: 44px;
978
padding: 0;
979
}
980
spinbutton.vertical button {
982
min-height: 32px;
983
min-width: 44px;
984
padding: 0;
985
}
986
spinbutton.vertical button.up {
988
border-radius: 2px 2px 0 0;
989
}
990
spinbutton.vertical button.down {
992
border-radius: 0 0 2px 2px;
993
}
994
treeview spinbutton:not(.vertical) {
996
min-height: 0;
997
border-style: none;
998
border-radius: 0;
999
}
1000
treeview spinbutton:not(.vertical) entry {
1002
min-height: 0;
1003
padding: 1px 2px;
1004
}
1005
/**************
1007
* ComboBoxes *
1008
**************/
1009
combobox arrow {
1010
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1011
min-height: 16px;
1012
min-width: 16px;
1013
}
1014
combobox decoration,
1016
combobox button.combo:checked {
1017
transition: none;
1018
}
1019
combobox button.combo cellview:dir(ltr) {
1021
margin-left: 0px;
1022
}
1023
combobox button.combo cellview:dir(rtl) {
1025
margin-right: 0px;
1026
}
1027
combobox #gtk-combobox-popup-menu {
1029
padding: 2px 0;
1030
}
1031
combobox #gtk-combobox-popup-menu menuitem {
1033
min-height: 28px;
1034
padding: 0 8px;
1035
}
1036
combobox #gtk-combobox-popup-menu > arrow.top {
1038
margin-top: -2px;
1039
}
1040
combobox #gtk-combobox-popup-menu > arrow.bottom {
1042
margin-bottom: -6px;
1043
}
1044
combobox:drop(active) {
1046
box-shadow: none;
1047
}
1048
notebook > stack:not(:only-child) button.combo, #login_window #user_combobox button {
1050
border-radius: 0;
1051
background-image: none;
1052
font-weight: inherit;
1053
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1054
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1055
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
1056
background-color: transparent;
1057
color: rgba(0, 0, 0, 0.8);
1058
}
1059
notebook > stack:not(:only-child) button.combo:hover, #login_window #user_combobox button:hover {
1061
box-shadow: inset 0 -2px alpha(currentColor, 0.3);
1062
}
1063
notebook > stack:not(:only-child) button.combo:checked, #login_window #user_combobox button:checked {
1065
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1066
}
1067
notebook > stack:not(:only-child) button.combo:disabled, #login_window #user_combobox button:disabled {
1069
color: rgba(0, 0, 0, 0.32);
1070
}
1071
/************
1073
* Toolbars *
1074
************/
1075
toolbar {
1076
-GtkWidget-window-dragging: true;
1077
padding: 3px;
1078
background-color: #F5F5F5;
1079
}
1080
.osd toolbar {
1082
background-color: transparent;
1083
}
1084
toolbar.osd, .app-notification, frame.documents-dropdown {
1086
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1087
padding: 6px;
1088
border-radius: 2px;
1089
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);
1090
background-color: #FFFFFF;
1091
}
1092
toolbar.osd:backdrop, .app-notification:backdrop, frame.documents-dropdown:backdrop {
1094
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);
1095
}
1096
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 {
1098
border-radius: 0;
1099
}
1100
toolbar.horizontal separator {
1102
margin: 3px;
1103
}
1104
toolbar.vertical separator {
1106
margin: 3px;
1107
}
1108
toolbar:not(.inline-toolbar):not(.osd) scale,
1110
toolbar:not(.inline-toolbar):not(.osd) entry,
1111
toolbar:not(.inline-toolbar):not(.osd) spinbutton,
1112
toolbar:not(.inline-toolbar):not(.osd) button {
1113
margin: 3px;
1114
}
1115
toolbar:not(.inline-toolbar):not(.osd) .linked entry:not(:first-child),
1117
toolbar:not(.inline-toolbar):not(.osd) .linked spinbutton:not(:first-child),
1118
toolbar:not(.inline-toolbar):not(.osd) .linked button:not(:first-child) {
1119
margin-left: 0;
1120
}
1121
toolbar:not(.inline-toolbar):not(.osd) .linked entry:not(:last-child),
1123
toolbar:not(.inline-toolbar):not(.osd) .linked spinbutton:not(:last-child),
1124
toolbar:not(.inline-toolbar):not(.osd) .linked button:not(:last-child) {
1125
margin-right: 0;
1126
}
1127
toolbar:not(.inline-toolbar):not(.osd) switch {
1129
margin: 9px 3px;
1130
}
1131
.inline-toolbar {
1133
padding: 6px;
1134
border-style: solid;
1135
border-width: 0 1px 1px;
1136
border-color: rgba(0, 0, 0, 0.1);
1137
background-color: #FAFAFA;
1138
}
1139
searchbar,
1141
.location-bar {
1142
padding: 6px;
1143
border-style: solid;
1144
border-width: 0 0 1px;
1145
border-color: rgba(0, 0, 0, 0.1);
1146
background-color: #F5F5F5;
1147
background-clip: border-box;
1148
}
1149
/***************
1151
* Header bars *
1152
***************/
1153
.titlebar:not(headerbar),
1154
headerbar {
1155
transition: background-color 0.2s cubic-bezier(0, 0, 0.2, 1);
1156
min-height: 44px;
1157
padding: 0 6px;
1158
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.15);
1159
background-color: #455A64;
1160
color: #FFFFFF;
1161
}
1162
.titlebar:disabled:not(headerbar) :not(button) > label,
1164
headerbar:disabled :not(button) > label {
1165
color: rgba(255, 255, 255, 0.4);
1166
}
1167
.titlebar:backdrop:not(headerbar),
1169
headerbar:backdrop {
1170
color: rgba(255, 255, 255, 0.75);
1171
}
1172
.titlebar:backdrop:disabled:not(headerbar) :not(button) > label,
1174
headerbar:backdrop:disabled :not(button) > label {
1175
color: rgba(255, 255, 255, 0.3);
1176
}
1177
.titlebar:not(headerbar) .title,
1179
headerbar .title {
1180
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1181
padding: 0 12px;
1182
font-weight: bold;
1183
}
1184
.titlebar:not(headerbar) .subtitle,
1186
headerbar .subtitle {
1187
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1188
padding: 0 12px;
1189
font-size: smaller;
1190
}
1191
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
1193
headerbar button:not(.suggested-action):not(.destructive-action) {
1194
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px;
1195
}
1196
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1198
headerbar button:not(.suggested-action):not(.destructive-action):checked {
1199
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
1200
}
1201
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1203
headerbar button:not(.suggested-action):not(.destructive-action):checked,
1204
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled {
1205
background-color: transparent;
1206
}
1207
.titlebar:not(headerbar) button.suggested-action:disabled, .titlebar:not(headerbar) button.destructive-action:disabled,
1209
headerbar button.suggested-action:disabled,
1210
headerbar button.destructive-action:disabled {
1211
color: alpha(currentColor, 0.4);
1212
}
1213
.selection-mode.titlebar:not(headerbar),
1215
headerbar.selection-mode {
1216
transition: background-color 0.00001s 0.3s;
1217
animation: header_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1);
1218
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);
1219
background-color: #42A5F5;
1220
color: #FFFFFF;
1221
}
1222
.selection-mode.titlebar:backdrop:not(headerbar),
1224
headerbar.selection-mode:backdrop {
1225
color: rgba(255, 255, 255, 0.75);
1226
}
1227
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
1229
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action) {
1230
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px;
1231
color: currentColor;
1232
}
1233
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled,
1235
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled {
1236
color: alpha(currentColor, 0.4);
1237
}
1238
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1240
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked {
1241
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
1242
color: currentColor;
1243
}
1244
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1246
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled {
1247
color: alpha(currentColor, 0.4);
1248
}
1249
.selection-mode.titlebar:not(headerbar) .selection-menu,
1251
headerbar.selection-mode .selection-menu {
1252
padding-left: 16px;
1253
padding-right: 16px;
1254
}
1255
.selection-mode.titlebar:not(headerbar) .selection-menu GtkArrow,
1257
headerbar.selection-mode .selection-menu GtkArrow {
1258
-GtkArrow-arrow-scaling: 1;
1259
}
1260
.selection-mode.titlebar:not(headerbar) .selection-menu .arrow,
1262
headerbar.selection-mode .selection-menu .arrow {
1263
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1264
}
1265
.fullscreen .titlebar:not(headerbar),
1267
.tiled .titlebar:not(headerbar),
1268
.maximized .titlebar:not(headerbar), .fullscreen
1269
headerbar,
1270
.tiled
1271
headerbar,
1272
.maximized
1273
headerbar {
1274
border-radius: 0;
1275
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1276
}
1277
.default-decoration.titlebar:not(headerbar),
1279
headerbar.default-decoration {
1280
min-height: 20px;
1281
padding: 6px;
1282
box-shadow: inset 0 1px rgba(255, 255, 255, 0.15);
1283
}
1284
.fullscreen .default-decoration.titlebar:not(headerbar),
1286
.tiled .default-decoration.titlebar:not(headerbar),
1287
.maximized .default-decoration.titlebar:not(headerbar), .fullscreen
1288
headerbar.default-decoration,
1289
.tiled
1290
headerbar.default-decoration,
1291
.maximized
1292
headerbar.default-decoration {
1293
box-shadow: none;
1294
}
1295
.default-decoration.titlebar:not(headerbar) button.titlebutton,
1297
headerbar.default-decoration button.titlebutton {
1298
min-height: 20px;
1299
min-width: 20px;
1300
margin: 0;
1301
padding: 0;
1302
}
1303
.background:not(.csd) .default-decoration.titlebar:not(headerbar) button.titlebutton:active, .background:not(.csd)
1305
headerbar.default-decoration button.titlebutton:active {
1306
background-size: 1000% 1000%;
1307
}
1308
headerbar entry,
1310
headerbar spinbutton,
1311
headerbar button {
1312
margin-top: 6px;
1313
margin-bottom: 6px;
1314
}
1315
headerbar switch {
1317
margin-top: 12px;
1318
margin-bottom: 12px;
1319
}
1320
headerbar spinbutton button {
1322
margin-top: 0;
1323
margin-bottom: 0;
1324
}
1325
.background:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) .titlebar {
1327
border-top-left-radius: 2px;
1328
border-top-right-radius: 2px;
1329
}
1330
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) separator:first-child + headerbar,
1332
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) headerbar:first-child {
1333
border-top-left-radius: 2px;
1334
}
1335
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) headerbar:last-child {
1337
border-top-right-radius: 2px;
1338
}
1339
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 {
1341
border-top-left-radius: 2px;
1342
border-top-right-radius: 2px;
1343
}
1344
window.csd > .titlebar:not(headerbar) {
1346
padding: 0;
1347
background-color: transparent;
1348
background-image: none;
1349
border-style: none;
1350
box-shadow: none;
1351
}
1352
.titlebar:not(headerbar) > separator {
1354
background-color: #455A64;
1355
background-image: image(rgba(0, 0, 0, 0.1));
1356
}
1357
/************
1359
* Pathbars *
1360
************/
1361
.caja-pathbar button,
1362
.path-bar button {
1363
padding-left: 4px;
1364
padding-right: 4px;
1365
}
1366
.caja-pathbar button label:not(:only-child):first-child,
1368
.path-bar button label:not(:only-child):first-child {
1369
margin-left: 4px;
1370
}
1371
.caja-pathbar button label:not(:only-child):last-child,
1373
.path-bar button label:not(:only-child):last-child {
1374
margin-right: 4px;
1375
}
1376
.caja-pathbar button.slider-button,
1378
.path-bar button.slider-button {
1379
padding-left: 4px;
1380
padding-right: 4px;
1381
}
1382
:not(headerbar) .caja-pathbar button, .caja-pathbar :not(headerbar) button, :not(headerbar)
1384
.path-bar button {
1385
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1386
border-radius: 2px;
1387
}
1388
:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar)
1390
.path-bar button:checked {
1391
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1392
}
1393
: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)
1395
.path-bar button:checked, :not(headerbar)
1396
.path-bar button:checked:disabled {
1397
background-color: transparent;
1398
}
1399
/**************
1401
* Tree Views *
1402
**************/
1403
treeview.view {
1404
border-left-color: alpha(currentColor, 0.3);
1405
border-top-color: rgba(0, 0, 0, 0.1);
1406
}
1407
* {
1409
-GtkTreeView-horizontal-separator: 4;
1410
-GtkTreeView-grid-line-width: 1;
1411
-GtkTreeView-grid-line-pattern: '';
1412
-GtkTreeView-tree-line-width: 1;
1413
-GtkTreeView-tree-line-pattern: '';
1414
-GtkTreeView-expander-size: 16;
1415
}
1416
treeview.view.separator {
1418
min-height: 5px;
1419
color: rgba(0, 0, 0, 0.1);
1420
}
1421
treeview.view:drop(active) {
1423
border-style: solid none;
1424
border-width: 1px;
1425
border-color: #FF4081;
1426
}
1427
treeview.view:drop(active).after {
1429
border-top-style: none;
1430
}
1431
treeview.view:drop(active).before {
1433
border-bottom-style: none;
1434
}
1435
treeview.view.expander {
1437
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1438
-gtk-icon-transform: rotate(-90deg);
1439
color: rgba(0, 0, 0, 0.6);
1440
}
1441
treeview.view.expander:dir(rtl) {
1443
-gtk-icon-transform: rotate(90deg);
1444
}
1445
treeview.view.expander:checked {
1447
-gtk-icon-transform: unset;
1448
}
1449
treeview.view.expander:hover, treeview.view.expander:active {
1451
color: rgba(0, 0, 0, 0.8);
1452
}
1453
treeview.view.expander:disabled {
1455
color: rgba(0, 0, 0, 0.24);
1456
}
1457
treeview.view.expander:selected {
1459
color: rgba(255, 255, 255, 0.75);
1460
}
1461
treeview.view.expander:selected:hover, treeview.view.expander:selected:active {
1463
color: #FFFFFF;
1464
}
1465
treeview.view.expander:selected:disabled {
1467
color: rgba(255, 255, 255, 0.3);
1468
}
1469
treeview.view.progressbar {
1471
border-bottom: 4px solid #42A5F5;
1472
box-shadow: none;
1473
background-color: transparent;
1474
}
1475
treeview.view.progressbar:selected {
1477
border-bottom-color: currentColor;
1478
}
1479
treeview.view.trough {
1481
border-bottom: 4px solid rgba(66, 165, 245, 0.3);
1482
box-shadow: none;
1483
background-color: transparent;
1484
}
1485
treeview.view.trough:selected {
1487
border-bottom-color: alpha(currentColor, 0.3);
1488
}
1489
treeview.view header button {
1491
padding: 2px 6px;
1492
border-style: none solid solid none;
1493
border-width: 1px;
1494
border-color: rgba(0, 0, 0, 0.1);
1495
border-radius: 0;
1496
background-clip: border-box;
1497
}
1498
treeview.view header button, treeview.view header button:hover, treeview.view header button:active {
1500
box-shadow: none;
1501
}
1502
treeview.view header button, treeview.view header button:disabled {
1504
background-color: #FFFFFF;
1505
}
1506
treeview.view header button:last-child {
1508
border-right-style: none;
1509
}
1510
treeview.view button.dnd,
1512
treeview.view header.button.dnd {
1513
padding: 2px 6px;
1514
border-style: none solid solid;
1515
border-width: 1px;
1516
border-color: rgba(0, 0, 0, 0.1);
1517
border-radius: 0;
1518
box-shadow: none;
1519
background-color: #FFFFFF;
1520
background-clip: border-box;
1521
color: #42A5F5;
1522
}
1523
treeview.view acceleditor > label {
1525
background-color: #42A5F5;
1526
}
1527
/*********
1529
* Menus *
1530
*********/
1531
menubar,
1532
.menubar {
1533
-GtkWidget-window-dragging: true;
1534
padding: 0;
1535
background-color: #455A64;
1536
}
1537
menubar > menuitem,
1539
.menubar > menuitem {
1540
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
1541
min-height: 20px;
1542
padding: 4px 8px;
1543
color: rgba(255, 255, 255, 0.75);
1544
}
1545
menubar > menuitem:hover,
1547
.menubar > menuitem:hover {
1548
transition: none;
1549
background-color: alpha(currentColor, 0.15);
1550
color: #FFFFFF;
1551
}
1552
menubar > menuitem:disabled,
1554
.menubar > menuitem:disabled {
1555
color: rgba(255, 255, 255, 0.3);
1556
}
1557
.csd.popup {
1559
border-radius: 2px;
1560
}
1561
menu,
1563
.menu,
1564
.context-menu {
1565
margin: 4px 0;
1566
padding: 4px 0;
1567
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
1568
background-color: #FFFFFF;
1569
border: 1px solid rgba(0, 0, 0, 0.1);
1570
}
1571
.csd menu, .csd
1573
.menu, .csd
1574
.context-menu {
1575
border: none;
1576
border-radius: 2px;
1577
}
1578
menu menuitem,
1580
.menu menuitem,
1581
.context-menu menuitem {
1582
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
1583
min-height: 20px;
1584
min-width: 40px;
1585
padding: 4px 8px;
1586
font: initial;
1587
text-shadow: none;
1588
}
1589
menu menuitem:hover,
1591
.menu menuitem:hover,
1592
.context-menu menuitem:hover {
1593
transition: none;
1594
background-color: alpha(currentColor, 0.15);
1595
}
1596
menu menuitem:disabled,
1598
.menu menuitem:disabled,
1599
.context-menu menuitem:disabled {
1600
color: rgba(0, 0, 0, 0.32);
1601
}
1602
menu menuitem arrow,
1604
.menu menuitem arrow,
1605
.context-menu menuitem arrow {
1606
min-height: 16px;
1607
min-width: 16px;
1608
}
1609
menu menuitem arrow:dir(ltr),
1611
.menu menuitem arrow:dir(ltr),
1612
.context-menu menuitem arrow:dir(ltr) {
1613
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1614
margin-left: 8px;
1615
}
1616
menu menuitem arrow:dir(rtl),
1618
.menu menuitem arrow:dir(rtl),
1619
.context-menu menuitem arrow:dir(rtl) {
1620
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl");
1621
margin-right: 8px;
1622
}
1623
menu menuitem label:dir(rtl), menu menuitem label:dir(ltr),
1625
.menu menuitem label:dir(rtl),
1626
.menu menuitem label:dir(ltr),
1627
.context-menu menuitem label:dir(rtl),
1628
.context-menu menuitem label:dir(ltr) {
1629
color: inherit;
1630
}
1631
menu > arrow,
1633
.menu > arrow,
1634
.context-menu > arrow {
1635
min-height: 16px;
1636
min-width: 16px;
1637
padding: 4px;
1638
background-color: #FFFFFF;
1639
color: rgba(0, 0, 0, 0.6);
1640
}
1641
menu > arrow.top,
1643
.menu > arrow.top,
1644
.context-menu > arrow.top {
1645
margin-top: -4px;
1646
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
1647
border-radius: 2px 2px 0 0;
1648
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
1649
}
1650
menu > arrow.bottom,
1652
.menu > arrow.bottom,
1653
.context-menu > arrow.bottom {
1654
margin-bottom: -12px;
1655
border-top: 1px solid rgba(0, 0, 0, 0.1);
1656
border-radius: 0 0 2px 2px;
1657
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1658
}
1659
menu > arrow:hover,
1661
.menu > arrow:hover,
1662
.context-menu > arrow:hover {
1663
background-image: image(alpha(currentColor, 0.15));
1664
color: rgba(0, 0, 0, 0.8);
1665
}
1666
menu > arrow:disabled,
1668
.menu > arrow:disabled,
1669
.context-menu > arrow:disabled {
1670
border-color: transparent;
1671
background-color: transparent;
1672
color: transparent;
1673
}
1674
menu separator,
1676
.menu separator,
1677
.context-menu separator {
1678
margin: 4px 0;
1679
}
1680
menuitem accelerator {
1682
color: alpha(currentColor, 0.6);
1683
}
1684
.popup:not(.csd) menu menuitem {
1686
color: #333333;
1687
}
1688
.popup:not(.csd) menu menuitem:hover {
1690
background-color: #e0e0e0;
1691
}
1692
.popup:not(.csd) menu menuitem:disabled {
1694
color: #adadad;
1695
}
1696
.popup:not(.csd) menu accelerator {
1698
color: #858585;
1699
}
1700
/************
1702
* Popovers *
1703
************/
1704
popover.background {
1705
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1706
padding: 2px;
1707
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
1708
background-color: #FAFAFA;
1709
}
1710
popover.background:backdrop {
1712
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1713
}
1714
popover.background, .csd popover.background {
1716
border-style: solid;
1717
border-width: 1px;
1718
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3);
1719
border-radius: 3px;
1720
}
1721
popover.background > stack {
1723
margin: -4px;
1724
}
1725
popover.background > toolbar {
1727
margin: -2px;
1728
}
1729
popover.background > list,
1731
popover.background > .view,
1732
popover.background > toolbar {
1733
border-style: none;
1734
box-shadow: none;
1735
background-color: transparent;
1736
}
1737
popover.background.menu button,
1739
popover.background button.model {
1740
min-height: 32px;
1741
padding: 0 8px;
1742
border-radius: 2px;
1743
}
1744
popover.background separator {
1746
margin: 4px 0;
1747
}
1748
popover.background list separator {
1750
margin: 0;
1751
}
1752
/*************
1754
* Notebooks *
1755
*************/
1756
notebook > header {
1757
border-width: 1px;
1758
border-color: rgba(0, 0, 0, 0.1);
1759
background-color: #F5F5F5;
1760
background-clip: border-box;
1761
}
1762
notebook > header.top {
1764
border-bottom-style: solid;
1765
}
1766
notebook > header.top > tabs {
1768
margin-bottom: -1px;
1769
}
1770
notebook > header.top > tabs > tab:hover {
1772
box-shadow: inset 0 -2px alpha(currentColor, 0.3);
1773
}
1774
notebook > header.top > tabs > tab:checked {
1776
box-shadow: inset 0 -2px #42A5F5;
1777
}
1778
notebook > header.bottom {
1780
border-top-style: solid;
1781
}
1782
notebook > header.bottom > tabs {
1784
margin-top: -1px;
1785
}
1786
notebook > header.bottom > tabs > tab:hover {
1788
box-shadow: inset 0 2px alpha(currentColor, 0.3);
1789
}
1790
notebook > header.bottom > tabs > tab:checked {
1792
box-shadow: inset 0 2px #42A5F5;
1793
}
1794
notebook > header.left {
1796
border-right-style: solid;
1797
}
1798
notebook > header.left > tabs {
1800
margin-right: -1px;
1801
}
1802
notebook > header.left > tabs > tab:hover {
1804
box-shadow: inset -2px 0 alpha(currentColor, 0.3);
1805
}
1806
notebook > header.left > tabs > tab:checked {
1808
box-shadow: inset -2px 0 #42A5F5;
1809
}
1810
notebook > header.right {
1812
border-left-style: solid;
1813
}
1814
notebook > header.right > tabs {
1816
margin-left: -1px;
1817
}
1818
notebook > header.right > tabs > tab:hover {
1820
box-shadow: inset 2px 0 alpha(currentColor, 0.3);
1821
}
1822
notebook > header.right > tabs > tab:checked {
1824
box-shadow: inset 2px 0 #42A5F5;
1825
}
1826
notebook > header.top > tabs > arrow {
1828
border-top-style: none;
1829
}
1830
notebook > header.bottom > tabs > arrow {
1832
border-bottom-style: none;
1833
}
1834
notebook > header.top > tabs > arrow, notebook > header.bottom > tabs > arrow {
1836
padding-left: 4px;
1837
padding-right: 4px;
1838
}
1839
notebook > header.top > tabs > arrow.down, notebook > header.bottom > tabs > arrow.down {
1841
margin-left: -8px;
1842
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
1843
}
1844
notebook > header.top > tabs > arrow.up, notebook > header.bottom > tabs > arrow.up {
1846
margin-right: -8px;
1847
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1848
}
1849
notebook > header.left > tabs > arrow {
1851
border-left-style: none;
1852
}
1853
notebook > header.right > tabs > arrow {
1855
border-right-style: none;
1856
}
1857
notebook > header.left > tabs > arrow, notebook > header.right > tabs > arrow {
1859
padding-top: 4px;
1860
padding-bottom: 4px;
1861
}
1862
notebook > header.left > tabs > arrow.down, notebook > header.right > tabs > arrow.down {
1864
margin-top: -8px;
1865
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
1866
}
1867
notebook > header.left > tabs > arrow.up, notebook > header.right > tabs > arrow.up {
1869
margin-bottom: -8px;
1870
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1871
}
1872
notebook > header > tabs > arrow {
1874
min-height: 16px;
1875
min-width: 16px;
1876
border-radius: 0;
1877
}
1878
notebook > header tab {
1880
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
1881
min-height: 20px;
1882
min-width: 20px;
1883
padding: 6px 12px;
1884
outline-offset: -6px;
1885
border-width: 1px;
1886
border-color: transparent;
1887
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 10%, transparent 0%);
1888
background-repeat: no-repeat;
1889
background-position: center;
1890
background-size: 0% 0%;
1891
color: rgba(0, 0, 0, 0.6);
1892
font-weight: 500;
1893
}
1894
notebook > header tab:hover {
1896
color: rgba(0, 0, 0, 0.8);
1897
}
1898
notebook > header tab:hover.reorderable-page {
1900
border-color: rgba(0, 0, 0, 0.1);
1901
background-color: #FAFAFA;
1902
}
1903
notebook > header tab:disabled {
1905
color: rgba(0, 0, 0, 0.24);
1906
}
1907
notebook > header tab:checked {
1909
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);
1910
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
1911
background-size: 1000% 1000%;
1912
color: rgba(0, 0, 0, 0.8);
1913
}
1914
notebook > header tab:checked:disabled {
1916
color: rgba(0, 0, 0, 0.32);
1917
}
1918
notebook > header tab:checked.reorderable-page {
1920
border-color: rgba(0, 0, 0, 0.1);
1921
background-color: #FFFFFF;
1922
}
1923
notebook > header tab button.flat:last-child {
1925
margin-left: 6px;
1926
margin-right: -6px;
1927
}
1928
notebook > header tab button.flat:first-child {
1930
margin-left: -6px;
1931
margin-right: 6px;
1932
}
1933
notebook > header.top tabs, notebook > header.bottom tabs {
1935
padding-left: 8px;
1936
padding-right: 8px;
1937
}
1938
notebook > header.top tabs:not(:only-child):first-child, notebook > header.bottom tabs:not(:only-child):first-child {
1940
margin-left: 0;
1941
}
1942
notebook > header.top tabs:not(:only-child):last-child, notebook > header.bottom tabs:not(:only-child):last-child {
1944
margin-right: 0;
1945
}
1946
notebook > header.top tabs tab.reorderable-page, notebook > header.bottom tabs tab.reorderable-page {
1948
margin: 0 -1px;
1949
border-style: none solid;
1950
}
1951
notebook > header.left tabs, notebook > header.right tabs {
1953
padding-top: 8px;
1954
padding-bottom: 8px;
1955
}
1956
notebook > header.left tabs:not(:only-child):first-child, notebook > header.right tabs:not(:only-child):first-child {
1958
margin-top: 0;
1959
}
1960
notebook > header.left tabs:not(:only-child):last-child, notebook > header.right tabs:not(:only-child):last-child {
1962
margin-bottom: 0;
1963
}
1964
notebook > header.left tabs tab.reorderable-page, notebook > header.right tabs tab.reorderable-page {
1966
margin: -1px 0;
1967
border-style: solid none;
1968
}
1969
notebook > stack:not(:only-child) {
1971
background-color: #FFFFFF;
1972
}
1973
/**************
1975
* Scrollbars *
1976
**************/
1977
scrollbar {
1978
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1979
background-color: #FFFFFF;
1980
background-clip: padding-box;
1981
}
1982
* {
1984
-GtkScrollbar-has-backward-stepper: false;
1985
-GtkScrollbar-has-forward-stepper: false;
1986
}
1987
scrollbar.top {
1989
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
1990
}
1991
scrollbar.bottom {
1993
border-top: 1px solid rgba(0, 0, 0, 0.1);
1994
}
1995
scrollbar.left {
1997
border-right: 1px solid rgba(0, 0, 0, 0.1);
1998
}
1999
scrollbar.right {
2001
border-left: 1px solid rgba(0, 0, 0, 0.1);
2002
}
2003
scrollbar slider {
2005
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0;
2006
min-width: 8px;
2007
min-height: 8px;
2008
border: 4px solid transparent;
2009
border-radius: 9999px;
2010
background-clip: padding-box;
2011
background-color: rgba(0, 0, 0, 0.48);
2012
}
2013
scrollbar slider:hover {
2015
background-color: rgba(0, 0, 0, 0.6);
2016
}
2017
scrollbar slider:active {
2019
background-color: rgba(0, 0, 0, 0.8);
2020
}
2021
scrollbar slider:disabled {
2023
background-color: rgba(0, 0, 0, 0.192);
2024
}
2025
scrollbar.fine-tune slider {
2027
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0, min-width 0, min-height 0;
2028
min-width: 4px;
2029
min-height: 4px;
2030
}
2031
scrollbar.fine-tune.horizontal slider {
2033
margin: 2px 0;
2034
}
2035
scrollbar.fine-tune.vertical slider {
2037
margin: 0 2px;
2038
}
2039
scrollbar.overlay-indicator:not(.dragging):not(.hovering) {
2041
border-color: transparent;
2042
background-color: transparent;
2043
}
2044
scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider {
2046
min-width: 4px;
2047
min-height: 4px;
2048
margin: 3px;
2049
border: 1px solid rgba(255, 255, 255, 0.3);
2050
}
2051
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button {
2053
min-width: 4px;
2054
min-height: 4px;
2055
margin: 3px;
2056
border: 1px solid rgba(255, 255, 255, 0.3);
2057
border-radius: 9999px;
2058
background-color: rgba(0, 0, 0, 0.48);
2059
background-clip: padding-box;
2060
-gtk-icon-source: none;
2061
}
2062
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled {
2064
background-color: rgba(0, 0, 0, 0.192);
2065
}
2066
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider {
2068
min-width: 24px;
2069
}
2070
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal button {
2072
min-width: 8px;
2073
}
2074
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider {
2076
min-height: 24px;
2077
}
2078
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button {
2080
min-height: 8px;
2081
}
2082
scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering {
2084
background-color: rgba(255, 255, 255, 0.9);
2085
}
2086
scrollbar.horizontal slider {
2088
min-width: 24px;
2089
}
2090
scrollbar.vertical slider {
2092
min-height: 24px;
2093
}
2094
scrollbar button {
2096
min-width: 16px;
2097
min-height: 16px;
2098
padding: 0;
2099
border-radius: 0;
2100
}
2101
scrollbar.vertical button.down {
2103
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
2104
}
2105
scrollbar.vertical button.up {
2107
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
2108
}
2109
scrollbar.horizontal button.down {
2111
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
2112
}
2113
scrollbar.horizontal button.up {
2115
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
2116
}
2117
/**********
2119
* Switch *
2120
**********/
2121
switch {
2122
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2123
margin: 6px 0;
2124
border: 4px solid transparent;
2125
border-radius: 9999px;
2126
background-color: alpha(currentColor, 0.3);
2127
background-clip: padding-box;
2128
font-size: 0;
2129
}
2130
switch:disabled {
2132
color: alpha(currentColor, 0.4);
2133
}
2134
switch:checked {
2136
background-color: rgba(255, 64, 129, 0.5);
2137
}
2138
switch:checked:disabled {
2140
background-color: rgba(255, 64, 129, 0.2);
2141
color: rgba(0, 0, 0, 0.32);
2142
}
2143
switch slider {
2145
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
2146
border-image: none;
2147
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2148
background-color: #FFFFFF;
2149
color: rgba(0, 0, 0, 0.8);
2150
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0;
2151
min-width: 20px;
2152
min-height: 20px;
2153
margin: -4px 0 -4px -4px;
2154
border-radius: 9999px;
2155
-gtk-outline-radius: 9999px;
2156
}
2157
switch:hover slider {
2159
border-image: none;
2160
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2161
}
2162
switch:checked slider {
2164
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;
2165
animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1);
2166
margin: -4px -4px -4px 0;
2167
background-color: #FF4081;
2168
color: #FFFFFF;
2169
}
2170
switch:disabled slider {
2172
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2173
background-color: #FAFAFA;
2174
color: rgba(0, 0, 0, 0.32);
2175
}
2176
switch:checked:disabled slider {
2178
animation: none;
2179
}
2180
/*************************
2182
* Check and Radio items *
2183
*************************/
2184
.view.content-view.check:not(list),
2185
.content-view .tile check:not(list) {
2186
min-height: 40px;
2187
min-width: 40px;
2188
margin: 0;
2189
padding: 0;
2190
box-shadow: none;
2191
background-color: transparent;
2192
background-image: none;
2193
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2194
}
2195
.view.content-view.check:not(list):hover, .view.content-view.check:not(list):active,
2197
.content-view .tile check:not(list):hover,
2198
.content-view .tile check:not(list):active {
2199
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2200
}
2201
.view.content-view.check:not(list),
2203
.content-view .tile check:not(list) {
2204
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-unchecked.png"), url("assets/selectionmode-checkbox-unchecked@2.png"));
2205
}
2206
.view.content-view.check:not(list):checked,
2208
.content-view .tile check:not(list):checked {
2209
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-checked.png"), url("assets/selectionmode-checkbox-checked@2.png"));
2210
}
2211
checkbutton.text-button,
2213
radiobutton.text-button {
2214
padding: 2px;
2215
outline-offset: 0;
2216
}
2217
checkbutton.text-button label:not(:only-child),
2219
radiobutton.text-button label:not(:only-child) {
2220
margin: 0 4px;
2221
}
2222
check,
2224
radio {
2225
min-height: 24px;
2226
min-width: 24px;
2227
margin: -10px;
2228
padding: 10px;
2229
}
2230
check:checked, check:indeterminate,
2232
radio:checked,
2233
radio:indeterminate {
2234
color: #FF4081;
2235
}
2236
check:checked:disabled, check:indeterminate:disabled,
2238
radio:checked:disabled,
2239
radio:indeterminate:disabled {
2240
color: rgba(255, 64, 129, 0.4);
2241
}
2242
row check:not(:checked):not(:indeterminate), row
2244
radio:not(:checked):not(:indeterminate) {
2245
color: alpha(currentColor, 0.75);
2246
}
2247
row check:not(:checked):not(:indeterminate):hover, row check:not(:checked):not(:indeterminate):active, row
2249
radio:not(:checked):not(:indeterminate):hover, row
2250
radio:not(:checked):not(:indeterminate):active {
2251
color: currentColor;
2252
}
2253
row check:not(:checked):not(:indeterminate):disabled, row
2255
radio:not(:checked):not(:indeterminate):disabled {
2256
color: alpha(currentColor, 0.3);
2257
}
2258
menu menuitem check, menu menuitem
2260
radio {
2261
transition: none;
2262
min-height: 16px;
2263
min-width: 16px;
2264
margin: 0;
2265
padding: 0;
2266
}
2267
menu menuitem check:dir(ltr), menu menuitem
2269
radio:dir(ltr) {
2270
margin-right: 8px;
2271
}
2272
menu menuitem check:dir(rtl), menu menuitem
2274
radio:dir(rtl) {
2275
margin-left: 8px;
2276
}
2277
menu menuitem check:not(:checked):not(:indeterminate), menu menuitem
2279
radio:not(:checked):not(:indeterminate) {
2280
color: alpha(currentColor, 0.6);
2281
}
2282
menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem
2284
radio, menu menuitem
2285
radio:hover, menu menuitem
2286
radio:disabled {
2287
box-shadow: none;
2288
}
2289
check {
2292
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.symbolic.png")));
2293
}
2294
check:checked {
2297
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.symbolic.png")));
2298
}
2299
check:indeterminate {
2302
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.symbolic.png")));
2303
}
2304
radio {
2307
border-image-slice: 22;
2308
border-image-width: 22px;
2309
}
2310
radio {
2313
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.symbolic.png")));
2314
}
2315
radio:indeterminate {
2318
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-mixed-symbolic.symbolic.png")));
2319
}
2320
radio {
2323
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent));
2324
}
2325
radio:checked:not(:indeterminate) {
2328
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.11364, to(#FF4081), to(transparent));
2329
}
2330
radio:checked:not(:indeterminate):disabled {
2333
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.11364, to(rgba(255, 64, 129, 0.4)), to(transparent));
2334
}
2335
window.background:not(.csd) > widget > checkbutton > check,
2337
menu menuitem check {
2338
border-radius: 2px;
2339
-gtk-outline-radius: 2px;
2340
-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")));
2341
}
2342
window.background:not(.csd) > widget > checkbutton > check:checked,
2344
menu menuitem check:checked {
2345
-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")));
2346
}
2347
window.background:not(.csd) > widget > checkbutton > check:indeterminate,
2349
menu menuitem check:indeterminate {
2350
-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")));
2351
}
2352
window.background:not(.csd) > widget > radiobutton > radio,
2354
menu menuitem radio {
2355
border-image: none;
2356
-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")));
2357
}
2358
window.background:not(.csd) > widget > radiobutton > radio:checked,
2360
menu menuitem radio:checked {
2361
-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")));
2362
}
2363
window.background:not(.csd) > widget > radiobutton > radio:indeterminate,
2365
menu menuitem radio:indeterminate {
2366
-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")));
2367
}
2368
check:not(:checked):active {
2370
-gtk-icon-transform: rotate(90deg);
2371
}
2372
check:not(:checked):indeterminate:active,
2374
radio:not(:checked):indeterminate:active {
2375
-gtk-icon-transform: scaleX(-1);
2376
}
2377
check:not(:checked),
2379
radio:not(:checked) {
2380
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;
2381
}
2382
check:not(:checked):active,
2384
radio:not(:checked):active {
2385
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0, -gtk-icon-transform 0;
2386
}
2387
menu menuitem check:not(:checked), menu menuitem
2389
radio:not(:checked) {
2390
transition: none;
2391
}
2392
treeview.view check,
2394
treeview.view radio {
2395
padding: 0;
2396
}
2397
treeview.view check:hover,
2399
treeview.view radio:hover {
2400
box-shadow: inset 0 0 0 9999px alpha(rgba(0, 0, 0, 0.8), 0.05);
2401
}
2402
treeview.view check:hover:disabled,
2404
treeview.view radio:hover:disabled {
2405
box-shadow: none;
2406
}
2407
treeview.view check:hover:selected,
2409
treeview.view radio:hover:selected {
2410
box-shadow: inset 0 0 0 9999px alpha(#FFFFFF, 0.05);
2411
}
2412
treeview.view check,
2414
treeview.view radio {
2415
color: rgba(0, 0, 0, 0.6);
2416
}
2417
treeview.view check:hover, treeview.view check:active,
2419
treeview.view radio:hover,
2420
treeview.view radio:active {
2421
color: rgba(0, 0, 0, 0.8);
2422
}
2423
treeview.view check:disabled,
2425
treeview.view radio:disabled {
2426
color: rgba(0, 0, 0, 0.24);
2427
}
2428
treeview.view check:checked, treeview.view check:indeterminate,
2430
treeview.view radio:checked,
2431
treeview.view radio:indeterminate {
2432
color: #FF4081;
2433
}
2434
treeview.view check:checked:disabled, treeview.view check:indeterminate:disabled,
2436
treeview.view radio:checked:disabled,
2437
treeview.view radio:indeterminate:disabled {
2438
color: rgba(255, 64, 129, 0.4);
2439
}
2440
treeview.view check:selected,
2442
treeview.view radio:selected {
2443
color: rgba(255, 255, 255, 0.75);
2444
}
2445
treeview.view check:selected:hover, treeview.view check:selected:active,
2447
treeview.view radio:selected:hover,
2448
treeview.view radio:selected:active {
2449
color: #FFFFFF;
2450
}
2451
treeview.view check:selected:disabled,
2453
treeview.view radio:selected:disabled {
2454
color: rgba(255, 255, 255, 0.3);
2455
}
2456
treeview.view check:selected:checked, treeview.view check:selected:indeterminate,
2458
treeview.view radio:selected:checked,
2459
treeview.view radio:selected:indeterminate {
2460
color: #FF4081;
2461
}
2462
treeview.view check:selected:checked:disabled, treeview.view check:selected:indeterminate:disabled,
2464
treeview.view radio:selected:checked:disabled,
2465
treeview.view radio:selected:indeterminate:disabled {
2466
color: rgba(255, 64, 129, 0.4);
2467
}
2468
treeview.view radio:checked {
2470
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-checked-symbolic.symbolic.png")));
2471
border-image: none;
2472
}
2473
/************
2475
* GtkScale *
2476
************/
2477
scale {
2478
min-height: 8px;
2479
min-width: 8px;
2480
padding: 12px;
2481
}
2482
scale * {
2484
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2485
}
2486
scale slider {
2488
min-height: 24px;
2489
min-width: 24px;
2490
margin: -10px;
2491
}
2492
scale trough {
2494
outline-offset: 2px;
2495
background-color: alpha(currentColor, 0.3);
2496
}
2497
scale trough:disabled {
2499
color: rgba(0, 0, 0, 0.32);
2500
}
2501
scale highlight {
2503
background-color: #FF4081;
2504
}
2505
scale highlight:disabled {
2507
background-color: transparent;
2508
}
2509
scale fill {
2511
background-color: alpha(currentColor, 0.3);
2512
}
2513
scale fill:disabled {
2515
background-color: transparent;
2516
}
2517
scale slider {
2519
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
2520
background-repeat: no-repeat;
2521
background-position: center;
2522
background-size: calc(100% - 8px);
2523
}
2524
scale slider {
2526
background-image: -gtk-scaled(url("assets/scale-slider.png"), url("assets/scale-slider@2.png"));
2527
}
2528
scale slider:disabled {
2530
background-image: -gtk-scaled(url("assets/scale-slider-disabled.png"), url("assets/scale-slider-disabled@2.png"));
2531
}
2532
scale slider:hover {
2534
background-size: calc(100% - 4px);
2535
}
2536
scale slider:active {
2538
background-size: calc(100% - 0px);
2539
}
2540
scale.fine-tune slider {
2542
background-size: calc(100% - 12px);
2543
}
2544
scale value {
2546
color: alpha(currentColor, 0.6);
2547
}
2548
scale marks {
2550
color: alpha(currentColor, 0.3);
2551
}
2552
scale marks.top {
2554
margin-bottom: 8px;
2555
margin-top: -16px;
2556
}
2557
scale marks.bottom {
2559
margin-top: 8px;
2560
margin-bottom: -16px;
2561
}
2562
scale marks.top {
2564
margin-right: 8px;
2565
margin-left: -16px;
2566
}
2567
scale marks.bottom {
2569
margin-left: 8px;
2570
margin-right: -16px;
2571
}
2572
scale.horizontal indicator {
2574
min-height: 8px;
2575
min-width: 1px;
2576
}
2577
scale.vertical indicator {
2579
min-height: 1px;
2580
min-width: 8px;
2581
}
2582
scale.horizontal.marks-before:not(.marks-after) slider {
2584
min-height: 30px;
2585
min-width: 24px;
2586
margin-top: -16px;
2587
background-position: center calc(100% - 4px);
2588
}
2589
scale.horizontal.marks-before:not(.marks-after) slider {
2591
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider.png"), url("assets/scale-horz-marks-before-slider@2.png"));
2592
}
2593
scale.horizontal.marks-before:not(.marks-after) slider:disabled {
2595
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider-disabled.png"), url("assets/scale-horz-marks-before-slider-disabled@2.png"));
2596
}
2597
scale.horizontal.marks-before:not(.marks-after) slider:hover {
2599
background-position: center calc(100% - 2px);
2600
}
2601
scale.horizontal.marks-before:not(.marks-after) slider:active {
2603
background-position: center calc(100% - 0px);
2604
}
2605
scale.horizontal.marks-before:not(.marks-after).fine-tune slider {
2607
background-position: center calc(100% - 6px);
2608
}
2609
scale.horizontal.marks-after:not(.marks-before) slider {
2611
min-height: 30px;
2612
min-width: 24px;
2613
margin-bottom: -16px;
2614
background-position: center calc(4px);
2615
}
2616
scale.horizontal.marks-after:not(.marks-before) slider {
2618
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider.png"), url("assets/scale-horz-marks-after-slider@2.png"));
2619
}
2620
scale.horizontal.marks-after:not(.marks-before) slider:disabled {
2622
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider-disabled.png"), url("assets/scale-horz-marks-after-slider-disabled@2.png"));
2623
}
2624
scale.horizontal.marks-after:not(.marks-before) slider:hover {
2626
background-position: center calc(2px);
2627
}
2628
scale.horizontal.marks-after:not(.marks-before) slider:active {
2630
background-position: center calc(0px);
2631
}
2632
scale.horizontal.marks-after:not(.marks-before).fine-tune slider {
2634
background-position: center calc(6px);
2635
}
2636
scale.vertical.marks-before:not(.marks-after) slider {
2638
min-height: 24px;
2639
min-width: 30px;
2640
margin-left: -16px;
2641
background-position: calc(4px) center;
2642
}
2643
scale.vertical.marks-before:not(.marks-after) slider {
2645
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider.png"), url("assets/scale-vert-marks-before-slider@2.png"));
2646
}
2647
scale.vertical.marks-before:not(.marks-after) slider:disabled {
2649
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider-disabled.png"), url("assets/scale-vert-marks-before-slider-disabled@2.png"));
2650
}
2651
scale.vertical.marks-before:not(.marks-after) slider:hover {
2653
background-position: calc(2px) center;
2654
}
2655
scale.vertical.marks-before:not(.marks-after) slider:active {
2657
background-position: calc(0px) center;
2658
}
2659
scale.vertical.marks-before:not(.marks-after).fine-tune slider {
2661
background-position: calc(6px) center;
2662
}
2663
scale.vertical.marks-after:not(.marks-before) slider {
2665
min-height: 24px;
2666
min-width: 30px;
2667
margin-right: -16px;
2668
background-position: calc(100% - 4px) center;
2669
}
2670
scale.vertical.marks-after:not(.marks-before) slider {
2672
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider.png"), url("assets/scale-vert-marks-after-slider@2.png"));
2673
}
2674
scale.vertical.marks-after:not(.marks-before) slider:disabled {
2676
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider-disabled.png"), url("assets/scale-vert-marks-after-slider-disabled@2.png"));
2677
}
2678
scale.vertical.marks-after:not(.marks-before) slider:hover {
2680
background-position: calc(100% - 2px) center;
2681
}
2682
scale.vertical.marks-after:not(.marks-before) slider:active {
2684
background-position: calc(100% - 0px) center;
2685
}
2686
scale.vertical.marks-after:not(.marks-before).fine-tune slider {
2688
background-position: calc(100% - 6px) center;
2689
}
2690
scale.color {
2692
min-height: 0;
2693
min-width: 0;
2694
}
2695
scale.color.horizontal {
2697
padding: 0 0 12px 0;
2698
}
2699
scale.color.horizontal slider:dir(ltr), scale.color.horizontal slider:dir(rtl) {
2701
margin-bottom: -12px;
2702
margin-top: -2px;
2703
}
2704
scale.color.vertical:dir(ltr) {
2706
padding: 0 0 0 12px;
2707
}
2708
scale.color.vertical:dir(ltr) slider {
2710
margin-left: -12px;
2711
margin-right: -2px;
2712
}
2713
scale.color.vertical:dir(rtl) {
2715
padding: 0 12px 0 0;
2716
}
2717
scale.color.vertical:dir(rtl) slider {
2719
margin-right: -12px;
2720
margin-left: -2px;
2721
}
2722
/*****************
2724
* Progress bars *
2725
*****************/
2726
progressbar {
2727
color: rgba(0, 0, 0, 0.48);
2728
font-size: smaller;
2729
}
2730
progressbar.horizontal trough,
2732
progressbar.horizontal progress {
2733
min-height: 4px;
2734
}
2735
progressbar.vertical trough,
2737
progressbar.vertical progress {
2738
min-width: 4px;
2739
}
2740
progressbar trough {
2742
background-color: rgba(66, 165, 245, 0.3);
2743
}
2744
progressbar progress {
2746
background-color: #42A5F5;
2747
}
2748
progressbar trough.empty progress {
2750
all: unset;
2751
}
2752
/*************
2754
* Level Bar *
2755
*************/
2756
levelbar block {
2757
min-width: 32px;
2758
min-height: 4px;
2759
}
2760
levelbar.vertical block {
2762
min-width: 4px;
2763
min-height: 32px;
2764
}
2765
levelbar trough {
2767
padding: 2px;
2768
border-radius: 2px;
2769
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
2770
border-image: none;
2771
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2772
background-color: #FFFFFF;
2773
color: rgba(0, 0, 0, 0.8);
2774
}
2775
levelbar trough:disabled {
2777
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2778
background-color: #FAFAFA;
2779
color: rgba(0, 0, 0, 0.32);
2780
}
2781
levelbar.horizontal.discrete block {
2783
margin: 0 1px;
2784
}
2785
levelbar.horizontal.discrete trough {
2787
padding: 2px 1px;
2788
}
2789
levelbar.vertical.discrete block {
2791
margin: 1px 0;
2792
}
2793
levelbar.vertical.discrete trough {
2795
padding: 1px 2px;
2796
}
2797
levelbar block.low {
2799
background-color: #FF6D00;
2800
}
2801
levelbar block.high, levelbar block:not(.empty) {
2803
background-color: #42A5F5;
2804
}
2805
levelbar block.full {
2807
background-color: #00C853;
2808
}
2809
levelbar block.empty {
2811
background-color: alpha(currentColor, 0.3);
2812
color: rgba(0, 0, 0, 0.32);
2813
}
2814
/****************
2816
* Print dialog *
2817
*****************/
2818
printdialog paper {
2819
padding: 0;
2820
border: 1px solid rgba(0, 0, 0, 0.1);
2821
background-color: #FFFFFF;
2822
color: rgba(0, 0, 0, 0.8);
2823
}
2824
printdialog .dialog-action-box {
2826
margin: 12px;
2827
}
2828
/**********
2830
* Frames *
2831
**********/
2832
frame > border,
2833
.frame {
2834
margin: 0;
2835
padding: 0;
2836
border: 1px solid rgba(0, 0, 0, 0.1);
2837
border-radius: 0;
2838
box-shadow: none;
2839
}
2840
frame > border.flat,
2842
.frame.flat,
2843
frame.flat > border {
2844
border-style: none;
2845
}
2846
actionbar > revealer > box {
2848
padding: 6px;
2849
border-top: 1px solid rgba(0, 0, 0, 0.1);
2850
}
2851
scrolledwindow viewport.frame {
2853
border-style: none;
2854
}
2855
overshoot.top {
2857
background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2858
background-repeat: no-repeat;
2859
background-position: center top;
2860
background-color: transparent;
2861
border: none;
2862
box-shadow: none;
2863
}
2864
overshoot.bottom {
2866
background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2867
background-repeat: no-repeat;
2868
background-position: center bottom;
2869
background-color: transparent;
2870
border: none;
2871
box-shadow: none;
2872
}
2873
overshoot.left {
2875
background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2876
background-repeat: no-repeat;
2877
background-position: left center;
2878
background-color: transparent;
2879
border: none;
2880
box-shadow: none;
2881
}
2882
overshoot.right {
2884
background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2885
background-repeat: no-repeat;
2886
background-position: right center;
2887
background-color: transparent;
2888
border: none;
2889
box-shadow: none;
2890
}
2891
undershoot.top {
2893
background-color: transparent;
2894
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
2895
padding-top: 1px;
2896
background-size: 12px 1px;
2897
background-repeat: repeat-x;
2898
background-origin: content-box;
2899
background-position: left top;
2900
}
2901
undershoot.bottom {
2903
background-color: transparent;
2904
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
2905
padding-bottom: 1px;
2906
background-size: 12px 1px;
2907
background-repeat: repeat-x;
2908
background-origin: content-box;
2909
background-position: left bottom;
2910
}
2911
undershoot.left {
2913
background-color: transparent;
2914
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
2915
padding-left: 1px;
2916
background-size: 1px 12px;
2917
background-repeat: repeat-y;
2918
background-origin: content-box;
2919
background-position: left top;
2920
}
2921
undershoot.right {
2923
background-color: transparent;
2924
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
2925
padding-right: 1px;
2926
background-size: 1px 12px;
2927
background-repeat: repeat-y;
2928
background-origin: content-box;
2929
background-position: right top;
2930
}
2931
junction {
2933
border-style: solid none none solid;
2934
border-width: 1px;
2935
border-color: rgba(0, 0, 0, 0.1);
2936
background-color: #FFFFFF;
2937
}
2938
junction:dir(rtl) {
2940
border-style: solid solid none none;
2941
}
2942
separator {
2944
min-width: 1px;
2945
min-height: 1px;
2946
background-color: rgba(0, 0, 0, 0.1);
2947
}
2948
/*********
2950
* Lists *
2951
*********/
2952
list {
2953
border-color: rgba(0, 0, 0, 0.1);
2954
background-color: #FFFFFF;
2955
}
2956
list row {
2958
padding: 2px;
2959
}
2960
row.activatable, .view, treeview.view header button {
2962
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);
2963
box-shadow: inset 0 0 0 9999px transparent;
2964
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
2965
background-repeat: no-repeat;
2966
background-position: center;
2967
background-size: 1000% 1000%;
2968
}
2969
row.activatable:hover, .view:hover, treeview.view header button:hover {
2971
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);
2972
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.05);
2973
}
2974
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 {
2976
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, background-size 0, background-image 0;
2977
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
2978
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
2979
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
2980
background-size: 0% 0%;
2981
}
2982
/*********************
2984
* App Notifications *
2985
*********************/
2986
.app-notification {
2987
margin: 8px;
2988
}
2989
.app-notification.frame,
2991
.app-notification border {
2992
border-style: none;
2993
}
2994
/*************
2996
* Expanders *
2997
*************/
2998
expander arrow {
2999
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
3000
min-width: 16px;
3001
min-height: 16px;
3002
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
3003
-gtk-icon-transform: rotate(-90deg);
3004
color: rgba(0, 0, 0, 0.6);
3005
}
3006
expander arrow:dir(rtl) {
3008
-gtk-icon-transform: rotate(90deg);
3009
}
3010
expander arrow:checked {
3012
-gtk-icon-transform: unset;
3013
}
3014
expander arrow:hover, expander arrow:active {
3016
color: rgba(0, 0, 0, 0.8);
3017
}
3018
expander arrow:disabled {
3020
color: rgba(0, 0, 0, 0.24);
3021
}
3022
expander arrow:selected {
3024
color: rgba(255, 255, 255, 0.75);
3025
}
3026
expander arrow:selected:hover, expander arrow:selected:active {
3028
color: #FFFFFF;
3029
}
3030
expander arrow:selected:disabled {
3032
color: rgba(255, 255, 255, 0.3);
3033
}
3034
/************
3036
* Calendar *
3037
************/
3038
calendar {
3039
padding: 1px;
3040
border: 1px solid rgba(0, 0, 0, 0.1);
3041
color: rgba(0, 0, 0, 0.8);
3042
}
3043
calendar:disabled {
3045
color: rgba(0, 0, 0, 0.32);
3046
}
3047
calendar:selected {
3049
border-radius: 3px;
3050
}
3051
calendar.header {
3053
border-style: none none solid;
3054
border-radius: 0;
3055
}
3056
calendar.highlight {
3058
color: alpha(currentColor, 0.6);
3059
font-weight: 500;
3060
}
3061
calendar:indeterminate {
3063
color: alpha(currentColor, 0.4);
3064
}
3065
/***********
3067
* Dialogs *
3068
***********/
3069
messagedialog.background {
3070
background-color: #FAFAFA;
3071
}
3072
messagedialog .titlebar {
3074
min-height: 20px;
3075
border-style: none;
3076
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
3077
background-color: #FAFAFA;
3078
color: rgba(0, 0, 0, 0.8);
3079
}
3080
messagedialog .titlebar:backdrop {
3082
color: rgba(0, 0, 0, 0.6);
3083
}
3084
messagedialog.csd.background {
3086
border-bottom-left-radius: 2px;
3087
border-bottom-right-radius: 2px;
3088
}
3089
messagedialog.csd .dialog-action-area button {
3091
padding: 8px 16px;
3092
border-top: 1px solid rgba(0, 0, 0, 0.1);
3093
border-radius: 0;
3094
}
3095
messagedialog.csd .dialog-action-area button:first-child {
3097
border-bottom-left-radius: 2px;
3098
}
3099
messagedialog.csd .dialog-action-area button:last-child {
3101
border-bottom-right-radius: 2px;
3102
}
3103
filechooser .dialog-action-box {
3105
border-top: 1px solid rgba(0, 0, 0, 0.1);
3106
}
3107
filechooser #pathbarbox {
3109
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3110
background-color: #F5F5F5;
3111
}
3112
filechooserbutton:drop(active) {
3114
box-shadow: none;
3115
}
3116
/***********
3118
* Sidebar *
3119
***********/
3120
.sidebar {
3121
border-style: none;
3122
background-color: #FAFAFA;
3123
}
3124
stacksidebar.sidebar:dir(ltr) list, stacksidebar.sidebar.left list, stacksidebar.sidebar.left:dir(rtl) list, .sidebar:dir(ltr), .sidebar.left, .sidebar.left:dir(rtl) {
3126
border-right: 1px solid rgba(0, 0, 0, 0.1);
3127
border-left-style: none;
3128
}
3129
stacksidebar.sidebar:dir(rtl) list, stacksidebar.sidebar.right list, .sidebar:dir(rtl), .sidebar.right {
3131
border-left: 1px solid rgba(0, 0, 0, 0.1);
3132
border-right-style: none;
3133
}
3134
.sidebar list {
3136
background-color: transparent;
3137
}
3138
paned .sidebar.left, paned .sidebar.right, paned .sidebar.left:dir(rtl), paned .sidebar:dir(rtl), paned .sidebar:dir(ltr), paned .sidebar {
3140
border-style: none;
3141
}
3142
stacksidebar row {
3144
padding: 10px 4px;
3145
}
3146
stacksidebar row > label {
3148
padding-left: 6px;
3149
padding-right: 6px;
3150
}
3151
/****************
3153
* File chooser *
3154
****************/
3155
placessidebar > viewport.frame {
3156
border-style: none;
3157
}
3158
placessidebar list {
3160
padding: 1px 0 4px;
3161
}
3162
placessidebar row {
3164
min-height: 32px;
3165
margin: -1px 0;
3166
padding: 0;
3167
}
3168
placessidebar row > revealer {
3170
padding: 0 12px;
3171
}
3172
placessidebar row:selected {
3174
color: #FFFFFF;
3175
}
3176
placessidebar row:disabled {
3178
color: rgba(0, 0, 0, 0.32);
3179
}
3180
placessidebar row image.sidebar-icon {
3182
opacity: 0.6;
3183
}
3184
placessidebar row image.sidebar-icon:dir(ltr) {
3186
padding-right: 8px;
3187
}
3188
placessidebar row image.sidebar-icon:dir(rtl) {
3190
padding-left: 8px;
3191
}
3192
placessidebar row label.sidebar-label:dir(ltr) {
3194
padding-right: 2px;
3195
}
3196
placessidebar row label.sidebar-label:dir(rtl) {
3198
padding-left: 2px;
3199
}
3200
placessidebar row.sidebar-placeholder-row {
3202
min-height: 2px;
3203
padding: 0 8px;
3204
background-image: image(#FF4081);
3205
background-clip: content-box;
3206
}
3207
placessidebar row.sidebar-new-bookmark-row {
3209
color: #FF4081;
3210
}
3211
placessidebar row:drop(active):not(:disabled) {
3213
box-shadow: inset 0 0 0 2px #FF4081;
3214
}
3215
placesview .server-list-button > image {
3217
-gtk-icon-transform: rotate(0turn);
3218
}
3219
placesview .server-list-button:checked > image {
3221
-gtk-icon-transform: rotate(-0.5turn);
3222
}
3223
placesview > actionbar > revealer > box > label {
3225
padding-left: 8px;
3226
padding-right: 8px;
3227
}
3228
/*********
3230
* Paned *
3231
*********/
3232
paned > separator {
3233
min-width: 1px;
3234
min-height: 1px;
3235
-gtk-icon-source: none;
3236
border-style: none;
3237
background-color: transparent;
3238
background-image: image(rgba(0, 0, 0, 0.1));
3239
background-size: 1px 1px;
3240
background-clip: content-box;
3241
}
3242
paned > separator.wide {
3244
min-width: 6px;
3245
min-height: 6px;
3246
background-color: #F5F5F5;
3247
background-image: image(rgba(0, 0, 0, 0.1)), image(rgba(0, 0, 0, 0.1));
3248
background-size: 1px 1px, 1px 1px;
3249
}
3250
paned.horizontal > separator {
3252
background-repeat: repeat-y;
3253
}
3254
paned.horizontal > separator:dir(ltr) {
3256
margin: 0 -8px 0 0;
3257
padding: 0 8px 0 0;
3258
background-position: left;
3259
}
3260
paned.horizontal > separator:dir(rtl) {
3262
margin: 0 0 0 -8px;
3263
padding: 0 0 0 8px;
3264
background-position: right;
3265
}
3266
paned.horizontal > separator.wide {
3268
margin: 0;
3269
padding: 0;
3270
background-repeat: repeat-y, repeat-y;
3271
background-position: left, right;
3272
}
3273
paned.vertical > separator {
3275
margin: 0 0 -8px 0;
3276
padding: 0 0 8px 0;
3277
background-repeat: repeat-x;
3278
background-position: top;
3279
}
3280
paned.vertical > separator.wide {
3282
margin: 0;
3283
padding: 0;
3284
background-repeat: repeat-x, repeat-x;
3285
background-position: bottom, top;
3286
}
3287
/**************
3289
* GtkInfoBar *
3290
**************/
3291
infobar {
3292
border-style: none;
3293
}
3294
infobar.info {
3296
background-color: #66BB6A;
3297
}
3298
infobar.question {
3300
background-color: #42A5F5;
3301
}
3302
infobar.warning {
3304
background-color: #FFA726;
3305
}
3306
infobar.error {
3308
background-color: #EF5350;
3309
}
3310
infobar.info > label, infobar.info, infobar.question > label, infobar.question, infobar.warning > label, infobar.warning, infobar.error > label, infobar.error {
3312
color: #FFFFFF;
3313
}
3314
/************
3316
* Tooltips *
3317
************/
3318
tooltip {
3319
border-radius: 2px;
3320
box-shadow: none;
3321
}
3322
tooltip.background {
3324
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
3325
background-color: rgba(255, 255, 255, 0.9);
3326
}
3327
tooltip:not(.csd):not(.unity-csd) {
3329
border: 1px solid rgba(0, 0, 0, 0.1);
3330
border-radius: 3px;
3331
background-clip: padding-box;
3332
}
3333
tooltip decoration {
3335
background-color: transparent;
3336
}
3337
tooltip label {
3339
min-height: 20px;
3340
padding: 0 2px;
3341
}
3342
/*****************
3344
* Color Chooser *
3345
*****************/
3346
colorswatch.top {
3347
border-top-left-radius: 2.5px;
3348
border-top-right-radius: 2.5px;
3349
}
3350
colorswatch.top overlay {
3352
border-top-left-radius: 2px;
3353
border-top-right-radius: 2px;
3354
}
3355
colorswatch.bottom {
3357
border-bottom-left-radius: 2.5px;
3358
border-bottom-right-radius: 2.5px;
3359
}
3360
colorswatch.bottom overlay {
3362
border-bottom-left-radius: 2px;
3363
border-bottom-right-radius: 2px;
3364
}
3365
colorswatch.left, colorswatch:first-child:not(.top) {
3367
border-top-left-radius: 2.5px;
3368
border-bottom-left-radius: 2.5px;
3369
}
3370
colorswatch.left overlay, colorswatch:first-child:not(.top) overlay {
3372
border-top-left-radius: 2px;
3373
border-bottom-left-radius: 2px;
3374
}
3375
colorswatch.right, colorswatch:last-child:not(.bottom) {
3377
border-top-right-radius: 2.5px;
3378
border-bottom-right-radius: 2.5px;
3379
}
3380
colorswatch.right overlay, colorswatch:last-child:not(.bottom) overlay {
3382
border-top-right-radius: 2px;
3383
border-bottom-right-radius: 2px;
3384
}
3385
colorswatch.dark overlay {
3387
color: #FFFFFF;
3388
}
3389
colorswatch.light overlay {
3391
color: rgba(0, 0, 0, 0.8);
3392
}
3393
colorswatch.dark {
3395
color: #FFFFFF;
3396
}
3397
colorswatch.light {
3399
color: rgba(0, 0, 0, 0.8);
3400
}
3401
colorswatch:drop(active) {
3403
box-shadow: none;
3404
}
3405
colorswatch:drop(active).light overlay {
3407
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;
3408
}
3409
colorswatch:drop(active).dark overlay {
3411
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;
3412
}
3413
colorswatch overlay {
3415
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3416
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3417
}
3418
colorswatch overlay:hover {
3420
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3421
}
3422
colorswatch#add-color-button {
3424
border-radius: 2px 2px 0 0;
3425
color: #FFFFFF;
3426
}
3427
colorswatch#add-color-button:only-child {
3429
border-radius: 2px;
3430
}
3431
colorswatch#add-color-button overlay {
3433
background-image: linear-gradient(to right, #EF5350 25%, #FFA726 25%, #FFA726 50%, #66BB6A 50%, #66BB6A 75%, #42A5F5 75%);
3434
color: #FFFFFF;
3435
}
3436
colorswatch:disabled {
3438
opacity: 0.4;
3439
}
3440
colorswatch:disabled overlay {
3442
box-shadow: none;
3443
}
3444
colorswatch#editor-color-sample {
3446
border-radius: 2.5px;
3447
}
3448
colorswatch#editor-color-sample overlay {
3450
border-radius: 2px;
3451
}
3452
colorchooser .popover.osd {
3454
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3455
border-radius: 2px;
3456
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);
3457
background-color: #FFFFFF;
3458
}
3459
colorchooser .popover.osd:backdrop {
3461
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);
3462
}
3463
/********
3465
* Misc *
3466
********/
3467
.content-view {
3468
background-color: #F5F5F5;
3469
}
3470
/**********************
3472
* Window Decorations *
3473
**********************/
3474
decoration {
3475
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3476
border-radius: 2px 2px 0 0;
3477
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent;
3478
margin: 8px;
3479
}
3480
decoration:backdrop {
3482
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent;
3483
}
3484
.maximized decoration,
3486
.fullscreen decoration,
3487
.tiled decoration {
3488
border-radius: 0;
3489
}
3490
.popup decoration {
3492
box-shadow: none;
3493
}
3494
.ssd decoration {
3496
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16);
3497
}
3498
.csd.popup decoration {
3500
border-radius: 2px;
3501
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3502
}
3503
tooltip.csd decoration {
3505
border-radius: 2px;
3506
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3507
}
3508
messagedialog.csd decoration {
3510
border-radius: 2px;
3511
}
3512
.solid-csd decoration {
3514
margin: 0;
3515
border-radius: 0;
3516
box-shadow: none;
3517
background-color: #455A64;
3518
}
3519
.view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3521
entry selection, modelbutton.flat:selected,
3522
.menuitem.button.flat:selected, popover.background.menu button:checked,
3523
popover.background button.model:checked, row:selected, calendar:selected, text:selected {
3524
background-color: #42A5F5;
3525
}
3526
row:selected label, label:selected, .view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3528
entry selection, modelbutton.flat:selected,
3529
.menuitem.button.flat:selected, popover.background.menu button:checked,
3530
popover.background button.model:checked, row:selected, calendar:selected, text:selected {
3531
color: #FFFFFF;
3532
}
3533
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,
3535
entry selection:disabled, modelbutton.flat:disabled:selected,
3536
.menuitem.button.flat:disabled:selected, popover.background.menu button:disabled:checked,
3537
popover.background button.model:disabled:checked, row:disabled:selected, calendar:disabled:selected, text:disabled:selected {
3538
color: rgba(255, 255, 255, 0.4);
3539
}
3540
.monospace {
3542
font-family: monospace;
3543
}
3544
/**********************
3546
* Touch Copy & Paste *
3547
**********************/
3548
cursor-handle {
3549
border-radius: 9999px;
3550
background-color: #FF4081;
3551
background-image: none;
3552
}
3553
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) {
3555
padding-left: 6px;
3556
border-top-right-radius: 0;
3557
}
3558
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) {
3560
padding-right: 6px;
3561
border-top-left-radius: 0;
3562
}
3563
cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) {
3565
-GtkWidget-text-handle-width: 24;
3566
-GtkWidget-text-handle-height: 30;
3567
-gtk-icon-source: -gtk-scaled(url("assets/scale-horz-marks-before-slider.png"), url("assets/scale-horz-marks-before-slider@2.png"));
3568
}
3569
.context-menu {
3571
font: initial;
3572
}
3573
.keycap {
3575
min-width: 12px;
3576
min-height: 26px;
3577
margin-top: 2px;
3578
padding-bottom: 2px;
3579
padding-left: 8px;
3580
padding-right: 8px;
3581
border: solid 1px rgba(0, 0, 0, 0.1);
3582
border-radius: 3px;
3583
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.1);
3584
background-color: #FFFFFF;
3585
color: rgba(0, 0, 0, 0.8);
3586
font-size: smaller;
3587
}
3588
:not(decoration):not(window):drop(active) {
3590
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
3591
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;
3592
caret-color: #FF4081;
3593
}
3594
stackswitcher button.text-button {
3596
min-width: 100px;
3597
}
3598
stackswitcher button.circular,
3600
stackswitcher button.text-button.circular {
3601
min-width: 32px;
3602
min-height: 32px;
3603
padding: 0;
3604
}
3605
/************
3607
* Nautilus *
3608
************/
3609
.nautilus-window,
3610
.nautilus-window notebook,
3611
.nautilus-window notebook > stack {
3612
background-color: #FFFFFF;
3613
}
3614
.nautilus-desktop.nautilus-canvas-item:not(:selected), .caja-desktop.caja-canvas-item:not(:selected) {
3616
color: #FFFFFF;
3617
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3618
}
3619
@keyframes needs_attention_keyframes {
3621
to {
3622
background-color: alpha(currentColor, 0.3);
3623
}
3624
}
3625
.nautilus-operations-button-needs-attention {
3627
animation: needs_attention_keyframes 0.3s cubic-bezier(0.4, 0, 0.2, 1) 2 alternate;
3628
}
3629
.nautilus-operations-button-needs-attention-multiple {
3631
animation: needs_attention_keyframes 0.3s cubic-bezier(0.4, 0, 0.2, 1) 4 alternate;
3632
}
3633
.nautilus-window .floating-bar {
3635
min-height: 32px;
3636
padding: 0;
3637
border-style: solid solid none;
3638
border-width: 1px;
3639
border-color: rgba(0, 0, 0, 0.1);
3640
border-radius: 3px 3px 0 0;
3641
background-color: #FFFFFF;
3642
background-clip: padding-box;
3643
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), border-width 0;
3644
}
3645
.nautilus-window .floating-bar.bottom.left {
3647
margin-right: 7px;
3648
border-left-style: none;
3649
border-top-left-radius: 0;
3650
}
3651
.nautilus-window .floating-bar.bottom.right {
3653
margin-left: 7px;
3654
border-right-style: none;
3655
border-top-right-radius: 0;
3656
}
3657
.nautilus-window .floating-bar button {
3659
margin: 6px;
3660
}
3661
.disk-space-display.unknown {
3663
background-color: #FF6D00;
3664
}
3665
.disk-space-display.used {
3667
background-color: #42A5F5;
3668
}
3669
.disk-space-display.free {
3671
background-color: alpha(currentColor, 0.3);
3672
color: rgba(0, 0, 0, 0.32);
3673
}
3674
.documents-entry-tag, .photos-entry-tag {
3676
margin: 3px -2px 3px 8px;
3677
padding: 0 8px;
3678
border-radius: 9999px;
3679
box-shadow: none;
3680
background-color: #42A5F5;
3681
color: #FFFFFF;
3682
}
3683
.documents-entry-tag:hover, .photos-entry-tag:hover {
3685
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3686
}
3687
.documents-entry-tag.button, .button.photos-entry-tag {
3689
margin: 0 -2px;
3690
padding: 4px;
3691
border-radius: 9999px;
3692
box-shadow: none;
3693
color: rgba(255, 255, 255, 0.75);
3694
}
3695
.documents-entry-tag.button:hover, .button.photos-entry-tag:hover, .documents-entry-tag.button:active, .button.photos-entry-tag:active {
3697
color: #FFFFFF;
3698
}
3699
.nautilus-window searchbar {
3701
border-top: 1px solid rgba(0, 0, 0, 0.1);
3702
}
3703
.nautilus-window .searchbar-container {
3705
margin-top: -1px;
3706
}
3707
.conflict-row:not(:selected) {
3709
background-color: #ffd3b3;
3710
}
3711
.nautilus-window flowboxchild > widget > .icon-item-background {
3713
padding: 4px;
3714
border-radius: 2px;
3715
}
3716
.nautilus-window flowboxchild:selected {
3718
background-color: transparent;
3719
}
3720
.nautilus-window flowboxchild:selected > widget > .icon-item-background {
3722
background-color: #42A5F5;
3723
}
3724
dialog.background > box.dialog-vbox.vertical > grid.horizontal > scrolledwindow.frame {
3726
border-style: none;
3727
}
3728
dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal:last-child {
3730
margin: -6px 0 0 -6px;
3731
border-top: 1px solid rgba(0, 0, 0, 0.1);
3732
}
3733
dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal:last-child > label {
3735
margin: 0 8px;
3736
}
3737
dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal:last-child > box > button {
3739
border-radius: 0;
3740
}
3741
.nautilus-window > popover.menu:not(:last-child) {
3743
padding: 3px;
3744
}
3745
.nautilus-window > popover.menu:not(:last-child) > stack > box > box > box {
3747
margin-top: -6px;
3748
}
3749
.nautilus-window > popover.menu:not(:last-child) > stack > box > box > box > box {
3751
margin-bottom: -6px;
3752
}
3753
.nautilus-window > popover.menu:not(:last-child) > stack > box > box > box > box.linked {
3755
margin-top: 1px;
3756
}
3757
.nautilus-window > popover.menu:not(:last-child) separator {
3759
margin-bottom: -2px;
3760
}
3761
.nautilus-menu-sort-heading {
3763
margin: 1px 3px;
3764
font-weight: 500;
3765
}
3766
.nautilus-menu-sort-heading:disabled {
3768
color: rgba(0, 0, 0, 0.48);
3769
}
3770
.nautilus-window paned > separator {
3772
background-color: #F5F5F5;
3773
}
3774
/*********
3776
* gedit *
3777
*********/
3778
.open-document-selector-name-label {
3779
font-weight: bold;
3780
}
3781
.open-document-selector-path-label {
3783
color: alpha(currentColor, 0.6);
3784
font-size: smaller;
3785
}
3786
.gedit-document-panel {
3788
background-color: #FAFAFA;
3789
}
3790
.gedit-document-panel row button.flat {
3792
margin-top: 8px;
3793
margin-bottom: 8px;
3794
}
3795
.gedit-document-panel-group-row:not(:first-child) {
3797
border-top: 1px solid rgba(0, 0, 0, 0.1);
3798
}
3799
.gedit-side-panel-paned statusbar {
3801
border-top: 1px solid rgba(0, 0, 0, 0.1);
3802
}
3803
.gedit-search-slider {
3805
margin: 4px 4px 8px;
3806
}
3807
.gedit-search-slider entry:dir(ltr), .gedit-search-slider entry:dir(rtl) {
3809
border-radius: 2px;
3810
}
3811
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag, .gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
3813
all: unset;
3814
color: alpha(currentColor, 0.6);
3815
}
3816
.gedit-search-slider entry:dir(ltr) {
3818
margin-right: -58px;
3819
padding-right: 58px;
3820
}
3821
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag {
3823
margin-left: 6px;
3824
}
3825
.gedit-search-slider entry:dir(ltr) image.right {
3827
margin-right: 0;
3828
}
3829
.gedit-search-slider entry:dir(rtl) {
3831
margin-left: -58px;
3832
padding-left: 58px;
3833
}
3834
.gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
3836
margin-right: 6px;
3837
}
3838
.gedit-search-slider entry:dir(rtl) image.left {
3840
margin-left: 0;
3841
}
3842
.gedit-search-slider entry.error ~ button {
3844
color: rgba(255, 255, 255, 0.75);
3845
}
3846
.gedit-search-slider entry.error ~ button:hover, .gedit-search-slider entry.error ~ button:active {
3848
color: #FFFFFF;
3849
}
3850
.gedit-search-slider entry.error ~ button:disabled {
3852
color: rgba(255, 255, 255, 0.3);
3853
}
3854
.gedit-search-slider button {
3856
border: solid 6px transparent;
3857
}
3858
.gedit-search-slider button:last-child:dir(ltr), .gedit-search-slider button:not(:first-child):dir(rtl) {
3860
margin-left: -3px;
3861
}
3862
.gedit-search-slider button:first-child:dir(rtl), .gedit-search-slider button:not(:last-child):dir(ltr) {
3864
margin-right: -3px;
3865
}
3866
frame.gedit-map-frame > border:dir(ltr) {
3868
border-style: none none none solid;
3869
}
3870
frame.gedit-map-frame > border:dir(rtl) {
3872
border-style: none solid none none;
3873
}
3874
/**************
3876
* Tweak Tool *
3877
**************/
3878
.tweak-categories {
3879
background-image: image(#FAFAFA);
3880
}
3881
.tweak-categories separator {
3883
min-width: 0;
3884
min-height: 0;
3885
background-color: transparent;
3886
}
3887
.tweak {
3889
padding: 3px;
3890
}
3891
.tweak.title:hover {
3893
box-shadow: none;
3894
}
3895
.tweak-group-white,
3897
.tweak-white,
3898
.tweak-white:hover {
3899
background-image: image(#FFFFFF);
3900
}
3901
.tweak-startup,
3903
.tweak-startup:hover {
3904
background-image: image(#FFFFFF);
3905
}
3906
.tweak-group-startup {
3908
background-image: image(#FFFFFF);
3909
border: 1px solid rgba(0, 0, 0, 0.1);
3910
}
3911
/***********
3913
* Builder *
3914
***********/
3915
layouttabbar {
3916
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3917
background-color: #F5F5F5;
3918
}
3919
layouttabbar > box > button {
3921
margin: 4px 0;
3922
}
3923
layouttab {
3925
margin: 0 8px;
3926
border-style: none solid;
3927
border-width: 1px;
3928
border-color: rgba(0, 0, 0, 0.1);
3929
box-shadow: inset 0 -2px #42A5F5;
3930
background-color: #FFFFFF;
3931
}
3932
layouttab separator.vertical {
3934
margin: 8px 4px;
3935
}
3936
layouttab button.text-button, layouttab button.image-button, layouttab button {
3938
margin-top: 8px;
3939
margin-bottom: 8px;
3940
padding: 0 4px;
3941
}
3942
layout {
3944
border: 1px solid rgba(0, 0, 0, 0.1);
3945
-PnlDockBin-handle-size: 1;
3946
}
3947
entry.search-missing {
3949
background-color: #DD2C00;
3950
color: #FFFFFF;
3951
}
3952
window.workbench treeview.image {
3954
color: alpha(currentColor, 0.6);
3955
}
3956
window.workbench treeview.image:selected {
3958
color: rgba(255, 255, 255, 0.6);
3959
}
3960
popover.popover-selector list {
3962
padding: 6px;
3963
}
3964
popover.popover-selector list row {
3966
border-radius: 2px;
3967
}
3968
popover.popover-selector list row image:dir(ltr) {
3970
margin-right: 6px;
3971
}
3972
popover.popover-selector list row image:dir(rtl) {
3974
margin-left: 6px;
3975
}
3976
popover.popover-selector list row .accel:dir(ltr) {
3978
margin-left: 6px;
3979
}
3980
popover.popover-selector list row .accel:dir(rtl) {
3982
margin-right: 6px;
3983
}
3984
omnibar.linked:not(.vertical) entry {
3986
border-radius: 2px;
3987
}
3988
omnibar:not(:hover):not(:active) entry {
3990
color: rgba(0, 0, 0, 0.6);
3991
}
3992
popover.omnibar list row:not(:last-child) {
3994
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3995
}
3996
entry.preferences-search {
3998
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.1);
3999
background-color: #FFFFFF;
4000
}
4001
preferences stacksidebar.sidebar list {
4003
background-color: #FAFAFA;
4004
}
4005
preferences stacksidebar.sidebar:dir(ltr) list, preferences stacksidebar.sidebar:dir(rtl) list {
4007
border-style: none;
4008
}
4009
preferences stacksidebar.sidebar list separator {
4011
min-width: 0;
4012
min-height: 0;
4013
background-color: transparent;
4014
}
4015
preferences > box > box:dir(ltr) {
4017
border-right: 1px solid rgba(0, 0, 0, 0.1);
4018
}
4019
preferences > box > box:dir(rtl) {
4021
border-left: 1px solid rgba(0, 0, 0, 0.1);
4022
}
4023
popover.messagepopover.background {
4025
padding: 0;
4026
}
4027
popover.messagepopover .popover-action-area button {
4029
padding: 8px 16px;
4030
border-top: 1px solid rgba(0, 0, 0, 0.1);
4031
border-radius: 0;
4032
}
4033
popover.messagepopover .popover-action-area button:first-child {
4035
border-bottom-left-radius: 2px;
4036
}
4037
popover.messagepopover .popover-action-area button:last-child {
4039
border-bottom-right-radius: 2px;
4040
}
4041
popover.messagepopover .popover-content-area {
4043
margin: 16px;
4044
}
4045
popover.transfers list {
4047
background-color: transparent;
4048
}
4049
popover.transfers list row:not(:first-child) {
4051
border-top: 1px solid rgba(0, 0, 0, 0.1);
4052
}
4053
popover.transfers list row > box {
4055
padding: 10px;
4056
}
4057
dockbin {
4059
border: 1px solid rgba(0, 0, 0, 0.1);
4060
-PnlDockBin-handle-size: 1;
4061
}
4062
dockpaned {
4064
border: 1px solid rgba(0, 0, 0, 0.1);
4065
}
4066
eggsearchbar box.search-bar {
4068
padding: 0 8px;
4069
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4070
background-color: #F5F5F5;
4071
}
4072
docktabstrip {
4074
padding: 0 8px;
4075
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4076
background-color: #F5F5F5;
4077
}
4078
docktab {
4080
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
4081
min-height: 20px;
4082
min-width: 20px;
4083
margin-bottom: -1px;
4084
padding: 6px 6px;
4085
outline-offset: -6px;
4086
border-width: 1px;
4087
border-color: transparent;
4088
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 10%, transparent 0%);
4089
background-repeat: no-repeat;
4090
background-position: center;
4091
background-size: 0% 0%;
4092
color: rgba(0, 0, 0, 0.6);
4093
font-weight: 500;
4094
}
4095
docktab:hover {
4097
box-shadow: inset 0 -2px alpha(currentColor, 0.3);
4098
color: rgba(0, 0, 0, 0.8);
4099
}
4100
docktab:checked {
4102
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);
4103
box-shadow: inset 0 -2px #42A5F5;
4104
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
4105
background-size: 1000% 1000%;
4106
color: rgba(0, 0, 0, 0.8);
4107
}
4108
dockoverlayedge {
4110
background-color: #F5F5F5;
4111
}
4112
dockoverlayedge docktabstrip {
4114
padding: 0;
4115
border: none;
4116
}
4117
dockoverlayedge.left-edge docktab:hover {
4119
box-shadow: inset -2px 0 alpha(currentColor, 0.3);
4120
}
4121
dockoverlayedge.left-edge docktab:checked {
4123
box-shadow: inset -2px 0 #42A5F5;
4124
}
4125
dockoverlayedge.right-edge docktab:hover {
4127
box-shadow: inset 2px 0 alpha(currentColor, 0.3);
4128
}
4129
dockoverlayedge.right-edge docktab:checked {
4131
box-shadow: inset 2px 0 #42A5F5;
4132
}
4133
pillbox {
4135
background-color: #F5F5F5;
4136
border-radius: 2px;
4137
}
4138
layoutpane entry.search {
4140
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.1);
4141
background-color: #FFFFFF;
4142
}
4143
editortweak entry.search {
4145
margin-bottom: -1px;
4146
box-shadow: none;
4147
}
4148
.gb-search-entry-occurrences-tag {
4150
box-shadow: none;
4151
background-color: transparent;
4152
}
4153
docktabstrip {
4155
min-height: 39px;
4156
}
4157
window.workbench preferences preferencesgroup list entry {
4159
padding-top: 8px;
4160
padding-bottom: 8px;
4161
}
4162
button.run-arrow-button {
4164
padding-left: 8px;
4165
padding-right: 8px;
4166
}
4167
/**********
4169
* Photos *
4170
**********/
4171
GdMainIconView.content-view {
4172
-GdMainIconView-icon-size: 48;
4173
}
4174
.documents-counter {
4176
margin: 8px;
4177
border-radius: 9999px;
4178
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
4179
background-color: #FF4081;
4180
color: #FFFFFF;
4181
font-weight: bold;
4182
}
4183
.documents-scrolledwin.frame {
4185
border-style: none;
4186
}
4187
.documents-scrolledwin.frame frame.content-view > border {
4189
border-style: none;
4190
}
4191
.photos-fade-in {
4193
opacity: 1;
4194
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
4195
}
4196
.photos-fade-out {
4198
opacity: 0;
4199
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
4200
}
4201
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) {
4203
border-style: none none none solid;
4204
}
4205
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(rtl) {
4207
border-style: none solid none none;
4208
}
4209
/*********
4211
* Music *
4212
*********/
4213
.side-panel:dir(ltr) {
4214
border-style: solid;
4215
border-color: rgba(0, 0, 0, 0.1);
4216
}
4217
.side-panel:dir(rtl) {
4219
border-style: solid;
4220
border-color: rgba(0, 0, 0, 0.1);
4221
}
4222
.side-panel .view {
4224
background-image: image(#FAFAFA);
4225
}
4226
.side-panel .view:hover {
4228
background-image: image(rgba(242, 242, 242, 0.99));
4229
}
4230
.side-panel .view:selected {
4232
background-image: image(#42A5F5);
4233
}
4234
.side-panel .view:selected:hover {
4236
background-image: image(#4baaf6);
4237
}
4238
.songs-list:hover {
4240
background-image: image(alpha(currentColor, 0.05));
4241
}
4242
frame.documents-dropdown {
4244
margin: 8px;
4245
}
4246
frame.documents-dropdown > border {
4248
border: none;
4249
}
4250
box.vertical > revealer > toolbar.search-bar {
4252
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4253
background-clip: border-box;
4254
}
4255
box.vertical > revealer > toolbar.search-bar button > widget {
4257
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4258
}
4259
/*********
4261
* To Do *
4262
*********/
4263
taskrow {
4264
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
4265
margin: 0 -8px;
4266
}
4267
taskrow:hover {
4269
transition: none;
4270
}
4271
taskrow label {
4273
margin: 0 8px;
4274
}
4275
taskrow image {
4277
min-width: 16px;
4278
}
4279
task-list-view > box > revealer > box > button {
4281
margin: -4px;
4282
}
4283
/*******
4285
* eog *
4286
*******/
4287
#eog-thumb-nav scrolledwindow {
4288
border-top: none;
4289
}
4290
#eog-thumb-nav button {
4292
-gtk-outline-radius: 2px;
4293
}
4294
/*************
4296
* Evolution *
4297
*************/
4298
frame.taskbar > border {
4299
border-style: solid none none;
4300
}
4301
box.vertical > paned.horizontal notebook widget .frame {
4303
border-style: none;
4304
}
4305
/********
4307
* gitg *
4308
********/
4309
frame.commit-frame > border {
4310
border-style: solid none none;
4311
}
4312
/**************
4314
* Characters *
4315
**************/
4316
box.dialog-vbox scrolledwindow.related {
4317
border: 1px solid rgba(0, 0, 0, 0.1);
4318
}
4319
list.categories {
4321
background-image: image(#FAFAFA);
4322
}
4323
/**************
4325
* Calculator *
4326
**************/
4327
button.title label {
4328
min-height: 32px;
4329
}
4330
/*********
4332
* Tilix *
4333
*********/
4334
overlay > revealer.left > scrolledwindow.frame,
4335
overlay > revealer.right > scrolledwindow.frame {
4336
border-style: none;
4337
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22);
4338
}
4339
overlay > revealer.left > scrolledwindow.frame {
4341
margin-right: 32px;
4342
}
4343
overlay > revealer.right > scrolledwindow.frame {
4345
margin-left: 32px;
4346
}
4347
.terminix-session-sidebar,
4349
.tilix-session-sidebar {
4350
background-image: image(#FAFAFA);
4351
}
4352
button.image-button.session-new-button {
4354
min-width: 28px;
4355
}
4356
/***********
4358
* Eclipse *
4359
***********/
4360
window.background > box.vertical > scrolledwindow > widget toolbar {
4361
padding: 2px;
4362
}
4363
window.background > box.vertical > scrolledwindow > widget toolbar separator,
4365
window.background > box.vertical > scrolledwindow > widget toolbar button {
4366
margin: 2px;
4367
}
4368
window.background > box.vertical > scrolledwindow > widget toolbar button {
4370
border-radius: 2px;
4371
}
4372
/***********
4374
* Firefox *
4375
***********/
4376
window.background:not(.csd) > widget > separator {
4377
color: rgba(0, 0, 0, 0.2);
4378
}
4379
window.background:not(.csd) > widget > scrollbar {
4381
background-clip: border-box;
4382
}
4383
window.background:not(.csd) > widget > scrollbar,
4385
window.background:not(.csd) > widget > frame > border {
4386
border-color: rgba(0, 0, 0, 0.2);
4387
}
4388
window.background:not(.csd) > widget > entry,
4390
window.background:not(.csd) > widget > button > button {
4391
border: 1px solid rgba(0, 0, 0, 0.2);
4392
border-radius: 3px;
4393
box-shadow: none;
4394
}
4395
window.background:not(.csd) > widget > entry {
4397
min-height: 30px;
4398
}
4399
window.background:not(.csd) > widget > entry:focus {
4401
border-color: #42A5F5;
4402
}
4403
window.background:not(.csd) > widget > button > button {
4405
padding: 4px 8px;
4406
background-size: auto;
4407
}
4408
window.background:not(.csd) > widget > button > button:hover {
4410
background-image: image(alpha(currentColor, 0.05));
4411
}
4412
window.background:not(.csd) > widget > button > button:active {
4414
background-image: image(alpha(currentColor, 0.1));
4415
}
4416
window.background:not(.csd) > window > menu,
4418
window.background:not(.csd) > menu > menu {
4419
border: none;
4420
}
4421
window.background:not(.csd) > widget > menubar {
4423
color: rgba(255, 255, 255, 0.75);
4424
}
4425
window.background:not(.csd) > widget > menubar:hover {
4427
color: #FFFFFF;
4428
}
4429
window.background:not(.csd) > widget > menubar:disabled {
4431
color: rgba(255, 255, 255, 0.3);
4432
}
4433
window.background:not(.csd) > widget > frame {
4435
color: rgba(0, 0, 0, 0.2);
4436
}
4437
window.background:not(.csd) > widget > checkbutton > check,
4439
window.background:not(.csd) > widget > radiobutton > radio {
4440
margin: 0;
4441
padding: 0;
4442
}
4443
window.background:not(.csd) > window.background > menu > separator {
4445
color: rgba(0, 0, 0, 0.1);
4446
}
4447
/***********
4449
* Synapse *
4450
***********/
4451
box.vertical > widget > widget:selected {
4452
background-color: #42A5F5;
4453
}
4454
/*********
4456
* Unity *
4457
*********/
4458
UnityDecoration {
4459
-UnityDecoration-extents: 28px 0 0 0;
4460
-UnityDecoration-input-extents: 8px;
4461
-UnityDecoration-shadow-offset-x: 0;
4462
-UnityDecoration-shadow-offset-y: 3px;
4463
-UnityDecoration-active-shadow-color: rgba(0, 0, 0, 0.48);
4464
-UnityDecoration-active-shadow-radius: 18px;
4465
-UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32);
4466
-UnityDecoration-inactive-shadow-radius: 6px;
4467
-UnityDecoration-glow-size: 8px;
4468
-UnityDecoration-glow-color: #42A5F5;
4469
-UnityDecoration-title-indent: 4px;
4470
-UnityDecoration-title-fade: 32px;
4471
-UnityDecoration-title-alignment: 0.0;
4472
}
4473
UnityDecoration .top {
4475
padding: 0 2px;
4476
border-style: none;
4477
border-radius: 2px 2px 0 0;
4478
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
4479
background-color: #37474F;
4480
color: #FFFFFF;
4481
}
4482
UnityDecoration .top:backdrop {
4484
color: rgba(255, 255, 255, 0.75);
4485
}
4486
UnityDecoration .menuitem {
4488
color: alpha(currentColor, 0.75);
4489
}
4490
UnityDecoration .menuitem:hover {
4492
box-shadow: inset 0 -2px currentColor;
4493
background-color: transparent;
4494
color: currentColor;
4495
}
4496
.background:not(.csd) headerbar:not(.titlebar) {
4498
border-radius: 0;
4499
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
4500
}
4501
.background:not(.csd) headerbar:not(.titlebar).inline-toolbar {
4503
border-style: none;
4504
}
4505
UnityPanelWidget,
4507
.unity-panel {
4508
background-color: #263238;
4509
color: #FFFFFF;
4510
}
4511
UnityPanelWidget:backdrop,
4513
.unity-panel:backdrop {
4514
color: rgba(255, 255, 255, 0.75);
4515
}
4516
.unity-panel.menuitem,
4518
.unity-panel .menuitem {
4519
color: alpha(currentColor, 0.75);
4520
}
4521
.unity-panel.menubar.menuitem:hover,
4523
.unity-panel.menubar .menuitem *:hover {
4524
box-shadow: inset 0 -2px currentColor;
4525
background-color: transparent;
4526
color: currentColor;
4527
}
4528
.menu IdoPlaybackMenuItem.menuitem:active {
4530
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
4531
animation: spin 1s linear infinite;
4532
color: #42A5F5;
4533
}
4534
/**************
4536
* Mate-Panel *
4537
**************/
4538
.mate-panel-menu-bar menubar,
4539
#PanelApplet-window-menu-applet-button {
4540
background-color: transparent;
4541
}
4542
#PanelPlug,
4544
PanelToplevel.background {
4545
background-color: #263238;
4546
color: #FFFFFF;
4547
font-weight: 500;
4548
}
4549
PanelToplevel > widget > button {
4551
padding: 0 4px;
4552
border-radius: 0;
4553
}
4554
PanelSeparator {
4556
color: rgba(0, 0, 0, 0.1);
4557
}
4558
MatePanelAppletFrameDBus {
4560
border-style: solid;
4561
border-width: 0 1px;
4562
border-color: rgba(0, 0, 0, 0.1);
4563
}
4564
.mate-panel-menu-bar menubar menuitem {
4566
padding: 4px;
4567
}
4568
.mate-panel-menu-bar menubar menu menuitem {
4570
padding: 6px;
4571
}
4572
.mate-panel-menu-bar #PanelApplet button {
4574
-GtkWidget-window-dragging: true;
4575
padding: 4px;
4576
border-radius: 0;
4577
}
4578
PanelApplet.wnck-applet .wnck-pager {
4580
background-color: transparent;
4581
color: #40C4FF;
4582
}
4583
PanelApplet.wnck-applet .wnck-pager:hover {
4585
background-color: alpha(currentColor, 0.15);
4586
}
4587
PanelApplet.wnck-applet .wnck-pager:active {
4589
background-color: alpha(currentColor, 0.3);
4590
}
4591
PanelApplet.wnck-applet .wnck-pager:selected {
4593
background-color: #42A5F5;
4594
}
4595
#MatePanelPopupWindow {
4597
border: 1px solid rgba(0, 0, 0, 0.1);
4598
border-radius: 3px;
4599
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
4600
}
4601
#MatePanelPopupWindow frame > border {
4603
border-style: none;
4604
}
4605
#MatePanelPopupWindow ClockMap {
4607
border: 1px solid rgba(0, 0, 0, 0.1);
4608
}
4609
na-tray-applet {
4611
-NaTrayApplet-icon-padding: 3px;
4612
-NaTrayApplet-icon-size: 16;
4613
}
4614
.mate-panel-menu-bar {
4616
-PanelMenuBar-icon-visible: true;
4617
}
4618
.mate-panel-applet-slider {
4620
background-color: transparent;
4621
}
4622
.mate-panel-applet-slider frame {
4624
border: 1px solid rgba(0, 0, 0, 0.1);
4625
border-radius: 3px;
4626
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
4627
background-color: #F5F5F5;
4628
}
4629
.mate-panel-applet-slider frame frame {
4631
all: unset;
4632
}
4633
.mate-panel-applet-slider frame > border {
4635
border-style: none;
4636
}
4637
/*********************
4639
* CAJA File manager *
4640
*********************/
4641
.caja-navigation-window button.toggle.image-button {
4642
border-radius: 2px;
4643
}
4644
.caja-pathbar button {
4646
margin: 0 -1px 0 -2px;
4647
}
4648
.caja-pathbar button > widget {
4650
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4651
-GtkArrow-arrow-scaling: 1;
4652
}
4653
.caja-side-pane notebook viewport.frame,
4655
.caja-side-pane notebook widget .vertical {
4656
background-color: #FFFFFF;
4657
}
4658
.caja-side-pane notebook,
4660
.caja-notebook {
4661
border-top: 1px solid rgba(0, 0, 0, 0.1);
4662
}
4663
.caja-side-pane notebook .frame,
4665
.caja-notebook .frame {
4666
border-style: none;
4667
}
4668
.caja-navigation-window statusbar {
4670
margin: 0 -10px;
4671
padding: 0 4px;
4672
border-top: 1px solid rgba(0, 0, 0, 0.1);
4673
}
4674
.caja-notebook frame > border {
4676
border-style: none;
4677
}
4678
#caja-extra-view-widget {
4680
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4681
background-color: #F5F5F5;
4682
}
4683
#caja-extra-view-widget > box > box > label {
4685
font-weight: bold;
4686
}
4687
/*********
4689
* Pluma *
4690
*********/
4691
.pluma-window statusbar {
4692
margin: 0 -10px;
4693
padding: 0 4px;
4694
border-top: 1px solid rgba(0, 0, 0, 0.1);
4695
}
4696
.pluma-window statusbar frame > border {
4698
border-style: none;
4699
}
4700
.pluma-window statusbar frame button.flat {
4702
padding: 0 4px;
4703
border-radius: 0;
4704
}
4705
.pluma-window statusbar frame button.flat widget {
4707
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4708
-GtkArrow-arrow-scaling: 1;
4709
}
4710
.pluma-print-preview toolbar {
4712
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4713
}
4714
.pluma-window paned.horizontal box.vertical box.horizontal button.flat {
4716
margin: 1px;
4717
}
4718
.pluma-window paned.horizontal box.vertical .frame {
4720
border-style: none;
4721
}
4722
.pluma-window paned.horizontal box.vertical notebook.frame {
4724
margin-top: -1px;
4725
border-top: 1px solid rgba(0, 0, 0, 0.1);
4726
}
4727
.pluma-window paned.horizontal box.vertical notebook.frame box.vertical toolbar.horizontal {
4729
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4730
}
4731
/*********
4733
* Atril *
4734
*********/
4735
.atril-window paned.horizontal box.vertical .frame {
4736
border-style: none;
4737
}
4738
.atril-window paned.horizontal box.vertical notebook .frame {
4740
border-top: 1px solid rgba(0, 0, 0, 0.1);
4741
}
4742
/* mate-screensaver lock dialog */
4744
.lock-dialog {
4745
border-radius: 2px;
4746
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);
4747
}
4748
.lock-dialog frame > border {
4750
border-style: none;
4751
}
4752
/************************
4754
* LightDM GTK+ Greeter *
4755
************************/
4756
#panel_window {
4757
background-color: rgba(0, 0, 0, 0.3);
4758
color: #FFFFFF;
4759
}
4760
#panel_window menubar,
4762
#panel_window separator {
4763
background-color: transparent;
4764
}
4765
#panel_window separator {
4767
padding: 0 4px;
4768
}
4769
#panel_window separator:first-child {
4771
padding: 0 8px;
4772
}
4773
#panel_window menubar > menuitem {
4775
color: rgba(255, 255, 255, 0.75);
4776
}
4777
#panel_window menubar > menuitem:hover {
4779
color: #FFFFFF;
4780
}
4781
#panel_window menubar > menuitem:disabled label {
4783
color: rgba(255, 255, 255, 0.3);
4784
}
4785
#login_window,
4787
#shutdown_dialog,
4788
#restart_dialog {
4789
margin: 8px;
4790
border-radius: 2px;
4791
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);
4792
background-color: #FAFAFA;
4793
}
4794
#content_frame {
4796
padding-bottom: 20px;
4797
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4798
}
4799
#buttonbox_frame {
4801
padding-top: 24px;
4802
}
4803
#buttonbox_frame button {
4805
margin: -16px;
4806
}
4807
#greeter_infobar {
4809
margin-top: -1px;
4810
}
4811
/* GTK NAMED COLORS
4813
----------------
4814
use responsibly! */
4815
/*
4816
widget text/foreground color */
4817
@define-color theme_fg_color rgba(0, 0, 0, 0.8);
4818
/*
4819
text color for entries, views and content in general */
4820
@define-color theme_text_color rgba(0, 0, 0, 0.8);
4821
/*
4822
widget base background color */
4823
@define-color theme_bg_color #F5F5F5;
4824
/*
4825
text widgets and the like base background color */
4826
@define-color theme_base_color #FFFFFF;
4827
/*
4828
base background color of selections */
4829
@define-color theme_selected_bg_color #42A5F5;
4830
/*
4831
text/foreground color of selections */
4832
@define-color theme_selected_fg_color #FFFFFF;
4833
/*
4834
base background color of insensitive widgets */
4835
@define-color insensitive_bg_color #F5F5F5;
4836
/*
4837
text foreground color of insensitive widgets */
4838
@define-color insensitive_fg_color rgba(0, 0, 0, 0.32);
4839
/*
4840
insensitive text widgets and the like base background color */
4841
@define-color insensitive_base_color #FAFAFA;
4842
/*
4843
widget text/foreground color on backdrop windows */
4844
@define-color theme_unfocused_fg_color rgba(0, 0, 0, 0.8);
4845
/*
4846
text color for entries, views and content in general on backdrop windows */
4847
@define-color theme_unfocused_text_color rgba(0, 0, 0, 0.8);
4848
/*
4849
widget base background color on backdrop windows */
4850
@define-color theme_unfocused_bg_color #F5F5F5;
4851
/*
4852
text widgets and the like base background color on backdrop windows */
4853
@define-color theme_unfocused_base_color #FFFFFF;
4854
/*
4855
base background color of selections on backdrop windows */
4856
@define-color theme_unfocused_selected_bg_color #42A5F5;
4857
/*
4858
text/foreground color of selections on backdrop windows */
4859
@define-color theme_unfocused_selected_fg_color #FFFFFF;
4860
/*
4861
insensitive color on backdrop windows */
4862
@define-color unfocused_insensitive_color rgba(0, 0, 0, 0.32);
4863
/*
4864
widgets main borders color */
4865
@define-color borders rgba(0, 0, 0, 0.1);
4866
/*
4867
widgets main borders color on backdrop windows */
4868
@define-color unfocused_borders rgba(0, 0, 0, 0.1);
4869
/*
4870
these are pretty self explicative */
4871
@define-color warning_color #FF6D00;
4872
@define-color error_color #DD2C00;
4873
@define-color success_color #00C853;
4874
/*
4875
FIXME this is really an API */
4876
@define-color content_view_bg #FFFFFF;
4877
@define-color placeholder_text_color rgba(128, 128, 128, 0.88);
4878