ASCII text, with very long lines (356)
1
@keyframes ripple_effect {
2
to {
3
background-size: 1000% 1000%;
4
}
5
}
6
@keyframes header_ripple_effect {
8
from {
9
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 0%, transparent 0%);
10
}
11
to {
12
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 100%, transparent 0%);
13
}
14
}
15
* {
17
background-clip: padding-box;
18
-GtkToolButton-icon-spacing: 0;
19
-GtkTextView-error-underline-color: #DD2C00;
20
-GtkScrolledWindow-scrollbar-spacing: 0;
21
-GtkToolItemGroup-expander-size: 11;
22
-GtkWidget-text-handle-width: 24;
23
-GtkWidget-text-handle-height: 24;
24
-GtkDialog-button-spacing: 4;
25
-GtkDialog-action-area-border: 0;
26
outline-style: solid;
27
outline-width: 2px;
28
outline-color: transparent;
29
outline-offset: -4px;
30
-gtk-outline-radius: 2px;
31
-gtk-secondary-caret-color: #42A5F5;
32
}
33
switch:focus slider,
35
notebook:focus tab,
36
*:focus {
37
outline-color: alpha(currentColor, 0.3);
38
}
39
/***************
41
* Base States *
42
***************/
43
.background {
44
background-color: #F5F5F5;
45
color: rgba(0, 0, 0, 0.8);
46
}
47
/*
49
These wildcard seems unavoidable, need to investigate.
50
Wildcards are bad and troublesome, use them with care,
51
or better, just don't.
52
Everytime a wildcard is used a kitten dies, painfully.
53
*/
54
*:disabled {
55
-gtk-icon-effect: dim;
56
}
57
.gtkstyle-fallback {
59
background-color: #F5F5F5;
60
color: rgba(0, 0, 0, 0.8);
61
}
62
.gtkstyle-fallback:hover {
64
background-color: #e8e8e8;
65
color: rgba(0, 0, 0, 0.8);
66
}
67
.gtkstyle-fallback:active {
69
background-color: gainsboro;
70
color: rgba(0, 0, 0, 0.8);
71
}
72
.gtkstyle-fallback:disabled {
74
background-color: #F5F5F5;
75
color: rgba(0, 0, 0, 0.32);
76
}
77
.gtkstyle-fallback:selected {
79
background-color: #42A5F5;
80
color: #FFFFFF;
81
}
82
.view {
84
background-color: #FFFFFF;
85
color: rgba(0, 0, 0, 0.8);
86
}
87
.view:disabled {
89
color: rgba(0, 0, 0, 0.32);
90
}
91
textview text {
93
background-color: #FFFFFF;
94
}
95
textview border {
97
background-color: #FAFAFA;
98
}
99
iconview, .nautilus-canvas-item, .caja-canvas-item {
101
border-radius: 2px;
102
}
103
.rubberband,
105
rubberband,
106
flowbox rubberband,
107
treeview.view rubberband,
108
.content-view rubberband,
109
.content-view .rubberband {
110
border: 1px solid #40C4FF;
111
background-color: rgba(64, 196, 255, 0.3);
112
}
113
flowbox flowboxchild {
115
padding: 4px;
116
border-radius: 2px;
117
}
118
.content-view .tile:selected {
120
background-color: transparent;
121
color: inherit;
122
}
123
label {
125
caret-color: currentColor;
126
}
127
label.separator {
129
color: rgba(0, 0, 0, 0.8);
130
}
131
label selection {
133
background-color: #42A5F5;
134
color: #FFFFFF;
135
}
136
label:disabled {
138
color: rgba(0, 0, 0, 0.32);
139
}
140
tab label:disabled,
142
button label:disabled {
143
color: inherit;
144
}
145
.dim-label, label.separator, .titlebar:not(headerbar) .subtitle,
147
headerbar .subtitle {
148
opacity: 0.6;
149
}
150
assistant .sidebar {
152
padding: 4px 0;
153
}
154
assistant .sidebar label {
156
min-height: 36px;
157
padding: 0 12px;
158
color: rgba(0, 0, 0, 0.48);
159
font-weight: 500;
160
}
161
assistant .sidebar label.highlight {
163
color: rgba(0, 0, 0, 0.8);
164
}
165
popover.background.touch-selection, popover.background.magnifier, popover.background.osd, .app-notification, .osd .scale-popup, .nautilus-window .floating-bar, .osd {
167
opacity: 0.9;
168
}
169
/*********************
171
* Spinner Animation *
172
*********************/
173
@keyframes spin {
174
to {
175
-gtk-icon-transform: rotate(1turn);
176
}
177
}
178
@keyframes spin_colors {
180
1% {
181
color: #66BB6A;
182
}
183
25% {
184
color: #66BB6A;
185
}
186
26% {
187
color: #42A5F5;
188
}
189
50% {
190
color: #42A5F5;
191
}
192
51% {
193
color: #FFA726;
194
}
195
75% {
196
color: #FFA726;
197
}
198
76% {
199
color: #EF5350;
200
}
201
100% {
202
color: #EF5350;
203
}
204
}
205
spinner {
207
background: none;
208
opacity: 0;
209
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
210
}
211
spinner:checked {
213
opacity: 1;
214
animation: spin 1s linear infinite, spin_colors 4s linear infinite;
215
}
216
spinner:checked:disabled {
218
opacity: 0.4;
219
}
220
/****************
222
* Text Entries *
223
****************/
224
spinbutton:not(.vertical),
225
entry {
226
min-height: 36px;
227
padding: 0 8px;
228
border-radius: 2px;
229
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
230
border-image: none;
231
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
232
background-color: #FFFFFF;
233
color: rgba(0, 0, 0, 0.8);
234
}
235
spinbutton:focus:not(.vertical),
237
entry:focus {
238
border-image: none;
239
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
240
}
241
spinbutton:disabled:not(.vertical),
243
entry:disabled {
244
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
245
background-color: #FAFAFA;
246
color: rgba(0, 0, 0, 0.32);
247
}
248
spinbutton.flat:not(.vertical), notebook > stack:not(:only-child) entry:not(.search),
250
notebook > stack:not(:only-child) spinbutton:not(.vertical), colorchooser .popover.osd spinbutton:not(.vertical), layoutpane entry.search, editortweak entry.search, #login_window entry,
251
entry.flat {
252
border-radius: 0;
253
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
254
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
255
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
256
background-color: transparent;
257
color: rgba(0, 0, 0, 0.8);
258
}
259
spinbutton.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry:focus:not(.search),
261
notebook > stack:not(:only-child) spinbutton:focus:not(.vertical), colorchooser .popover.osd spinbutton:focus:not(.vertical), layoutpane entry.search:focus, editortweak entry.search:focus, #login_window entry:focus,
262
entry.flat:focus {
263
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
264
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
265
}
266
spinbutton.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry:disabled:not(.search),
268
notebook > stack:not(:only-child) spinbutton:disabled:not(.vertical), colorchooser .popover.osd spinbutton:disabled:not(.vertical), layoutpane entry.search:disabled, editortweak entry.search:disabled, #login_window entry:disabled,
269
entry.flat:disabled {
270
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
271
background-color: transparent;
272
color: rgba(0, 0, 0, 0.32);
273
}
274
spinbutton:not(.vertical) image,
276
entry image {
277
color: alpha(currentColor, 0.75);
278
}
279
spinbutton:not(.vertical) image:hover, spinbutton:not(.vertical) image:active,
281
entry image:hover,
282
entry image:active {
283
color: currentColor;
284
}
285
spinbutton:not(.vertical) image:disabled,
287
entry image:disabled {
288
color: alpha(currentColor, 0.6);
289
}
290
spinbutton:not(.vertical) image.left,
292
entry image.left {
293
margin-left: 2px;
294
margin-right: 6px;
295
}
296
spinbutton:not(.vertical) image.right,
298
entry image.right {
299
margin-left: 6px;
300
margin-right: 2px;
301
}
302
spinbutton:not(.vertical) undershoot.left,
304
entry undershoot.left {
305
background-color: transparent;
306
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
307
padding-left: 1px;
308
background-size: 1px 12px;
309
background-repeat: repeat-y;
310
background-origin: content-box;
311
background-position: left top;
312
}
313
spinbutton:not(.vertical) undershoot.right,
315
entry undershoot.right {
316
background-color: transparent;
317
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
318
padding-right: 1px;
319
background-size: 1px 12px;
320
background-repeat: repeat-y;
321
background-origin: content-box;
322
background-position: right top;
323
}
324
spinbutton.error:not(.vertical),
326
entry.error {
327
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
328
border-image: none;
329
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
330
background-color: #DD2C00;
331
color: #FFFFFF;
332
}
333
spinbutton.error:focus:not(.vertical),
335
entry.error:focus {
336
border-image: none;
337
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
338
}
339
spinbutton.error:disabled:not(.vertical),
341
entry.error:disabled {
342
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
343
background-color: #FAFAFA;
344
color: rgba(0, 0, 0, 0.32);
345
}
346
spinbutton.error.flat:not(.vertical), notebook > stack:not(:only-child) entry.error:not(.search),
348
notebook > stack:not(:only-child) spinbutton.error:not(.vertical), colorchooser .popover.osd spinbutton.error:not(.vertical), layoutpane entry.error.search, editortweak entry.error.search, #login_window entry.error,
349
entry.error.flat {
350
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
351
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #DD2C00 0%, transparent 0%) 0 0 0/0 0 0px;
352
box-shadow: inset 0 -1px #DD2C00;
353
background-color: transparent;
354
color: rgba(0, 0, 0, 0.8);
355
}
356
spinbutton.error.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry.error:focus:not(.search),
358
notebook > stack:not(:only-child) spinbutton.error:focus:not(.vertical), colorchooser .popover.osd spinbutton.error:focus:not(.vertical), layoutpane entry.error.search:focus, editortweak entry.error.search:focus, #login_window entry.error:focus,
359
entry.error.flat:focus {
360
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #DD2C00 100%, transparent 0%) 0 0 2/0 0 2px;
361
box-shadow: inset 0 -1px #DD2C00;
362
}
363
spinbutton.error.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry.error:disabled:not(.search),
365
notebook > stack:not(:only-child) spinbutton.error:disabled:not(.vertical), colorchooser .popover.osd spinbutton.error:disabled:not(.vertical), layoutpane entry.error.search:disabled, editortweak entry.error.search:disabled, #login_window entry.error:disabled,
366
entry.error.flat:disabled {
367
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
368
background-color: transparent;
369
color: rgba(0, 0, 0, 0.32);
370
}
371
spinbutton.warning:not(.vertical),
373
entry.warning {
374
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
375
border-image: none;
376
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
377
background-color: #FF6D00;
378
color: #FFFFFF;
379
}
380
spinbutton.warning:focus:not(.vertical),
382
entry.warning:focus {
383
border-image: none;
384
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
385
}
386
spinbutton.warning:disabled:not(.vertical),
388
entry.warning:disabled {
389
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
390
background-color: #FAFAFA;
391
color: rgba(0, 0, 0, 0.32);
392
}
393
spinbutton.warning.flat:not(.vertical), notebook > stack:not(:only-child) entry.warning:not(.search),
395
notebook > stack:not(:only-child) spinbutton.warning:not(.vertical), colorchooser .popover.osd spinbutton.warning:not(.vertical), layoutpane entry.warning.search, editortweak entry.warning.search, #login_window entry.warning,
396
entry.warning.flat {
397
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
398
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FF6D00 0%, transparent 0%) 0 0 0/0 0 0px;
399
box-shadow: inset 0 -1px #FF6D00;
400
background-color: transparent;
401
color: rgba(0, 0, 0, 0.8);
402
}
403
spinbutton.warning.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry.warning:focus:not(.search),
405
notebook > stack:not(:only-child) spinbutton.warning:focus:not(.vertical), colorchooser .popover.osd spinbutton.warning:focus:not(.vertical), layoutpane entry.warning.search:focus, editortweak entry.warning.search:focus, #login_window entry.warning:focus,
406
entry.warning.flat:focus {
407
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FF6D00 100%, transparent 0%) 0 0 2/0 0 2px;
408
box-shadow: inset 0 -1px #FF6D00;
409
}
410
spinbutton.warning.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry.warning:disabled:not(.search),
412
notebook > stack:not(:only-child) spinbutton.warning:disabled:not(.vertical), colorchooser .popover.osd spinbutton.warning:disabled:not(.vertical), layoutpane entry.warning.search:disabled, editortweak entry.warning.search:disabled, #login_window entry.warning:disabled,
413
entry.warning.flat:disabled {
414
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
415
background-color: transparent;
416
color: rgba(0, 0, 0, 0.32);
417
}
418
spinbutton:not(.vertical) progress,
420
entry progress {
421
margin: 2px -6px;
422
border-bottom: 2px solid #42A5F5;
423
background-color: transparent;
424
}
425
.linked:not(.vertical) > spinbutton.flat:not(.vertical), notebook > stack:not(:only-child) .linked:not(.vertical) > entry:not(.search),
427
notebook > stack:not(:only-child) .linked:not(.vertical) > spinbutton:not(.vertical), colorchooser .popover.osd .linked:not(.vertical) > spinbutton:not(.vertical), layoutpane .linked:not(.vertical) > entry.search, editortweak .linked:not(.vertical) > entry.search, #login_window .linked:not(.vertical) > entry,
428
.linked.vertical > spinbutton.flat:not(.vertical), notebook > stack:not(:only-child)
429
.linked.vertical > entry:not(.search),
430
notebook > stack:not(:only-child)
431
.linked.vertical > spinbutton:not(.vertical), colorchooser .popover.osd
432
.linked.vertical > spinbutton:not(.vertical), layoutpane
433
.linked.vertical > entry.search, editortweak
434
.linked.vertical > entry.search, #login_window
435
.linked.vertical > entry, .linked:not(.vertical) >
436
entry.flat,
437
.linked.vertical >
438
entry.flat {
439
border-radius: 0;
440
}
441
treeview entry.flat, treeview entry {
443
min-height: 0;
444
padding: 2px;
445
border-radius: 0;
446
background-color: #FFFFFF;
447
}
448
treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:focus {
450
border-image: none;
451
box-shadow: none;
452
}
453
/***********
455
* Buttons *
456
***********/
457
@keyframes needs_attention {
458
from {
459
background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent));
460
}
461
to {
462
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#FF4081), to(transparent));
463
}
464
}
465
button {
468
min-height: 24px;
469
min-width: 16px;
470
padding: 6px 10px;
471
border-radius: 2px;
472
font-weight: 500;
473
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1), background-size 0.5s cubic-bezier(0, 0, 0.2, 1), background-image 1s cubic-bezier(0, 0, 0.2, 1);
474
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 0 0 9999px transparent;
475
background-color: #FAFAFA;
476
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
477
background-repeat: no-repeat;
478
background-position: center;
479
background-size: 1000% 1000%;
480
color: rgba(0, 0, 0, 0.6);
481
}
482
button:hover {
485
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 0 0 9999px transparent;
486
color: rgba(0, 0, 0, 0.8);
487
}
488
button:active {
491
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
492
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
493
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 0 0 9999px alpha(currentColor, 0.15);
494
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
495
background-size: 0% 0%;
496
color: rgba(0, 0, 0, 0.8);
497
}
498
button:disabled {
501
box-shadow: none;
502
background-color: alpha(currentColor, 0.3);
503
color: rgba(0, 0, 0, 0.24);
504
}
505
button:checked {
508
background-color: #42A5F5;
509
color: #FFFFFF;
510
}
511
button:checked:disabled {
514
background-color: alpha(currentColor, 0.3);
515
color: rgba(66, 165, 245, 0.4);
516
}
517
modelbutton.flat,
519
.menuitem.button.flat, spinbutton:not(.vertical) button, spinbutton.vertical button, popover.background.menu button,
520
popover.background button.model, notebook > header > tabs > arrow, scrollbar button, check,
521
radio, calendar.button, messagedialog.csd .dialog-action-area button, button.sidebar-button, .gedit-search-slider button, PanelToplevel > widget > button, .lightdm-gtk-greeter button, :not(headerbar) .caja-pathbar button, .caja-pathbar :not(headerbar) button, :not(headerbar)
522
.path-bar button, layouttabbar button, .mate-panel-menu-bar #PanelApplet button:not(.flat), toolbar button, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
523
headerbar button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button,
524
button.flat {
525
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0.5s cubic-bezier(0, 0, 0.2, 1), background-image 1s cubic-bezier(0, 0, 0.2, 1);
526
box-shadow: inset 0 0 0 9999px transparent;
527
background-color: transparent;
528
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
529
background-repeat: no-repeat;
530
background-position: center;
531
background-size: 1000% 1000%;
532
color: alpha(currentColor, 0.75);
533
}
534
modelbutton.flat:hover,
536
.menuitem.button.flat:hover, spinbutton:not(.vertical) button:hover, spinbutton.vertical button:hover, popover.background.menu button:hover,
537
popover.background button.model:hover, notebook > header > tabs > arrow:hover, scrollbar button:hover, check:hover,
538
radio:hover, calendar.button:hover, messagedialog.csd .dialog-action-area button:hover, button.sidebar-button:hover, .gedit-search-slider button:hover, PanelToplevel > widget > button:hover, .lightdm-gtk-greeter button:hover, :not(headerbar) .caja-pathbar button:hover, .caja-pathbar :not(headerbar) button:hover, :not(headerbar)
539
.path-bar button:hover, layouttabbar button:hover, .mate-panel-menu-bar #PanelApplet button:hover:not(.flat), toolbar button:hover, .titlebar:not(headerbar) button:hover:not(.suggested-action):not(.destructive-action),
540
headerbar button:hover:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:hover:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:hover,
541
button.flat:hover {
542
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
543
color: currentColor;
544
}
545
modelbutton.flat:active,
547
.menuitem.button.flat:active, spinbutton:not(.vertical) button:active, spinbutton.vertical button:active, popover.background.menu button:active,
548
popover.background button.model:active, notebook > header > tabs > arrow:active, scrollbar button:active, check:active,
549
radio:active, calendar.button:active, messagedialog.csd .dialog-action-area button:active, button.sidebar-button:active, .gedit-search-slider button:active, PanelToplevel > widget > button:active, .lightdm-gtk-greeter button:active, :not(headerbar) .caja-pathbar button:active, .caja-pathbar :not(headerbar) button:active, :not(headerbar)
550
.path-bar button:active, layouttabbar button:active, .mate-panel-menu-bar #PanelApplet button:active:not(.flat), toolbar button:active, .titlebar:not(headerbar) button:active:not(.suggested-action):not(.destructive-action),
551
headerbar button:active:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:active,
552
button.flat:active {
553
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
554
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
555
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
556
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
557
background-size: 0% 0%;
558
color: currentColor;
559
}
560
modelbutton.flat:disabled,
562
.menuitem.button.flat:disabled, spinbutton:not(.vertical) button:disabled, spinbutton.vertical button:disabled, popover.background.menu button:disabled,
563
popover.background button.model:disabled, notebook > header > tabs > arrow:disabled, scrollbar button:disabled, check:disabled,
564
radio:disabled, calendar.button:disabled, messagedialog.csd .dialog-action-area button:disabled, button.sidebar-button:disabled, .gedit-search-slider button:disabled, PanelToplevel > widget > button:disabled, .lightdm-gtk-greeter button:disabled, :not(headerbar) .caja-pathbar button:disabled, .caja-pathbar :not(headerbar) button:disabled, :not(headerbar)
565
.path-bar button:disabled, layouttabbar button:disabled, .mate-panel-menu-bar #PanelApplet button:disabled:not(.flat), toolbar button:disabled, .titlebar:not(headerbar) button:disabled:not(.suggested-action):not(.destructive-action),
566
headerbar button:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:disabled:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:disabled,
567
button.flat:disabled {
568
box-shadow: none;
569
background-color: transparent;
570
color: alpha(currentColor, 0.3);
571
}
572
:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar)
574
.path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar #PanelApplet button:checked:not(.flat), toolbar button:checked, .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action),
575
headerbar button:checked:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked,
576
button.flat:checked {
577
background-color: alpha(currentColor, 0.3);
578
color: currentColor;
579
}
580
:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar)
582
.path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar #PanelApplet button:checked:disabled:not(.flat), toolbar button:checked:disabled, .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action),
583
headerbar button:checked:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked:disabled,
584
button.flat:checked:disabled {
585
background-color: alpha(currentColor, 0.3);
586
color: alpha(currentColor, 0.4);
587
}
588
button.text-button {
591
padding-left: 16px;
592
padding-right: 16px;
593
}
594
button.image-button {
597
min-width: 24px;
598
padding: 6px;
599
}
600
button.text-button.image-button label:first-child {
603
margin-left: 10px;
604
}
605
button.text-button.image-button label:last-child {
608
margin-right: 10px;
609
}
610
button.text-button.image-button image:not(:only-child) {
613
margin: 0 4px;
614
}
615
toolbar .linked > button, .titlebar:not(headerbar) .linked > button:not(.suggested-action):not(.destructive-action),
617
headerbar .linked > button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked > button:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification .linked > button, toolbar
618
.linked.vertical > button, .titlebar:not(headerbar)
619
.linked.vertical > button:not(.suggested-action):not(.destructive-action),
620
headerbar
621
.linked.vertical > button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box
622
.linked.vertical > button:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification
623
.linked.vertical > button, .linked >
624
button.flat,
625
.linked.vertical >
626
button.flat {
627
border-radius: 2px;
628
}
629
infobar.info button:disabled, infobar.question button:disabled, infobar.warning button:disabled, infobar.error button:disabled, row:selected
631
button:disabled {
632
color: rgba(255, 255, 255, 0.3);
633
}
634
button.osd {
637
padding: 12px 16px;
638
}
639
button.osd.image-button {
642
padding: 12px;
643
}
644
button.osd:disabled {
647
opacity: 0;
648
}
649
button.suggested-action {
652
background-color: #FF4081;
653
color: #FFFFFF;
654
}
655
button.suggested-action:disabled {
658
box-shadow: none;
659
background-color: alpha(currentColor, 0.3);
660
color: rgba(0, 0, 0, 0.32);
661
}
662
button.suggested-action:checked {
665
background-color: #ff79a7;
666
}
667
button.suggested-action.flat {
670
background-color: transparent;
671
color: #FF4081;
672
}
673
button.suggested-action.flat:disabled {
676
box-shadow: none;
677
background-color: transparent;
678
color: alpha(currentColor, 0.4);
679
}
680
button.suggested-action.flat:checked {
683
background-color: alpha(currentColor, 0.3);
684
}
685
button.destructive-action {
688
background-color: #FF5252;
689
color: #FFFFFF;
690
}
691
button.destructive-action:disabled {
694
box-shadow: none;
695
background-color: alpha(currentColor, 0.3);
696
color: rgba(0, 0, 0, 0.32);
697
}
698
button.destructive-action:checked {
701
background-color: #ff8686;
702
}
703
button.destructive-action.flat {
706
background-color: transparent;
707
color: #FF5252;
708
}
709
button.destructive-action.flat:disabled {
712
box-shadow: none;
713
background-color: transparent;
714
color: alpha(currentColor, 0.4);
715
}
716
button.destructive-action.flat:checked {
719
background-color: alpha(currentColor, 0.3);
720
}
721
.stack-switcher >
723
button {
724
outline-offset: -4px;
725
}
726
.stack-switcher >
728
button > label {
729
padding-left: 6px;
730
padding-right: 6px;
731
}
732
.stack-switcher >
734
button > image {
735
padding-left: 6px;
736
padding-right: 6px;
737
padding-top: 3px;
738
padding-bottom: 3px;
739
}
740
.stack-switcher >
742
button.text-button {
743
padding-left: 10px;
744
padding-right: 10px;
745
}
746
.stack-switcher >
748
button.image-button {
749
padding-left: 4px;
750
padding-right: 4px;
751
}
752
.stack-switcher >
754
button.needs-attention:checked > label,
755
.stack-switcher >
756
button.needs-attention:checked > image {
757
animation: none;
758
background-image: none;
759
}
760
button separator {
763
min-width: 0;
764
min-height: 0;
765
background-color: transparent;
766
}
767
.primary-toolbar
769
button {
770
-gtk-icon-shadow: none;
771
}
772
button.image-button:not(.text-button), toolbar .linked > button.image-button:not(.text-button), .titlebar:not(headerbar) .linked > button.image-button:not(.text-button):not(.suggested-action):not(.destructive-action),
775
headerbar .linked > button.image-button:not(.text-button):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked > button.image-button:not(.text-button):not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification .linked > button.image-button:not(.text-button), toolbar
776
.linked.vertical > button.image-button:not(.text-button),
777
headerbar
778
.linked.vertical > button.image-button:not(.text-button):not(.suggested-action):not(.destructive-action), .app-notification
779
.linked.vertical > button.image-button:not(.text-button), .linked > button.flat.image-button:not(.text-button),
780
.linked.vertical > button.flat.image-button:not(.text-button), .inline-toolbar button:not(.text-button), check,
781
radio, button.titlebutton, .nautilus-window headerbar > revealer > button,
782
button.close,
783
button.circular {
784
border-radius: 9999px;
785
-gtk-outline-radius: 9999px;
786
}
787
spinbutton:not(.vertical) button, notebook > header tab button.flat, button.sidebar-button, .nautilus-window .floating-bar button, .gedit-document-panel row button.flat, .gedit-search-slider button:dir(ltr), .gedit-search-slider button:dir(rtl), .pluma-window paned.horizontal box.vertical box.horizontal button.flat {
789
min-height: 24px;
790
min-width: 24px;
791
padding: 0;
792
border-radius: 9999px;
793
-gtk-outline-radius: 9999px;
794
}
795
.stack-switcher >
797
button.needs-attention > label,
798
.stack-switcher >
799
button.needs-attention > image, stacksidebar row.needs-attention > label {
800
animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
801
background-repeat: no-repeat;
802
background-position: right 3px;
803
background-size: 6px 6px;
804
}
805
.stack-switcher >
807
button.needs-attention > label:dir(rtl),
808
.stack-switcher >
809
button.needs-attention > image:dir(rtl), stacksidebar row.needs-attention > label:dir(rtl) {
810
background-position: left 3px;
811
}
812
.linked:not(.vertical) > combobox:not(:only-child) > box > button.combo, .linked:not(.vertical) > spinbutton:not(:only-child):not(.vertical), .linked:not(.vertical) > entry:not(:only-child), .linked > button:not(:only-child) {
814
border-radius: 0;
815
-gtk-outline-radius: 2px;
816
}
817
.linked:not(.vertical) > combobox:not(:only-child):first-child > box > button.combo, .linked:not(.vertical) > spinbutton:not(:only-child):first-child:not(.vertical), .linked:not(.vertical) > entry:not(:only-child):first-child, .linked > button:not(:only-child):first-child, combobox.linked button:not(:only-child):nth-child(2):dir(rtl) {
819
border-radius: 2px 0 0 2px;
820
}
821
.linked:not(.vertical) > combobox:not(:only-child):last-child > box > button.combo, .linked:not(.vertical) > spinbutton:not(:only-child):last-child:not(.vertical), .linked:not(.vertical) > entry:not(:only-child):last-child, .linked > button:not(:only-child):last-child, combobox.linked button:not(:only-child):nth-child(2):dir(ltr) {
823
border-radius: 0 2px 2px 0;
824
}
825
.linked.vertical > combobox:not(:only-child) > box > button.combo, .linked.vertical > spinbutton:not(:only-child):not(.vertical), .linked.vertical > entry:not(:only-child), .linked.vertical > button:not(:only-child) {
827
border-radius: 0;
828
-gtk-outline-radius: 2px;
829
}
830
.linked.vertical > combobox:not(:only-child):first-child > box > button.combo, .linked.vertical > spinbutton:not(:only-child):first-child:not(.vertical), .linked.vertical > entry:not(:only-child):first-child, .linked.vertical > button:not(:only-child):first-child {
832
border-radius: 2px 2px 0 0;
833
}
834
.linked.vertical > combobox:not(:only-child):last-child > box > button.combo, .linked.vertical > spinbutton:not(:only-child):last-child:not(.vertical), .linked.vertical > entry:not(:only-child):last-child, .linked.vertical > button:not(:only-child):last-child {
836
border-radius: 0 0 2px 2px;
837
}
838
/* menu buttons */
840
modelbutton.flat,
841
.menuitem.button.flat {
842
min-height: 28px;
843
padding: 0 8px;
844
border-radius: 2px;
845
color: inherit;
846
}
847
modelbutton.flat check,
849
modelbutton.flat radio,
850
.menuitem.button.flat check,
851
.menuitem.button.flat radio {
852
box-shadow: none;
853
background-image: none;
854
}
855
modelbutton.flat check:not(:checked):not(:indeterminate),
857
modelbutton.flat radio:not(:checked):not(:indeterminate),
858
.menuitem.button.flat check:not(:checked):not(:indeterminate),
859
.menuitem.button.flat radio:not(:checked):not(:indeterminate) {
860
color: alpha(currentColor, 0.6);
861
}
862
modelbutton.flat check:last-child,
864
modelbutton.flat radio:last-child,
865
.menuitem.button.flat check:last-child,
866
.menuitem.button.flat radio:last-child {
867
margin-left: -8px;
868
margin-right: -16px;
869
}
870
modelbutton.flat check:first-child,
872
modelbutton.flat radio:first-child,
873
.menuitem.button.flat check:first-child,
874
.menuitem.button.flat radio:first-child {
875
margin-left: -16px;
876
margin-right: -8px;
877
}
878
modelbutton.flat arrow {
880
background: none;
881
}
882
modelbutton.flat arrow:hover {
884
background: none;
885
}
886
modelbutton.flat arrow.left {
888
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
889
}
890
modelbutton.flat arrow.right {
892
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
893
}
894
button.color {
896
min-height: 24px;
897
min-width: 24px;
898
padding: 6px;
899
}
900
/*********
902
* Links *
903
*********/
904
*:link, button:link,
905
button:visited, *:link:hover, button:hover:link,
906
button:hover:visited, *:link:active, button:active:link,
907
button:active:visited {
908
color: #42A5F5;
909
}
910
*:link:visited,
912
button:visited, *:link:visited:hover,
913
button:visited:hover, *:link:visited:active,
914
button:visited:active {
915
color: #E040FB;
916
}
917
infobar.info *:link, infobar.info button:link, infobar.info
919
button:visited, infobar.question *:link, infobar.question button:link, infobar.question
920
button:visited, infobar.warning *:link, infobar.warning button:link, infobar.warning
921
button:visited, infobar.error *:link, infobar.error button:link, infobar.error
922
button:visited, *:link:selected, button:selected:link,
923
button:selected:visited, .selection-mode.titlebar:not(headerbar) .subtitle:link,
924
headerbar.selection-mode .subtitle:link,
925
*:selected *:link,
926
*:selected button:link,
927
*:selected
928
button:visited {
929
color: #FFFFFF;
930
}
931
button:link > label,
933
button:visited > label {
934
text-decoration-line: underline;
935
}
936
/*****************
938
* GtkSpinButton *
939
*****************/
940
spinbutton:not(.vertical) {
941
padding: 0;
942
}
943
notebook > stack:not(:only-child) spinbutton:not(.vertical) entry, notebook > stack:not(:only-child) spinbutton:not(.vertical) entry:focus, notebook > stack:not(:only-child) spinbutton:not(.vertical) entry:disabled,
945
spinbutton:not(.vertical) entry {
946
min-width: 32px;
947
margin: 0;
948
border-image: none;
949
border-radius: 0;
950
box-shadow: none;
951
background-color: transparent;
952
}
953
spinbutton:not(.vertical) button {
955
border: solid 6px transparent;
956
}
957
spinbutton:not(.vertical) button.up:dir(ltr), spinbutton:not(.vertical) button.down:dir(rtl) {
959
margin-left: -3px;
960
}
961
spinbutton:not(.vertical) button.up:dir(rtl), spinbutton:not(.vertical) button.down:dir(ltr) {
963
margin-right: -3px;
964
}
965
spinbutton.vertical:disabled {
967
color: rgba(0, 0, 0, 0.32);
968
}
969
spinbutton.vertical:drop(active) {
971
box-shadow: none;
972
}
973
spinbutton.vertical entry {
975
min-height: 36px;
976
min-width: 48px;
977
padding: 0;
978
}
979
spinbutton.vertical button {
981
min-height: 36px;
982
min-width: 48px;
983
padding: 0;
984
}
985
spinbutton.vertical button.up {
987
border-radius: 2px 2px 0 0;
988
}
989
spinbutton.vertical button.down {
991
border-radius: 0 0 2px 2px;
992
}
993
treeview spinbutton:not(.vertical) {
995
min-height: 0;
996
border-style: none;
997
border-radius: 0;
998
}
999
treeview spinbutton:not(.vertical) entry {
1001
min-height: 0;
1002
padding: 1px 2px;
1003
}
1004
/**************
1006
* ComboBoxes *
1007
**************/
1008
combobox arrow {
1009
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1010
min-height: 16px;
1011
min-width: 16px;
1012
}
1013
combobox decoration,
1015
combobox button.combo:checked {
1016
transition: none;
1017
}
1018
combobox button.combo cellview:dir(ltr) {
1020
margin-left: -2px;
1021
}
1022
combobox button.combo cellview:dir(rtl) {
1024
margin-right: -2px;
1025
}
1026
combobox #gtk-combobox-popup-menu {
1028
padding: 2px 0;
1029
}
1030
combobox #gtk-combobox-popup-menu menuitem {
1032
min-height: 32px;
1033
padding: 0 8px;
1034
}
1035
combobox:drop(active) {
1037
box-shadow: none;
1038
}
1039
notebook > stack:not(:only-child) button.combo, #login_window #user_combobox button {
1041
border-radius: 0;
1042
background-image: none;
1043
font-weight: inherit;
1044
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1045
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1046
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
1047
background-color: transparent;
1048
color: rgba(0, 0, 0, 0.8);
1049
}
1050
notebook > stack:not(:only-child) button.combo:hover, #login_window #user_combobox button:hover {
1052
box-shadow: inset 0 -2px alpha(currentColor, 0.3);
1053
}
1054
notebook > stack:not(:only-child) button.combo:checked, #login_window #user_combobox button:checked {
1056
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1057
}
1058
notebook > stack:not(:only-child) button.combo:disabled, #login_window #user_combobox button:disabled {
1060
color: rgba(0, 0, 0, 0.32);
1061
}
1062
/************
1064
* Toolbars *
1065
************/
1066
toolbar {
1067
-GtkWidget-window-dragging: true;
1068
padding: 3px;
1069
background-color: #F5F5F5;
1070
}
1071
.osd toolbar {
1073
background-color: transparent;
1074
}
1075
toolbar.osd, .app-notification, frame.documents-dropdown {
1077
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1078
padding: 6px;
1079
border-radius: 2px;
1080
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);
1081
background-color: #FFFFFF;
1082
}
1083
toolbar.osd:backdrop, .app-notification:backdrop, frame.documents-dropdown:backdrop {
1085
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);
1086
}
1087
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 {
1089
border-radius: 0;
1090
}
1091
toolbar.horizontal separator {
1093
margin: 3px;
1094
}
1095
toolbar.vertical separator {
1097
margin: 3px;
1098
}
1099
toolbar:not(.inline-toolbar):not(.osd) scale,
1101
toolbar:not(.inline-toolbar):not(.osd) entry,
1102
toolbar:not(.inline-toolbar):not(.osd) spinbutton,
1103
toolbar:not(.inline-toolbar):not(.osd) button {
1104
margin: 3px;
1105
}
1106
toolbar:not(.inline-toolbar):not(.osd) .linked entry:not(:first-child),
1108
toolbar:not(.inline-toolbar):not(.osd) .linked spinbutton:not(:first-child),
1109
toolbar:not(.inline-toolbar):not(.osd) .linked button:not(:first-child) {
1110
margin-left: 0;
1111
}
1112
toolbar:not(.inline-toolbar):not(.osd) .linked entry:not(:last-child),
1114
toolbar:not(.inline-toolbar):not(.osd) .linked spinbutton:not(:last-child),
1115
toolbar:not(.inline-toolbar):not(.osd) .linked button:not(:last-child) {
1116
margin-right: 0;
1117
}
1118
toolbar:not(.inline-toolbar):not(.osd) switch {
1120
margin: 9px 3px;
1121
}
1122
.inline-toolbar {
1124
padding: 6px;
1125
border-style: solid;
1126
border-width: 0 1px 1px;
1127
border-color: rgba(0, 0, 0, 0.1);
1128
background-color: #FAFAFA;
1129
}
1130
searchbar,
1132
.location-bar {
1133
padding: 6px;
1134
border-style: solid;
1135
border-width: 0 0 1px;
1136
border-color: rgba(0, 0, 0, 0.1);
1137
background-color: #F5F5F5;
1138
background-clip: border-box;
1139
}
1140
/***************
1142
* Header bars *
1143
***************/
1144
.titlebar:not(headerbar),
1145
headerbar {
1146
transition: background-color 0.2s cubic-bezier(0, 0, 0.2, 1);
1147
min-height: 48px;
1148
padding: 0 6px;
1149
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);
1150
background-color: #E0E0E0;
1151
color: rgba(0, 0, 0, 0.8);
1152
}
1153
.titlebar:disabled:not(headerbar) :not(button) > label,
1155
headerbar:disabled :not(button) > label {
1156
color: rgba(0, 0, 0, 0.32);
1157
}
1158
.titlebar:backdrop:not(headerbar),
1160
headerbar:backdrop {
1161
color: rgba(0, 0, 0, 0.6);
1162
}
1163
.titlebar:backdrop:disabled:not(headerbar) :not(button) > label,
1165
headerbar:backdrop:disabled :not(button) > label {
1166
color: rgba(0, 0, 0, 0.24);
1167
}
1168
.titlebar:not(headerbar) .title,
1170
headerbar .title {
1171
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1172
padding: 0 12px;
1173
font-weight: bold;
1174
}
1175
.titlebar:not(headerbar) .subtitle,
1177
headerbar .subtitle {
1178
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1179
padding: 0 12px;
1180
font-size: smaller;
1181
}
1182
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
1184
headerbar button:not(.suggested-action):not(.destructive-action) {
1185
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1186
}
1187
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1189
headerbar button:not(.suggested-action):not(.destructive-action):checked {
1190
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1191
}
1192
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1194
headerbar button:not(.suggested-action):not(.destructive-action):checked,
1195
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled {
1196
background-color: transparent;
1197
}
1198
.titlebar:not(headerbar) button.suggested-action:disabled, .titlebar:not(headerbar) button.destructive-action:disabled,
1200
headerbar button.suggested-action:disabled,
1201
headerbar button.destructive-action:disabled {
1202
color: alpha(currentColor, 0.4);
1203
}
1204
.selection-mode.titlebar:not(headerbar),
1206
headerbar.selection-mode {
1207
transition: background-color 0.00001s 0.3s;
1208
animation: header_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1);
1209
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);
1210
background-color: #42A5F5;
1211
color: #FFFFFF;
1212
}
1213
.selection-mode.titlebar:backdrop:not(headerbar),
1215
headerbar.selection-mode:backdrop {
1216
color: rgba(255, 255, 255, 0.75);
1217
}
1218
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
1220
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action) {
1221
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px;
1222
color: currentColor;
1223
}
1224
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled,
1226
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled {
1227
color: alpha(currentColor, 0.4);
1228
}
1229
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1231
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked {
1232
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
1233
color: currentColor;
1234
}
1235
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1237
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled {
1238
color: alpha(currentColor, 0.4);
1239
}
1240
.selection-mode.titlebar:not(headerbar) .selection-menu,
1242
headerbar.selection-mode .selection-menu {
1243
padding-left: 16px;
1244
padding-right: 16px;
1245
}
1246
.selection-mode.titlebar:not(headerbar) .selection-menu GtkArrow,
1248
headerbar.selection-mode .selection-menu GtkArrow {
1249
-GtkArrow-arrow-scaling: 1;
1250
}
1251
.selection-mode.titlebar:not(headerbar) .selection-menu .arrow,
1253
headerbar.selection-mode .selection-menu .arrow {
1254
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1255
}
1256
.fullscreen .titlebar:not(headerbar),
1258
.tiled .titlebar:not(headerbar),
1259
.maximized .titlebar:not(headerbar), .fullscreen
1260
headerbar,
1261
.tiled
1262
headerbar,
1263
.maximized
1264
headerbar {
1265
border-radius: 0;
1266
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1267
}
1268
.default-decoration.titlebar:not(headerbar),
1270
headerbar.default-decoration {
1271
min-height: 24px;
1272
padding: 6px;
1273
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
1274
}
1275
.fullscreen .default-decoration.titlebar:not(headerbar),
1277
.tiled .default-decoration.titlebar:not(headerbar),
1278
.maximized .default-decoration.titlebar:not(headerbar), .fullscreen
1279
headerbar.default-decoration,
1280
.tiled
1281
headerbar.default-decoration,
1282
.maximized
1283
headerbar.default-decoration {
1284
box-shadow: none;
1285
}
1286
.default-decoration.titlebar:not(headerbar) button.titlebutton,
1288
headerbar.default-decoration button.titlebutton {
1289
min-height: 24px;
1290
min-width: 24px;
1291
margin: 0;
1292
padding: 0;
1293
}
1294
.background:not(.csd) .default-decoration.titlebar:not(headerbar) button.titlebutton:active, .background:not(.csd)
1296
headerbar.default-decoration button.titlebutton:active {
1297
background-size: 1000% 1000%;
1298
}
1299
headerbar entry,
1301
headerbar spinbutton,
1302
headerbar button {
1303
margin-top: 6px;
1304
margin-bottom: 6px;
1305
}
1306
headerbar switch {
1308
margin-top: 12px;
1309
margin-bottom: 12px;
1310
}
1311
headerbar spinbutton button {
1313
margin-top: 0;
1314
margin-bottom: 0;
1315
}
1316
.background:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) .titlebar {
1318
border-top-left-radius: 2px;
1319
border-top-right-radius: 2px;
1320
}
1321
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) separator:first-child + headerbar,
1323
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) headerbar:first-child {
1324
border-top-left-radius: 2px;
1325
}
1326
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) headerbar:last-child {
1328
border-top-right-radius: 2px;
1329
}
1330
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 {
1332
border-top-left-radius: 2px;
1333
border-top-right-radius: 2px;
1334
}
1335
window.csd > .titlebar:not(headerbar) {
1337
padding: 0;
1338
background-color: transparent;
1339
background-image: none;
1340
border-style: none;
1341
box-shadow: none;
1342
}
1343
.titlebar:not(headerbar) > separator {
1345
background-color: #E0E0E0;
1346
background-image: image(rgba(0, 0, 0, 0.1));
1347
}
1348
/************
1350
* Pathbars *
1351
************/
1352
.caja-pathbar button,
1353
.path-bar button {
1354
padding-left: 6px;
1355
padding-right: 6px;
1356
}
1357
.caja-pathbar button label:not(:only-child):first-child,
1359
.path-bar button label:not(:only-child):first-child {
1360
margin-left: 4px;
1361
}
1362
.caja-pathbar button label:not(:only-child):last-child,
1364
.path-bar button label:not(:only-child):last-child {
1365
margin-right: 4px;
1366
}
1367
.caja-pathbar button.slider-button,
1369
.path-bar button.slider-button {
1370
padding-left: 4px;
1371
padding-right: 4px;
1372
}
1373
:not(headerbar) .caja-pathbar button, .caja-pathbar :not(headerbar) button, :not(headerbar)
1375
.path-bar button {
1376
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1377
border-radius: 2px;
1378
}
1379
:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar)
1381
.path-bar button:checked {
1382
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1383
}
1384
: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)
1386
.path-bar button:checked, :not(headerbar)
1387
.path-bar button:checked:disabled {
1388
background-color: transparent;
1389
}
1390
/**************
1392
* Tree Views *
1393
**************/
1394
treeview.view {
1395
border-left-color: alpha(currentColor, 0.3);
1396
border-top-color: rgba(0, 0, 0, 0.1);
1397
}
1398
* {
1400
-GtkTreeView-horizontal-separator: 4;
1401
-GtkTreeView-grid-line-width: 1;
1402
-GtkTreeView-grid-line-pattern: '';
1403
-GtkTreeView-tree-line-width: 1;
1404
-GtkTreeView-tree-line-pattern: '';
1405
-GtkTreeView-expander-size: 16;
1406
}
1407
treeview.view.separator {
1409
min-height: 5px;
1410
color: rgba(0, 0, 0, 0.1);
1411
}
1412
treeview.view:drop(active) {
1414
border-style: solid none;
1415
border-width: 1px;
1416
border-color: #FF4081;
1417
}
1418
treeview.view:drop(active).after {
1420
border-top-style: none;
1421
}
1422
treeview.view:drop(active).before {
1424
border-bottom-style: none;
1425
}
1426
treeview.view.expander {
1428
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1429
-gtk-icon-transform: rotate(-90deg);
1430
color: rgba(0, 0, 0, 0.6);
1431
}
1432
treeview.view.expander:dir(rtl) {
1434
-gtk-icon-transform: rotate(90deg);
1435
}
1436
treeview.view.expander:checked {
1438
-gtk-icon-transform: unset;
1439
}
1440
treeview.view.expander:hover, treeview.view.expander:active {
1442
color: rgba(0, 0, 0, 0.8);
1443
}
1444
treeview.view.expander:disabled {
1446
color: rgba(0, 0, 0, 0.24);
1447
}
1448
treeview.view.expander:selected {
1450
color: rgba(255, 255, 255, 0.75);
1451
}
1452
treeview.view.expander:selected:hover, treeview.view.expander:selected:active {
1454
color: #FFFFFF;
1455
}
1456
treeview.view.expander:selected:disabled {
1458
color: rgba(255, 255, 255, 0.3);
1459
}
1460
treeview.view.progressbar {
1462
border-bottom: 4px solid #42A5F5;
1463
box-shadow: none;
1464
background-color: transparent;
1465
}
1466
treeview.view.progressbar:selected {
1468
border-bottom-color: currentColor;
1469
}
1470
treeview.view.trough {
1472
border-bottom: 4px solid rgba(66, 165, 245, 0.3);
1473
box-shadow: none;
1474
background-color: transparent;
1475
}
1476
treeview.view.trough:selected {
1478
border-bottom-color: alpha(currentColor, 0.3);
1479
}
1480
treeview.view header button {
1482
padding: 2px 6px;
1483
border-style: none solid solid none;
1484
border-width: 1px;
1485
border-color: rgba(0, 0, 0, 0.1);
1486
border-radius: 0;
1487
background-clip: border-box;
1488
}
1489
treeview.view header button, treeview.view header button:hover, treeview.view header button:active {
1491
box-shadow: none;
1492
}
1493
treeview.view header button, treeview.view header button:disabled {
1495
background-color: #FFFFFF;
1496
}
1497
treeview.view header button:last-child {
1499
border-right-style: none;
1500
}
1501
treeview.view button.dnd,
1503
treeview.view header.button.dnd {
1504
padding: 2px 6px;
1505
border-style: none solid solid;
1506
border-width: 1px;
1507
border-color: rgba(0, 0, 0, 0.1);
1508
border-radius: 0;
1509
box-shadow: none;
1510
background-color: #FFFFFF;
1511
background-clip: border-box;
1512
color: #42A5F5;
1513
}
1514
treeview.view acceleditor > label {
1516
background-color: #42A5F5;
1517
}
1518
/*********
1520
* Menus *
1521
*********/
1522
menubar,
1523
.menubar {
1524
-GtkWidget-window-dragging: true;
1525
padding: 0;
1526
background-color: #E0E0E0;
1527
}
1528
menubar > menuitem,
1530
.menubar > menuitem {
1531
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
1532
min-height: 20px;
1533
padding: 4px 8px;
1534
color: rgba(0, 0, 0, 0.6);
1535
}
1536
menubar > menuitem:hover,
1538
.menubar > menuitem:hover {
1539
transition: none;
1540
background-color: alpha(currentColor, 0.15);
1541
color: rgba(0, 0, 0, 0.8);
1542
}
1543
menubar > menuitem:disabled,
1545
.menubar > menuitem:disabled {
1546
color: rgba(0, 0, 0, 0.24);
1547
}
1548
.csd.popup {
1550
border-radius: 2px;
1551
}
1552
menu,
1554
.menu,
1555
.context-menu {
1556
margin: 4px 0;
1557
padding: 4px 0;
1558
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
1559
background-color: #FFFFFF;
1560
border: 1px solid rgba(0, 0, 0, 0.1);
1561
}
1562
.csd menu, .csd
1564
.menu, .csd
1565
.context-menu {
1566
border: none;
1567
border-radius: 2px;
1568
}
1569
menu menuitem,
1571
.menu menuitem,
1572
.context-menu menuitem {
1573
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
1574
min-height: 20px;
1575
min-width: 40px;
1576
padding: 4px 8px;
1577
font: initial;
1578
text-shadow: none;
1579
}
1580
menu menuitem:hover,
1582
.menu menuitem:hover,
1583
.context-menu menuitem:hover {
1584
transition: none;
1585
background-color: alpha(currentColor, 0.15);
1586
}
1587
menu menuitem:disabled,
1589
.menu menuitem:disabled,
1590
.context-menu menuitem:disabled {
1591
color: rgba(0, 0, 0, 0.32);
1592
}
1593
menu menuitem arrow,
1595
.menu menuitem arrow,
1596
.context-menu menuitem arrow {
1597
min-height: 16px;
1598
min-width: 16px;
1599
}
1600
menu menuitem arrow:dir(ltr),
1602
.menu menuitem arrow:dir(ltr),
1603
.context-menu menuitem arrow:dir(ltr) {
1604
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1605
margin-left: 8px;
1606
}
1607
menu menuitem arrow:dir(rtl),
1609
.menu menuitem arrow:dir(rtl),
1610
.context-menu menuitem arrow:dir(rtl) {
1611
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl");
1612
margin-right: 8px;
1613
}
1614
menu menuitem label:dir(rtl), menu menuitem label:dir(ltr),
1616
.menu menuitem label:dir(rtl),
1617
.menu menuitem label:dir(ltr),
1618
.context-menu menuitem label:dir(rtl),
1619
.context-menu menuitem label:dir(ltr) {
1620
color: inherit;
1621
}
1622
menu > arrow,
1624
.menu > arrow,
1625
.context-menu > arrow {
1626
min-height: 16px;
1627
min-width: 16px;
1628
padding: 4px;
1629
border-radius: 0;
1630
background-color: #FFFFFF;
1631
color: rgba(0, 0, 0, 0.6);
1632
}
1633
menu > arrow.top,
1635
.menu > arrow.top,
1636
.context-menu > arrow.top {
1637
margin-top: -4px;
1638
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
1639
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
1640
}
1641
menu > arrow.bottom,
1643
.menu > arrow.bottom,
1644
.context-menu > arrow.bottom {
1645
margin-bottom: -4px;
1646
border-top: 1px solid rgba(0, 0, 0, 0.1);
1647
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1648
}
1649
menu > arrow:hover,
1651
.menu > arrow:hover,
1652
.context-menu > arrow:hover {
1653
background-image: image(alpha(currentColor, 0.15));
1654
color: rgba(0, 0, 0, 0.8);
1655
}
1656
menu > arrow:disabled,
1658
.menu > arrow:disabled,
1659
.context-menu > arrow:disabled {
1660
border-color: transparent;
1661
background-color: transparent;
1662
color: transparent;
1663
}
1664
menu separator,
1666
.menu separator,
1667
.context-menu separator {
1668
margin: 4px 0;
1669
}
1670
menuitem accelerator {
1672
color: alpha(currentColor, 0.6);
1673
}
1674
.popup:not(.csd) menu menuitem {
1676
color: #333333;
1677
}
1678
.popup:not(.csd) menu menuitem:hover {
1680
background-color: #e0e0e0;
1681
}
1682
.popup:not(.csd) menu menuitem:disabled {
1684
color: #adadad;
1685
}
1686
.popup:not(.csd) menu accelerator {
1688
color: #858585;
1689
}
1690
/************
1692
* Popovers *
1693
************/
1694
popover.background {
1695
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1696
padding: 2px;
1697
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
1698
background-color: #FAFAFA;
1699
}
1700
popover.background:backdrop {
1702
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1703
}
1704
popover.background, .csd popover.background {
1706
border-style: solid;
1707
border-width: 1px;
1708
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3);
1709
border-radius: 3px;
1710
}
1711
popover.background > stack {
1713
margin: -4px;
1714
}
1715
popover.background > toolbar {
1717
margin: -2px;
1718
}
1719
popover.background > list,
1721
popover.background > .view,
1722
popover.background > toolbar {
1723
border-style: none;
1724
box-shadow: none;
1725
background-color: transparent;
1726
}
1727
popover.background.menu button,
1729
popover.background button.model {
1730
min-height: 32px;
1731
padding: 0 8px;
1732
border-radius: 2px;
1733
}
1734
popover.background separator {
1736
margin: 4px 0;
1737
}
1738
popover.background list separator {
1740
margin: 0;
1741
}
1742
/*************
1744
* Notebooks *
1745
*************/
1746
notebook > header {
1747
border-width: 1px;
1748
border-color: rgba(0, 0, 0, 0.1);
1749
background-color: #F5F5F5;
1750
background-clip: border-box;
1751
}
1752
notebook > header.top {
1754
border-bottom-style: solid;
1755
}
1756
notebook > header.top > tabs {
1758
margin-bottom: -1px;
1759
}
1760
notebook > header.top > tabs > tab:hover {
1762
box-shadow: inset 0 -2px alpha(currentColor, 0.3);
1763
}
1764
notebook > header.top > tabs > tab:checked {
1766
box-shadow: inset 0 -2px #42A5F5;
1767
}
1768
notebook > header.bottom {
1770
border-top-style: solid;
1771
}
1772
notebook > header.bottom > tabs {
1774
margin-top: -1px;
1775
}
1776
notebook > header.bottom > tabs > tab:hover {
1778
box-shadow: inset 0 2px alpha(currentColor, 0.3);
1779
}
1780
notebook > header.bottom > tabs > tab:checked {
1782
box-shadow: inset 0 2px #42A5F5;
1783
}
1784
notebook > header.left {
1786
border-right-style: solid;
1787
}
1788
notebook > header.left > tabs {
1790
margin-right: -1px;
1791
}
1792
notebook > header.left > tabs > tab:hover {
1794
box-shadow: inset -2px 0 alpha(currentColor, 0.3);
1795
}
1796
notebook > header.left > tabs > tab:checked {
1798
box-shadow: inset -2px 0 #42A5F5;
1799
}
1800
notebook > header.right {
1802
border-left-style: solid;
1803
}
1804
notebook > header.right > tabs {
1806
margin-left: -1px;
1807
}
1808
notebook > header.right > tabs > tab:hover {
1810
box-shadow: inset 2px 0 alpha(currentColor, 0.3);
1811
}
1812
notebook > header.right > tabs > tab:checked {
1814
box-shadow: inset 2px 0 #42A5F5;
1815
}
1816
notebook > header.top > tabs > arrow {
1818
border-top-style: none;
1819
}
1820
notebook > header.bottom > tabs > arrow {
1822
border-bottom-style: none;
1823
}
1824
notebook > header.top > tabs > arrow, notebook > header.bottom > tabs > arrow {
1826
padding-left: 4px;
1827
padding-right: 4px;
1828
}
1829
notebook > header.top > tabs > arrow.down, notebook > header.bottom > tabs > arrow.down {
1831
margin-left: -8px;
1832
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
1833
}
1834
notebook > header.top > tabs > arrow.up, notebook > header.bottom > tabs > arrow.up {
1836
margin-right: -8px;
1837
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1838
}
1839
notebook > header.left > tabs > arrow {
1841
border-left-style: none;
1842
}
1843
notebook > header.right > tabs > arrow {
1845
border-right-style: none;
1846
}
1847
notebook > header.left > tabs > arrow, notebook > header.right > tabs > arrow {
1849
padding-top: 4px;
1850
padding-bottom: 4px;
1851
}
1852
notebook > header.left > tabs > arrow.down, notebook > header.right > tabs > arrow.down {
1854
margin-top: -8px;
1855
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
1856
}
1857
notebook > header.left > tabs > arrow.up, notebook > header.right > tabs > arrow.up {
1859
margin-bottom: -8px;
1860
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1861
}
1862
notebook > header > tabs > arrow {
1864
min-height: 16px;
1865
min-width: 16px;
1866
border-radius: 0;
1867
}
1868
notebook > header tab {
1870
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
1871
min-height: 24px;
1872
min-width: 24px;
1873
padding: 6px 12px;
1874
outline-offset: -6px;
1875
border-width: 1px;
1876
border-color: transparent;
1877
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 10%, transparent 0%);
1878
background-repeat: no-repeat;
1879
background-position: center;
1880
background-size: 0% 0%;
1881
color: rgba(0, 0, 0, 0.6);
1882
font-weight: 500;
1883
}
1884
notebook > header tab:hover {
1886
color: rgba(0, 0, 0, 0.8);
1887
}
1888
notebook > header tab:hover.reorderable-page {
1890
border-color: rgba(0, 0, 0, 0.1);
1891
background-color: #FAFAFA;
1892
}
1893
notebook > header tab:disabled {
1895
color: rgba(0, 0, 0, 0.24);
1896
}
1897
notebook > header tab:checked {
1899
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);
1900
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
1901
background-size: 1000% 1000%;
1902
color: rgba(0, 0, 0, 0.8);
1903
}
1904
notebook > header tab:checked:disabled {
1906
color: rgba(0, 0, 0, 0.32);
1907
}
1908
notebook > header tab:checked.reorderable-page {
1910
border-color: rgba(0, 0, 0, 0.1);
1911
background-color: #FFFFFF;
1912
}
1913
notebook > header tab button.flat:last-child {
1915
margin-left: 6px;
1916
margin-right: -6px;
1917
}
1918
notebook > header tab button.flat:first-child {
1920
margin-left: -6px;
1921
margin-right: 6px;
1922
}
1923
notebook > header.top tabs, notebook > header.bottom tabs {
1925
padding-left: 8px;
1926
padding-right: 8px;
1927
}
1928
notebook > header.top tabs:not(:only-child):first-child, notebook > header.bottom tabs:not(:only-child):first-child {
1930
margin-left: 0;
1931
}
1932
notebook > header.top tabs:not(:only-child):last-child, notebook > header.bottom tabs:not(:only-child):last-child {
1934
margin-right: 0;
1935
}
1936
notebook > header.top tabs tab.reorderable-page, notebook > header.bottom tabs tab.reorderable-page {
1938
margin: 0 -1px;
1939
border-style: none solid;
1940
}
1941
notebook > header.left tabs, notebook > header.right tabs {
1943
padding-top: 8px;
1944
padding-bottom: 8px;
1945
}
1946
notebook > header.left tabs:not(:only-child):first-child, notebook > header.right tabs:not(:only-child):first-child {
1948
margin-top: 0;
1949
}
1950
notebook > header.left tabs:not(:only-child):last-child, notebook > header.right tabs:not(:only-child):last-child {
1952
margin-bottom: 0;
1953
}
1954
notebook > header.left tabs tab.reorderable-page, notebook > header.right tabs tab.reorderable-page {
1956
margin: -1px 0;
1957
border-style: solid none;
1958
}
1959
notebook > stack:not(:only-child) {
1961
background-color: #FFFFFF;
1962
}
1963
/**************
1965
* Scrollbars *
1966
**************/
1967
scrollbar {
1968
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1969
background-color: #FFFFFF;
1970
background-clip: padding-box;
1971
}
1972
* {
1974
-GtkScrollbar-has-backward-stepper: false;
1975
-GtkScrollbar-has-forward-stepper: false;
1976
}
1977
scrollbar.top {
1979
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
1980
}
1981
scrollbar.bottom {
1983
border-top: 1px solid rgba(0, 0, 0, 0.1);
1984
}
1985
scrollbar.left {
1987
border-right: 1px solid rgba(0, 0, 0, 0.1);
1988
}
1989
scrollbar.right {
1991
border-left: 1px solid rgba(0, 0, 0, 0.1);
1992
}
1993
scrollbar slider {
1995
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0;
1996
min-width: 8px;
1997
min-height: 8px;
1998
border: 4px solid transparent;
1999
border-radius: 9999px;
2000
background-clip: padding-box;
2001
background-color: rgba(0, 0, 0, 0.48);
2002
}
2003
scrollbar slider:hover {
2005
background-color: rgba(0, 0, 0, 0.6);
2006
}
2007
scrollbar slider:active {
2009
background-color: rgba(0, 0, 0, 0.8);
2010
}
2011
scrollbar slider:disabled {
2013
background-color: rgba(0, 0, 0, 0.192);
2014
}
2015
scrollbar.fine-tune slider {
2017
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0, min-width 0, min-height 0;
2018
min-width: 4px;
2019
min-height: 4px;
2020
}
2021
scrollbar.fine-tune.horizontal slider {
2023
margin: 2px 0;
2024
}
2025
scrollbar.fine-tune.vertical slider {
2027
margin: 0 2px;
2028
}
2029
scrollbar.overlay-indicator:not(.dragging):not(.hovering) {
2031
border-color: transparent;
2032
background-color: transparent;
2033
}
2034
scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider {
2036
min-width: 4px;
2037
min-height: 4px;
2038
margin: 3px;
2039
border: 1px solid rgba(255, 255, 255, 0.3);
2040
}
2041
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button {
2043
min-width: 4px;
2044
min-height: 4px;
2045
margin: 3px;
2046
border: 1px solid rgba(255, 255, 255, 0.3);
2047
border-radius: 9999px;
2048
background-color: rgba(0, 0, 0, 0.48);
2049
background-clip: padding-box;
2050
-gtk-icon-source: none;
2051
}
2052
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled {
2054
background-color: rgba(0, 0, 0, 0.192);
2055
}
2056
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider {
2058
min-width: 24px;
2059
}
2060
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal button {
2062
min-width: 8px;
2063
}
2064
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider {
2066
min-height: 24px;
2067
}
2068
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button {
2070
min-height: 8px;
2071
}
2072
scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering {
2074
background-color: rgba(255, 255, 255, 0.9);
2075
}
2076
scrollbar.horizontal slider {
2078
min-width: 24px;
2079
}
2080
scrollbar.vertical slider {
2082
min-height: 24px;
2083
}
2084
scrollbar button {
2086
min-width: 16px;
2087
min-height: 16px;
2088
padding: 0;
2089
border-radius: 0;
2090
}
2091
scrollbar.vertical button.down {
2093
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
2094
}
2095
scrollbar.vertical button.up {
2097
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
2098
}
2099
scrollbar.horizontal button.down {
2101
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
2102
}
2103
scrollbar.horizontal button.up {
2105
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
2106
}
2107
/**********
2109
* Switch *
2110
**********/
2111
switch {
2112
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2113
margin: 6px 0;
2114
border: 4px solid transparent;
2115
border-radius: 9999px;
2116
background-color: alpha(currentColor, 0.3);
2117
background-clip: padding-box;
2118
font-size: 0;
2119
}
2120
switch:disabled {
2122
color: alpha(currentColor, 0.4);
2123
}
2124
switch:checked {
2126
background-color: rgba(255, 64, 129, 0.5);
2127
}
2128
switch:checked:disabled {
2130
background-color: rgba(255, 64, 129, 0.2);
2131
color: rgba(0, 0, 0, 0.32);
2132
}
2133
switch slider {
2135
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
2136
border-image: none;
2137
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2138
background-color: #FFFFFF;
2139
color: rgba(0, 0, 0, 0.8);
2140
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0;
2141
min-width: 24px;
2142
min-height: 24px;
2143
margin: -4px 0 -4px -4px;
2144
border-radius: 9999px;
2145
-gtk-outline-radius: 9999px;
2146
}
2147
switch:hover slider {
2149
border-image: none;
2150
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2151
}
2152
switch:checked slider {
2154
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;
2155
animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1);
2156
margin: -4px -4px -4px 0;
2157
background-color: #FF4081;
2158
color: #FFFFFF;
2159
}
2160
switch:disabled slider {
2162
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2163
background-color: #FAFAFA;
2164
color: rgba(0, 0, 0, 0.32);
2165
}
2166
switch:checked:disabled slider {
2168
animation: none;
2169
}
2170
/*************************
2172
* Check and Radio items *
2173
*************************/
2174
.view.content-view.check:not(list),
2175
.content-view .tile check:not(list) {
2176
min-height: 40px;
2177
min-width: 40px;
2178
margin: 0;
2179
padding: 0;
2180
box-shadow: none;
2181
background-color: transparent;
2182
background-image: none;
2183
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2184
}
2185
.view.content-view.check:not(list):hover, .view.content-view.check:not(list):active,
2187
.content-view .tile check:not(list):hover,
2188
.content-view .tile check:not(list):active {
2189
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2190
}
2191
.view.content-view.check:not(list),
2193
.content-view .tile check:not(list) {
2194
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-unchecked.png"), url("assets/selectionmode-checkbox-unchecked@2.png"));
2195
}
2196
.view.content-view.check:not(list):checked,
2198
.content-view .tile check:not(list):checked {
2199
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-checked.png"), url("assets/selectionmode-checkbox-checked@2.png"));
2200
}
2201
checkbutton.text-button,
2203
radiobutton.text-button {
2204
padding: 2px;
2205
outline-offset: 0;
2206
}
2207
checkbutton.text-button label:not(:only-child),
2209
radiobutton.text-button label:not(:only-child) {
2210
margin: 0 4px;
2211
}
2212
check,
2214
radio {
2215
min-height: 24px;
2216
min-width: 24px;
2217
margin: -12px;
2218
padding: 12px;
2219
}
2220
check:checked, check:indeterminate,
2222
radio:checked,
2223
radio:indeterminate {
2224
color: #FF4081;
2225
}
2226
check:checked:disabled, check:indeterminate:disabled,
2228
radio:checked:disabled,
2229
radio:indeterminate:disabled {
2230
color: rgba(255, 64, 129, 0.4);
2231
}
2232
row check:not(:checked):not(:indeterminate), row
2234
radio:not(:checked):not(:indeterminate) {
2235
color: alpha(currentColor, 0.75);
2236
}
2237
row check:not(:checked):not(:indeterminate):hover, row check:not(:checked):not(:indeterminate):active, row
2239
radio:not(:checked):not(:indeterminate):hover, row
2240
radio:not(:checked):not(:indeterminate):active {
2241
color: currentColor;
2242
}
2243
row check:not(:checked):not(:indeterminate):disabled, row
2245
radio:not(:checked):not(:indeterminate):disabled {
2246
color: alpha(currentColor, 0.3);
2247
}
2248
menu menuitem check, menu menuitem
2250
radio {
2251
transition: none;
2252
min-height: 16px;
2253
min-width: 16px;
2254
margin: 0;
2255
padding: 0;
2256
}
2257
menu menuitem check:dir(ltr), menu menuitem
2259
radio:dir(ltr) {
2260
margin-right: 8px;
2261
}
2262
menu menuitem check:dir(rtl), menu menuitem
2264
radio:dir(rtl) {
2265
margin-left: 8px;
2266
}
2267
menu menuitem check:not(:checked):not(:indeterminate), menu menuitem
2269
radio:not(:checked):not(:indeterminate) {
2270
color: alpha(currentColor, 0.6);
2271
}
2272
menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem
2274
radio, menu menuitem
2275
radio:hover, menu menuitem
2276
radio:disabled {
2277
box-shadow: none;
2278
}
2279
check {
2282
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.symbolic.png")));
2283
}
2284
check:checked {
2287
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.symbolic.png")));
2288
}
2289
check:indeterminate {
2292
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.symbolic.png")));
2293
}
2294
radio {
2297
border-image-slice: 24;
2298
border-image-width: 24px;
2299
}
2300
radio {
2303
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.symbolic.png")));
2304
}
2305
radio:indeterminate {
2308
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-mixed-symbolic.symbolic.png")));
2309
}
2310
radio {
2313
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent));
2314
}
2315
radio:checked:not(:indeterminate) {
2318
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.10417, to(#FF4081), to(transparent));
2319
}
2320
radio:checked:not(:indeterminate):disabled {
2323
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.10417, to(rgba(255, 64, 129, 0.4)), to(transparent));
2324
}
2325
window.background:not(.csd) > widget > checkbutton > check,
2327
menu menuitem check {
2328
border-radius: 2px;
2329
-gtk-outline-radius: 2px;
2330
-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")));
2331
}
2332
window.background:not(.csd) > widget > checkbutton > check:checked,
2334
menu menuitem check:checked {
2335
-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")));
2336
}
2337
window.background:not(.csd) > widget > checkbutton > check:indeterminate,
2339
menu menuitem check:indeterminate {
2340
-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")));
2341
}
2342
window.background:not(.csd) > widget > radiobutton > radio,
2344
menu menuitem radio {
2345
border-image: none;
2346
-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")));
2347
}
2348
window.background:not(.csd) > widget > radiobutton > radio:checked,
2350
menu menuitem radio:checked {
2351
-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")));
2352
}
2353
window.background:not(.csd) > widget > radiobutton > radio:indeterminate,
2355
menu menuitem radio:indeterminate {
2356
-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")));
2357
}
2358
check:not(:checked):active {
2360
-gtk-icon-transform: rotate(90deg);
2361
}
2362
check:not(:checked):indeterminate:active,
2364
radio:not(:checked):indeterminate:active {
2365
-gtk-icon-transform: scaleX(-1);
2366
}
2367
check:not(:checked),
2369
radio:not(:checked) {
2370
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;
2371
}
2372
check:not(:checked):active,
2374
radio:not(:checked):active {
2375
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0, -gtk-icon-transform 0;
2376
}
2377
menu menuitem check:not(:checked), menu menuitem
2379
radio:not(:checked) {
2380
transition: none;
2381
}
2382
treeview.view check,
2384
treeview.view radio {
2385
padding: 0;
2386
}
2387
treeview.view check:hover,
2389
treeview.view radio:hover {
2390
box-shadow: inset 0 0 0 9999px alpha(rgba(0, 0, 0, 0.8), 0.05);
2391
}
2392
treeview.view check:hover:disabled,
2394
treeview.view radio:hover:disabled {
2395
box-shadow: none;
2396
}
2397
treeview.view check:hover:selected,
2399
treeview.view radio:hover:selected {
2400
box-shadow: inset 0 0 0 9999px alpha(#FFFFFF, 0.05);
2401
}
2402
treeview.view check,
2404
treeview.view radio {
2405
color: rgba(0, 0, 0, 0.6);
2406
}
2407
treeview.view check:hover, treeview.view check:active,
2409
treeview.view radio:hover,
2410
treeview.view radio:active {
2411
color: rgba(0, 0, 0, 0.8);
2412
}
2413
treeview.view check:disabled,
2415
treeview.view radio:disabled {
2416
color: rgba(0, 0, 0, 0.24);
2417
}
2418
treeview.view check:checked, treeview.view check:indeterminate,
2420
treeview.view radio:checked,
2421
treeview.view radio:indeterminate {
2422
color: #FF4081;
2423
}
2424
treeview.view check:checked:disabled, treeview.view check:indeterminate:disabled,
2426
treeview.view radio:checked:disabled,
2427
treeview.view radio:indeterminate:disabled {
2428
color: rgba(255, 64, 129, 0.4);
2429
}
2430
treeview.view check:selected,
2432
treeview.view radio:selected {
2433
color: rgba(255, 255, 255, 0.75);
2434
}
2435
treeview.view check:selected:hover, treeview.view check:selected:active,
2437
treeview.view radio:selected:hover,
2438
treeview.view radio:selected:active {
2439
color: #FFFFFF;
2440
}
2441
treeview.view check:selected:disabled,
2443
treeview.view radio:selected:disabled {
2444
color: rgba(255, 255, 255, 0.3);
2445
}
2446
treeview.view check:selected:checked, treeview.view check:selected:indeterminate,
2448
treeview.view radio:selected:checked,
2449
treeview.view radio:selected:indeterminate {
2450
color: #FF4081;
2451
}
2452
treeview.view check:selected:checked:disabled, treeview.view check:selected:indeterminate:disabled,
2454
treeview.view radio:selected:checked:disabled,
2455
treeview.view radio:selected:indeterminate:disabled {
2456
color: rgba(255, 64, 129, 0.4);
2457
}
2458
treeview.view radio:checked {
2460
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-checked-symbolic.symbolic.png")));
2461
border-image: none;
2462
}
2463
/************
2465
* GtkScale *
2466
************/
2467
scale {
2468
min-height: 12px;
2469
min-width: 12px;
2470
padding: 12px;
2471
}
2472
scale * {
2474
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2475
}
2476
scale slider {
2478
min-height: 24px;
2479
min-width: 24px;
2480
margin: -10px;
2481
}
2482
scale trough {
2484
outline-offset: 2px;
2485
background-color: alpha(currentColor, 0.3);
2486
}
2487
scale trough:disabled {
2489
color: rgba(0, 0, 0, 0.32);
2490
}
2491
scale highlight {
2493
background-color: #FF4081;
2494
}
2495
scale highlight:disabled {
2497
background-color: transparent;
2498
}
2499
scale fill {
2501
background-color: alpha(currentColor, 0.3);
2502
}
2503
scale fill:disabled {
2505
background-color: transparent;
2506
}
2507
scale slider {
2509
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
2510
background-repeat: no-repeat;
2511
background-position: center;
2512
background-size: calc(100% - 8px);
2513
}
2514
scale slider {
2516
background-image: -gtk-scaled(url("assets/scale-slider.png"), url("assets/scale-slider@2.png"));
2517
}
2518
scale slider:disabled {
2520
background-image: -gtk-scaled(url("assets/scale-slider-disabled.png"), url("assets/scale-slider-disabled@2.png"));
2521
}
2522
scale slider:hover {
2524
background-size: calc(100% - 4px);
2525
}
2526
scale slider:active {
2528
background-size: calc(100% - 0px);
2529
}
2530
scale.fine-tune slider {
2532
background-size: calc(100% - 12px);
2533
}
2534
scale value {
2536
color: alpha(currentColor, 0.6);
2537
}
2538
scale marks {
2540
color: alpha(currentColor, 0.3);
2541
}
2542
scale marks.top {
2544
margin-bottom: 8px;
2545
margin-top: -16px;
2546
}
2547
scale marks.bottom {
2549
margin-top: 8px;
2550
margin-bottom: -16px;
2551
}
2552
scale marks.top {
2554
margin-right: 8px;
2555
margin-left: -16px;
2556
}
2557
scale marks.bottom {
2559
margin-left: 8px;
2560
margin-right: -16px;
2561
}
2562
scale.horizontal indicator {
2564
min-height: 8px;
2565
min-width: 1px;
2566
}
2567
scale.vertical indicator {
2569
min-height: 1px;
2570
min-width: 8px;
2571
}
2572
scale.horizontal.marks-before:not(.marks-after) slider {
2574
min-height: 30px;
2575
min-width: 24px;
2576
margin-top: -16px;
2577
background-position: center calc(100% - 4px);
2578
}
2579
scale.horizontal.marks-before:not(.marks-after) slider {
2581
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider.png"), url("assets/scale-horz-marks-before-slider@2.png"));
2582
}
2583
scale.horizontal.marks-before:not(.marks-after) slider:disabled {
2585
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider-disabled.png"), url("assets/scale-horz-marks-before-slider-disabled@2.png"));
2586
}
2587
scale.horizontal.marks-before:not(.marks-after) slider:hover {
2589
background-position: center calc(100% - 2px);
2590
}
2591
scale.horizontal.marks-before:not(.marks-after) slider:active {
2593
background-position: center calc(100% - 0px);
2594
}
2595
scale.horizontal.marks-before:not(.marks-after).fine-tune slider {
2597
background-position: center calc(100% - 6px);
2598
}
2599
scale.horizontal.marks-after:not(.marks-before) slider {
2601
min-height: 30px;
2602
min-width: 24px;
2603
margin-bottom: -16px;
2604
background-position: center calc(4px);
2605
}
2606
scale.horizontal.marks-after:not(.marks-before) slider {
2608
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider.png"), url("assets/scale-horz-marks-after-slider@2.png"));
2609
}
2610
scale.horizontal.marks-after:not(.marks-before) slider:disabled {
2612
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider-disabled.png"), url("assets/scale-horz-marks-after-slider-disabled@2.png"));
2613
}
2614
scale.horizontal.marks-after:not(.marks-before) slider:hover {
2616
background-position: center calc(2px);
2617
}
2618
scale.horizontal.marks-after:not(.marks-before) slider:active {
2620
background-position: center calc(0px);
2621
}
2622
scale.horizontal.marks-after:not(.marks-before).fine-tune slider {
2624
background-position: center calc(6px);
2625
}
2626
scale.vertical.marks-before:not(.marks-after) slider {
2628
min-height: 24px;
2629
min-width: 30px;
2630
margin-left: -16px;
2631
background-position: calc(4px) center;
2632
}
2633
scale.vertical.marks-before:not(.marks-after) slider {
2635
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider.png"), url("assets/scale-vert-marks-before-slider@2.png"));
2636
}
2637
scale.vertical.marks-before:not(.marks-after) slider:disabled {
2639
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider-disabled.png"), url("assets/scale-vert-marks-before-slider-disabled@2.png"));
2640
}
2641
scale.vertical.marks-before:not(.marks-after) slider:hover {
2643
background-position: calc(2px) center;
2644
}
2645
scale.vertical.marks-before:not(.marks-after) slider:active {
2647
background-position: calc(0px) center;
2648
}
2649
scale.vertical.marks-before:not(.marks-after).fine-tune slider {
2651
background-position: calc(6px) center;
2652
}
2653
scale.vertical.marks-after:not(.marks-before) slider {
2655
min-height: 24px;
2656
min-width: 30px;
2657
margin-right: -16px;
2658
background-position: calc(100% - 4px) center;
2659
}
2660
scale.vertical.marks-after:not(.marks-before) slider {
2662
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider.png"), url("assets/scale-vert-marks-after-slider@2.png"));
2663
}
2664
scale.vertical.marks-after:not(.marks-before) slider:disabled {
2666
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider-disabled.png"), url("assets/scale-vert-marks-after-slider-disabled@2.png"));
2667
}
2668
scale.vertical.marks-after:not(.marks-before) slider:hover {
2670
background-position: calc(100% - 2px) center;
2671
}
2672
scale.vertical.marks-after:not(.marks-before) slider:active {
2674
background-position: calc(100% - 0px) center;
2675
}
2676
scale.vertical.marks-after:not(.marks-before).fine-tune slider {
2678
background-position: calc(100% - 6px) center;
2679
}
2680
scale.color {
2682
min-height: 0;
2683
min-width: 0;
2684
}
2685
scale.color.horizontal {
2687
padding: 0 0 12px 0;
2688
}
2689
scale.color.horizontal slider:dir(ltr), scale.color.horizontal slider:dir(rtl) {
2691
margin-bottom: -12px;
2692
margin-top: -2px;
2693
}
2694
scale.color.vertical:dir(ltr) {
2696
padding: 0 0 0 12px;
2697
}
2698
scale.color.vertical:dir(ltr) slider {
2700
margin-left: -12px;
2701
margin-right: -2px;
2702
}
2703
scale.color.vertical:dir(rtl) {
2705
padding: 0 12px 0 0;
2706
}
2707
scale.color.vertical:dir(rtl) slider {
2709
margin-right: -12px;
2710
margin-left: -2px;
2711
}
2712
/*****************
2714
* Progress bars *
2715
*****************/
2716
progressbar {
2717
color: rgba(0, 0, 0, 0.48);
2718
font-size: smaller;
2719
}
2720
progressbar.horizontal trough,
2722
progressbar.horizontal progress {
2723
min-height: 4px;
2724
}
2725
progressbar.vertical trough,
2727
progressbar.vertical progress {
2728
min-width: 4px;
2729
}
2730
progressbar trough {
2732
background-color: rgba(66, 165, 245, 0.3);
2733
}
2734
progressbar progress {
2736
background-color: #42A5F5;
2737
}
2738
progressbar trough.empty progress {
2740
all: unset;
2741
}
2742
/*************
2744
* Level Bar *
2745
*************/
2746
levelbar block {
2747
min-width: 36px;
2748
min-height: 4px;
2749
}
2750
levelbar.vertical block {
2752
min-width: 4px;
2753
min-height: 36px;
2754
}
2755
levelbar trough {
2757
padding: 2px;
2758
border-radius: 2px;
2759
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
2760
border-image: none;
2761
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2762
background-color: #FFFFFF;
2763
color: rgba(0, 0, 0, 0.8);
2764
}
2765
levelbar trough:disabled {
2767
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2768
background-color: #FAFAFA;
2769
color: rgba(0, 0, 0, 0.32);
2770
}
2771
levelbar.horizontal.discrete block {
2773
margin: 0 1px;
2774
}
2775
levelbar.horizontal.discrete trough {
2777
padding: 2px 1px;
2778
}
2779
levelbar.vertical.discrete block {
2781
margin: 1px 0;
2782
}
2783
levelbar.vertical.discrete trough {
2785
padding: 1px 2px;
2786
}
2787
levelbar block.low {
2789
background-color: #FF6D00;
2790
}
2791
levelbar block.high, levelbar block:not(.empty) {
2793
background-color: #42A5F5;
2794
}
2795
levelbar block.full {
2797
background-color: #00C853;
2798
}
2799
levelbar block.empty {
2801
background-color: alpha(currentColor, 0.3);
2802
color: rgba(0, 0, 0, 0.32);
2803
}
2804
/****************
2806
* Print dialog *
2807
*****************/
2808
printdialog paper {
2809
padding: 0;
2810
border: 1px solid rgba(0, 0, 0, 0.1);
2811
background-color: #FFFFFF;
2812
color: rgba(0, 0, 0, 0.8);
2813
}
2814
printdialog .dialog-action-box {
2816
margin: 12px;
2817
}
2818
/**********
2820
* Frames *
2821
**********/
2822
frame > border,
2823
.frame {
2824
margin: 0;
2825
padding: 0;
2826
border: 1px solid rgba(0, 0, 0, 0.1);
2827
border-radius: 0;
2828
box-shadow: none;
2829
}
2830
frame > border.flat,
2832
.frame.flat,
2833
frame.flat > border {
2834
border-style: none;
2835
}
2836
actionbar > revealer > box {
2838
padding: 6px;
2839
border-top: 1px solid rgba(0, 0, 0, 0.1);
2840
}
2841
scrolledwindow viewport.frame {
2843
border-style: none;
2844
}
2845
overshoot.top {
2847
background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2848
background-repeat: no-repeat;
2849
background-position: center top;
2850
background-color: transparent;
2851
border: none;
2852
box-shadow: none;
2853
}
2854
overshoot.bottom {
2856
background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2857
background-repeat: no-repeat;
2858
background-position: center bottom;
2859
background-color: transparent;
2860
border: none;
2861
box-shadow: none;
2862
}
2863
overshoot.left {
2865
background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2866
background-repeat: no-repeat;
2867
background-position: left center;
2868
background-color: transparent;
2869
border: none;
2870
box-shadow: none;
2871
}
2872
overshoot.right {
2874
background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2875
background-repeat: no-repeat;
2876
background-position: right center;
2877
background-color: transparent;
2878
border: none;
2879
box-shadow: none;
2880
}
2881
undershoot.top {
2883
background-color: transparent;
2884
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
2885
padding-top: 1px;
2886
background-size: 12px 1px;
2887
background-repeat: repeat-x;
2888
background-origin: content-box;
2889
background-position: left top;
2890
}
2891
undershoot.bottom {
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-bottom: 1px;
2896
background-size: 12px 1px;
2897
background-repeat: repeat-x;
2898
background-origin: content-box;
2899
background-position: left bottom;
2900
}
2901
undershoot.left {
2903
background-color: transparent;
2904
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
2905
padding-left: 1px;
2906
background-size: 1px 12px;
2907
background-repeat: repeat-y;
2908
background-origin: content-box;
2909
background-position: left top;
2910
}
2911
undershoot.right {
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-right: 1px;
2916
background-size: 1px 12px;
2917
background-repeat: repeat-y;
2918
background-origin: content-box;
2919
background-position: right top;
2920
}
2921
junction {
2923
border-style: solid none none solid;
2924
border-width: 1px;
2925
border-color: rgba(0, 0, 0, 0.1);
2926
background-color: #FFFFFF;
2927
}
2928
junction:dir(rtl) {
2930
border-style: solid solid none none;
2931
}
2932
separator {
2934
min-width: 1px;
2935
min-height: 1px;
2936
background-color: rgba(0, 0, 0, 0.1);
2937
}
2938
/*********
2940
* Lists *
2941
*********/
2942
list {
2943
border-color: rgba(0, 0, 0, 0.1);
2944
background-color: #FFFFFF;
2945
}
2946
list row {
2948
padding: 2px;
2949
}
2950
row.activatable, .view, treeview.view header button {
2952
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);
2953
box-shadow: inset 0 0 0 9999px transparent;
2954
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
2955
background-repeat: no-repeat;
2956
background-position: center;
2957
background-size: 1000% 1000%;
2958
}
2959
row.activatable:hover, .view:hover, treeview.view header button:hover {
2961
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);
2962
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.05);
2963
}
2964
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 {
2966
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, background-size 0, background-image 0;
2967
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
2968
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
2969
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
2970
background-size: 0% 0%;
2971
}
2972
/*********************
2974
* App Notifications *
2975
*********************/
2976
.app-notification {
2977
margin: 8px;
2978
}
2979
.app-notification.frame,
2981
.app-notification border {
2982
border-style: none;
2983
}
2984
/*************
2986
* Expanders *
2987
*************/
2988
expander arrow {
2989
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
2990
min-width: 16px;
2991
min-height: 16px;
2992
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
2993
-gtk-icon-transform: rotate(-90deg);
2994
color: rgba(0, 0, 0, 0.6);
2995
}
2996
expander arrow:dir(rtl) {
2998
-gtk-icon-transform: rotate(90deg);
2999
}
3000
expander arrow:checked {
3002
-gtk-icon-transform: unset;
3003
}
3004
expander arrow:hover, expander arrow:active {
3006
color: rgba(0, 0, 0, 0.8);
3007
}
3008
expander arrow:disabled {
3010
color: rgba(0, 0, 0, 0.24);
3011
}
3012
expander arrow:selected {
3014
color: rgba(255, 255, 255, 0.75);
3015
}
3016
expander arrow:selected:hover, expander arrow:selected:active {
3018
color: #FFFFFF;
3019
}
3020
expander arrow:selected:disabled {
3022
color: rgba(255, 255, 255, 0.3);
3023
}
3024
/************
3026
* Calendar *
3027
************/
3028
calendar {
3029
padding: 1px;
3030
border: 1px solid rgba(0, 0, 0, 0.1);
3031
color: rgba(0, 0, 0, 0.8);
3032
}
3033
calendar:disabled {
3035
color: rgba(0, 0, 0, 0.32);
3036
}
3037
calendar:selected {
3039
border-radius: 3px;
3040
}
3041
calendar.header {
3043
border-style: none none solid;
3044
border-radius: 0;
3045
}
3046
calendar.highlight {
3048
color: alpha(currentColor, 0.6);
3049
font-weight: 500;
3050
}
3051
calendar:indeterminate {
3053
color: alpha(currentColor, 0.4);
3054
}
3055
/***********
3057
* Dialogs *
3058
***********/
3059
messagedialog.background {
3060
background-color: #FAFAFA;
3061
}
3062
messagedialog .titlebar {
3064
min-height: 24px;
3065
border-style: none;
3066
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
3067
background-color: #FAFAFA;
3068
color: rgba(0, 0, 0, 0.8);
3069
}
3070
messagedialog .titlebar:backdrop {
3072
color: rgba(0, 0, 0, 0.6);
3073
}
3074
messagedialog.csd.background {
3076
border-bottom-left-radius: 2px;
3077
border-bottom-right-radius: 2px;
3078
}
3079
messagedialog.csd .dialog-action-area button {
3081
padding: 8px 16px;
3082
border-top: 1px solid rgba(0, 0, 0, 0.1);
3083
border-radius: 0;
3084
}
3085
messagedialog.csd .dialog-action-area button:first-child {
3087
border-bottom-left-radius: 2px;
3088
}
3089
messagedialog.csd .dialog-action-area button:last-child {
3091
border-bottom-right-radius: 2px;
3092
}
3093
filechooser .dialog-action-box {
3095
border-top: 1px solid rgba(0, 0, 0, 0.1);
3096
}
3097
filechooser #pathbarbox {
3099
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3100
background-color: #F5F5F5;
3101
}
3102
filechooserbutton:drop(active) {
3104
box-shadow: none;
3105
}
3106
/***********
3108
* Sidebar *
3109
***********/
3110
.sidebar {
3111
border-style: none;
3112
background-color: #FAFAFA;
3113
}
3114
stacksidebar.sidebar:dir(ltr) list, stacksidebar.sidebar.left list, stacksidebar.sidebar.left:dir(rtl) list, .sidebar:dir(ltr), .sidebar.left, .sidebar.left:dir(rtl) {
3116
border-right: 1px solid rgba(0, 0, 0, 0.1);
3117
border-left-style: none;
3118
}
3119
stacksidebar.sidebar:dir(rtl) list, stacksidebar.sidebar.right list, .sidebar:dir(rtl), .sidebar.right {
3121
border-left: 1px solid rgba(0, 0, 0, 0.1);
3122
border-right-style: none;
3123
}
3124
.sidebar list {
3126
background-color: transparent;
3127
}
3128
paned .sidebar.left, paned .sidebar.right, paned .sidebar.left:dir(rtl), paned .sidebar:dir(rtl), paned .sidebar:dir(ltr), paned .sidebar {
3130
border-style: none;
3131
}
3132
stacksidebar row {
3134
padding: 10px 4px;
3135
}
3136
stacksidebar row > label {
3138
padding-left: 6px;
3139
padding-right: 6px;
3140
}
3141
/****************
3143
* File chooser *
3144
****************/
3145
placessidebar > viewport.frame {
3146
border-style: none;
3147
}
3148
placessidebar list {
3150
padding: 1px 0 4px;
3151
}
3152
placessidebar row {
3154
min-height: 32px;
3155
margin: -1px 0;
3156
padding: 0;
3157
}
3158
placessidebar row > revealer {
3160
padding: 0 12px;
3161
}
3162
placessidebar row:selected {
3164
color: #FFFFFF;
3165
}
3166
placessidebar row:disabled {
3168
color: rgba(0, 0, 0, 0.32);
3169
}
3170
placessidebar row image.sidebar-icon {
3172
opacity: 0.6;
3173
}
3174
placessidebar row image.sidebar-icon:dir(ltr) {
3176
padding-right: 8px;
3177
}
3178
placessidebar row image.sidebar-icon:dir(rtl) {
3180
padding-left: 8px;
3181
}
3182
placessidebar row label.sidebar-label:dir(ltr) {
3184
padding-right: 2px;
3185
}
3186
placessidebar row label.sidebar-label:dir(rtl) {
3188
padding-left: 2px;
3189
}
3190
placessidebar row.sidebar-placeholder-row {
3192
min-height: 2px;
3193
padding: 0 8px;
3194
background-image: image(#FF4081);
3195
background-clip: content-box;
3196
}
3197
placessidebar row.sidebar-new-bookmark-row {
3199
color: #FF4081;
3200
}
3201
placessidebar row:drop(active):not(:disabled) {
3203
box-shadow: inset 0 0 0 2px #FF4081;
3204
}
3205
placesview .server-list-button > image {
3207
-gtk-icon-transform: rotate(0turn);
3208
}
3209
placesview .server-list-button:checked > image {
3211
-gtk-icon-transform: rotate(-0.5turn);
3212
}
3213
placesview > actionbar > revealer > box > label {
3215
padding-left: 8px;
3216
padding-right: 8px;
3217
}
3218
/*********
3220
* Paned *
3221
*********/
3222
paned > separator {
3223
min-width: 1px;
3224
min-height: 1px;
3225
-gtk-icon-source: none;
3226
border-style: none;
3227
background-color: transparent;
3228
background-image: image(rgba(0, 0, 0, 0.1));
3229
background-size: 1px 1px;
3230
background-clip: content-box;
3231
}
3232
paned > separator.wide {
3234
min-width: 6px;
3235
min-height: 6px;
3236
background-color: #F5F5F5;
3237
background-image: image(rgba(0, 0, 0, 0.1)), image(rgba(0, 0, 0, 0.1));
3238
background-size: 1px 1px, 1px 1px;
3239
}
3240
paned.horizontal > separator {
3242
background-repeat: repeat-y;
3243
}
3244
paned.horizontal > separator:dir(ltr) {
3246
margin: 0 -8px 0 0;
3247
padding: 0 8px 0 0;
3248
background-position: left;
3249
}
3250
paned.horizontal > separator:dir(rtl) {
3252
margin: 0 0 0 -8px;
3253
padding: 0 0 0 8px;
3254
background-position: right;
3255
}
3256
paned.horizontal > separator.wide {
3258
margin: 0;
3259
padding: 0;
3260
background-repeat: repeat-y, repeat-y;
3261
background-position: left, right;
3262
}
3263
paned.vertical > separator {
3265
margin: 0 0 -8px 0;
3266
padding: 0 0 8px 0;
3267
background-repeat: repeat-x;
3268
background-position: top;
3269
}
3270
paned.vertical > separator.wide {
3272
margin: 0;
3273
padding: 0;
3274
background-repeat: repeat-x, repeat-x;
3275
background-position: bottom, top;
3276
}
3277
/**************
3279
* GtkInfoBar *
3280
**************/
3281
infobar {
3282
border-style: none;
3283
}
3284
infobar.info {
3286
background-color: #66BB6A;
3287
}
3288
infobar.question {
3290
background-color: #42A5F5;
3291
}
3292
infobar.warning {
3294
background-color: #FFA726;
3295
}
3296
infobar.error {
3298
background-color: #EF5350;
3299
}
3300
infobar.info > label, infobar.info, infobar.question > label, infobar.question, infobar.warning > label, infobar.warning, infobar.error > label, infobar.error {
3302
color: #FFFFFF;
3303
}
3304
/************
3306
* Tooltips *
3307
************/
3308
tooltip {
3309
border-radius: 2px;
3310
box-shadow: none;
3311
}
3312
tooltip.background {
3314
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
3315
background-color: rgba(255, 255, 255, 0.9);
3316
}
3317
tooltip:not(.csd):not(.unity-csd) {
3319
border: 1px solid rgba(0, 0, 0, 0.1);
3320
border-radius: 3px;
3321
background-clip: padding-box;
3322
}
3323
tooltip decoration {
3325
background-color: transparent;
3326
}
3327
tooltip label {
3329
min-height: 20px;
3330
padding: 0 2px;
3331
}
3332
/*****************
3334
* Color Chooser *
3335
*****************/
3336
colorswatch.top {
3337
border-top-left-radius: 2.5px;
3338
border-top-right-radius: 2.5px;
3339
}
3340
colorswatch.top overlay {
3342
border-top-left-radius: 2px;
3343
border-top-right-radius: 2px;
3344
}
3345
colorswatch.bottom {
3347
border-bottom-left-radius: 2.5px;
3348
border-bottom-right-radius: 2.5px;
3349
}
3350
colorswatch.bottom overlay {
3352
border-bottom-left-radius: 2px;
3353
border-bottom-right-radius: 2px;
3354
}
3355
colorswatch.left, colorswatch:first-child:not(.top) {
3357
border-top-left-radius: 2.5px;
3358
border-bottom-left-radius: 2.5px;
3359
}
3360
colorswatch.left overlay, colorswatch:first-child:not(.top) overlay {
3362
border-top-left-radius: 2px;
3363
border-bottom-left-radius: 2px;
3364
}
3365
colorswatch.right, colorswatch:last-child:not(.bottom) {
3367
border-top-right-radius: 2.5px;
3368
border-bottom-right-radius: 2.5px;
3369
}
3370
colorswatch.right overlay, colorswatch:last-child:not(.bottom) overlay {
3372
border-top-right-radius: 2px;
3373
border-bottom-right-radius: 2px;
3374
}
3375
colorswatch.dark overlay {
3377
color: #FFFFFF;
3378
}
3379
colorswatch.light overlay {
3381
color: rgba(0, 0, 0, 0.8);
3382
}
3383
colorswatch.dark {
3385
color: #FFFFFF;
3386
}
3387
colorswatch.light {
3389
color: rgba(0, 0, 0, 0.8);
3390
}
3391
colorswatch:drop(active) {
3393
box-shadow: none;
3394
}
3395
colorswatch:drop(active).light overlay {
3397
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;
3398
}
3399
colorswatch:drop(active).dark overlay {
3401
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;
3402
}
3403
colorswatch overlay {
3405
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3406
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3407
}
3408
colorswatch overlay:hover {
3410
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3411
}
3412
colorswatch#add-color-button {
3414
border-radius: 2px 2px 0 0;
3415
color: #FFFFFF;
3416
}
3417
colorswatch#add-color-button:only-child {
3419
border-radius: 2px;
3420
}
3421
colorswatch#add-color-button overlay {
3423
background-image: linear-gradient(to right, #EF5350 25%, #FFA726 25%, #FFA726 50%, #66BB6A 50%, #66BB6A 75%, #42A5F5 75%);
3424
color: #FFFFFF;
3425
}
3426
colorswatch:disabled {
3428
opacity: 0.4;
3429
}
3430
colorswatch:disabled overlay {
3432
box-shadow: none;
3433
}
3434
colorswatch#editor-color-sample {
3436
border-radius: 2.5px;
3437
}
3438
colorswatch#editor-color-sample overlay {
3440
border-radius: 2px;
3441
}
3442
colorchooser .popover.osd {
3444
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3445
border-radius: 2px;
3446
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);
3447
background-color: #FFFFFF;
3448
}
3449
colorchooser .popover.osd:backdrop {
3451
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);
3452
}
3453
/********
3455
* Misc *
3456
********/
3457
.content-view {
3458
background-color: #F5F5F5;
3459
}
3460
/**********************
3462
* Window Decorations *
3463
**********************/
3464
decoration {
3465
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3466
border-radius: 2px 2px 0 0;
3467
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent;
3468
margin: 8px;
3469
}
3470
decoration:backdrop {
3472
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent;
3473
}
3474
.maximized decoration,
3476
.fullscreen decoration,
3477
.tiled decoration {
3478
border-radius: 0;
3479
}
3480
.popup decoration {
3482
box-shadow: none;
3483
}
3484
.ssd decoration {
3486
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16);
3487
}
3488
.csd.popup decoration {
3490
border-radius: 2px;
3491
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3492
}
3493
tooltip.csd decoration {
3495
border-radius: 2px;
3496
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3497
}
3498
messagedialog.csd decoration {
3500
border-radius: 2px;
3501
}
3502
.solid-csd decoration {
3504
margin: 0;
3505
border-radius: 0;
3506
box-shadow: none;
3507
background-color: #E0E0E0;
3508
}
3509
.view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3511
entry selection, modelbutton.flat:selected,
3512
.menuitem.button.flat:selected, popover.background.menu button:checked,
3513
popover.background button.model:checked, row:selected, calendar:selected, text:selected {
3514
background-color: #42A5F5;
3515
}
3516
row:selected label, label:selected, .view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3518
entry selection, modelbutton.flat:selected,
3519
.menuitem.button.flat:selected, popover.background.menu button:checked,
3520
popover.background button.model:checked, row:selected, calendar:selected, text:selected {
3521
color: #FFFFFF;
3522
}
3523
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,
3525
entry selection:disabled, modelbutton.flat:disabled:selected,
3526
.menuitem.button.flat:disabled:selected, popover.background.menu button:disabled:checked,
3527
popover.background button.model:disabled:checked, row:disabled:selected, calendar:disabled:selected, text:disabled:selected {
3528
color: rgba(255, 255, 255, 0.4);
3529
}
3530
.monospace {
3532
font-family: monospace;
3533
}
3534
/**********************
3536
* Touch Copy & Paste *
3537
**********************/
3538
cursor-handle {
3539
border-radius: 9999px;
3540
background-color: #FF4081;
3541
background-image: none;
3542
}
3543
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) {
3545
padding-left: 6px;
3546
border-top-right-radius: 0;
3547
}
3548
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) {
3550
padding-right: 6px;
3551
border-top-left-radius: 0;
3552
}
3553
cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) {
3555
-GtkWidget-text-handle-width: 24;
3556
-GtkWidget-text-handle-height: 30;
3557
-gtk-icon-source: -gtk-scaled(url("assets/scale-horz-marks-before-slider.png"), url("assets/scale-horz-marks-before-slider@2.png"));
3558
}
3559
.context-menu {
3561
font: initial;
3562
}
3563
.keycap {
3565
min-width: 12px;
3566
min-height: 26px;
3567
margin-top: 2px;
3568
padding-bottom: 2px;
3569
padding-left: 8px;
3570
padding-right: 8px;
3571
border: solid 1px rgba(0, 0, 0, 0.1);
3572
border-radius: 3px;
3573
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.1);
3574
background-color: #FFFFFF;
3575
color: rgba(0, 0, 0, 0.8);
3576
font-size: smaller;
3577
}
3578
:not(decoration):not(window):drop(active) {
3580
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
3581
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;
3582
caret-color: #FF4081;
3583
}
3584
stackswitcher button.text-button {
3586
min-width: 100px;
3587
}
3588
stackswitcher button.circular,
3590
stackswitcher button.text-button.circular {
3591
min-width: 36px;
3592
min-height: 36px;
3593
padding: 0;
3594
}
3595
/************
3597
* Nautilus *
3598
************/
3599
.nautilus-window,
3600
.nautilus-window notebook,
3601
.nautilus-window notebook > stack {
3602
background-color: #FFFFFF;
3603
}
3604
.nautilus-desktop.nautilus-canvas-item:not(:selected), .caja-desktop.caja-canvas-item:not(:selected) {
3606
color: #FFFFFF;
3607
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3608
}
3609
@keyframes needs_attention_keyframes {
3611
to {
3612
background-color: alpha(currentColor, 0.3);
3613
}
3614
}
3615
.nautilus-operations-button-needs-attention {
3617
animation: needs_attention_keyframes 0.3s cubic-bezier(0.4, 0, 0.2, 1) 2 alternate;
3618
}
3619
.nautilus-operations-button-needs-attention-multiple {
3621
animation: needs_attention_keyframes 0.3s cubic-bezier(0.4, 0, 0.2, 1) 4 alternate;
3622
}
3623
.nautilus-window .floating-bar {
3625
min-height: 32px;
3626
padding: 0;
3627
border-style: solid solid none;
3628
border-width: 1px;
3629
border-color: rgba(0, 0, 0, 0.1);
3630
border-radius: 3px 3px 0 0;
3631
background-color: #FFFFFF;
3632
background-clip: padding-box;
3633
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), border-width 0;
3634
}
3635
.nautilus-window .floating-bar.bottom.left {
3637
margin-right: 7px;
3638
border-left-style: none;
3639
border-top-left-radius: 0;
3640
}
3641
.nautilus-window .floating-bar.bottom.right {
3643
margin-left: 7px;
3644
border-right-style: none;
3645
border-top-right-radius: 0;
3646
}
3647
.nautilus-window .floating-bar button {
3649
margin: 4px;
3650
}
3651
.disk-space-display.unknown {
3653
background-color: #FF6D00;
3654
}
3655
.disk-space-display.used {
3657
background-color: #42A5F5;
3658
}
3659
.disk-space-display.free {
3661
background-color: alpha(currentColor, 0.3);
3662
color: rgba(0, 0, 0, 0.32);
3663
}
3664
.documents-entry-tag, .photos-entry-tag {
3666
margin: 3px -2px 3px 8px;
3667
padding: 0 8px;
3668
border-radius: 9999px;
3669
box-shadow: none;
3670
background-color: #42A5F5;
3671
color: #FFFFFF;
3672
}
3673
.documents-entry-tag:hover, .photos-entry-tag:hover {
3675
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3676
}
3677
.documents-entry-tag.button, .button.photos-entry-tag {
3679
margin: 0 -2px;
3680
padding: 4px;
3681
border-radius: 9999px;
3682
box-shadow: none;
3683
color: rgba(255, 255, 255, 0.75);
3684
}
3685
.documents-entry-tag.button:hover, .button.photos-entry-tag:hover, .documents-entry-tag.button:active, .button.photos-entry-tag:active {
3687
color: #FFFFFF;
3688
}
3689
.nautilus-window searchbar {
3691
border-top: 1px solid rgba(0, 0, 0, 0.1);
3692
}
3693
.nautilus-window .searchbar-container {
3695
margin-top: -1px;
3696
}
3697
.nautilus-window paned > separator {
3699
background-color: #F5F5F5;
3700
}
3701
/*********
3703
* gedit *
3704
*********/
3705
.open-document-selector-name-label {
3706
font-weight: bold;
3707
}
3708
.open-document-selector-path-label {
3710
color: alpha(currentColor, 0.6);
3711
font-size: smaller;
3712
}
3713
.gedit-document-panel {
3715
background-color: #FAFAFA;
3716
}
3717
.gedit-document-panel row button.flat {
3719
margin-top: 8px;
3720
margin-bottom: 8px;
3721
}
3722
.gedit-document-panel-group-row:not(:first-child) {
3724
border-top: 1px solid rgba(0, 0, 0, 0.1);
3725
}
3726
.gedit-side-panel-paned statusbar {
3728
border-top: 1px solid rgba(0, 0, 0, 0.1);
3729
}
3730
.gedit-search-slider {
3732
margin: 4px 4px 8px;
3733
}
3734
.gedit-search-slider entry:dir(ltr), .gedit-search-slider entry:dir(rtl) {
3736
border-radius: 2px;
3737
}
3738
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag, .gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
3740
all: unset;
3741
color: alpha(currentColor, 0.6);
3742
}
3743
.gedit-search-slider entry:dir(ltr) {
3745
margin-right: -66px;
3746
padding-right: 66px;
3747
}
3748
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag {
3750
margin-left: 6px;
3751
}
3752
.gedit-search-slider entry:dir(ltr) image.right {
3754
margin-right: 0;
3755
}
3756
.gedit-search-slider entry:dir(rtl) {
3758
margin-left: -66px;
3759
padding-left: 66px;
3760
}
3761
.gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
3763
margin-right: 6px;
3764
}
3765
.gedit-search-slider entry:dir(rtl) image.left {
3767
margin-left: 0;
3768
}
3769
.gedit-search-slider entry.error ~ button {
3771
color: rgba(255, 255, 255, 0.75);
3772
}
3773
.gedit-search-slider entry.error ~ button:hover, .gedit-search-slider entry.error ~ button:active {
3775
color: #FFFFFF;
3776
}
3777
.gedit-search-slider entry.error ~ button:disabled {
3779
color: rgba(255, 255, 255, 0.3);
3780
}
3781
.gedit-search-slider button {
3783
border: solid 6px transparent;
3784
}
3785
.gedit-search-slider button:last-child:dir(ltr), .gedit-search-slider button:not(:first-child):dir(rtl) {
3787
margin-left: -3px;
3788
}
3789
.gedit-search-slider button:first-child:dir(rtl), .gedit-search-slider button:not(:last-child):dir(ltr) {
3791
margin-right: -3px;
3792
}
3793
frame.gedit-map-frame > border:dir(ltr) {
3795
border-style: none none none solid;
3796
}
3797
frame.gedit-map-frame > border:dir(rtl) {
3799
border-style: none solid none none;
3800
}
3801
/**************
3803
* Tweak Tool *
3804
**************/
3805
.tweak-categories {
3806
background-image: image(#FAFAFA);
3807
}
3808
.tweak-categories separator {
3810
min-width: 0;
3811
min-height: 0;
3812
background-color: transparent;
3813
}
3814
.tweak {
3816
padding: 3px;
3817
}
3818
.tweak.title:hover {
3820
box-shadow: none;
3821
}
3822
.tweak-group-white,
3824
.tweak-white,
3825
.tweak-white:hover {
3826
background-image: image(#FFFFFF);
3827
}
3828
.tweak-startup,
3830
.tweak-startup:hover {
3831
background-image: image(#FFFFFF);
3832
}
3833
.tweak-group-startup {
3835
background-image: image(#FFFFFF);
3836
border: 1px solid rgba(0, 0, 0, 0.1);
3837
}
3838
/***********
3840
* Builder *
3841
***********/
3842
workbench stack.titlebar {
3843
padding: 0;
3844
}
3845
workbench:not(.tiled):not(.maximized):not(.fullscreen) stack.titlebar headerbar {
3847
border-radius: 2px 2px 0 0;
3848
}
3849
perspectiveswitcher {
3851
background-color: #F5F5F5;
3852
}
3853
perspectiveswitcher button:checked {
3855
color: #42A5F5;
3856
}
3857
layouttabbar {
3859
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3860
background-color: #F5F5F5;
3861
}
3862
layouttabbar > box > button {
3864
margin: 2px 0;
3865
}
3866
layouttab {
3868
margin: 0 8px;
3869
border-style: none solid;
3870
border-width: 1px;
3871
border-color: rgba(0, 0, 0, 0.1);
3872
box-shadow: inset 0 -2px #42A5F5;
3873
background-color: #FFFFFF;
3874
}
3875
layouttab separator.vertical {
3877
margin: 8px 4px;
3878
}
3879
layouttab button.text-button, layouttab button.image-button, layouttab button {
3881
margin-top: 8px;
3882
margin-bottom: 8px;
3883
padding: 0 4px;
3884
}
3885
layout {
3887
border: 1px solid rgba(0, 0, 0, 0.1);
3888
-PnlDockBin-handle-size: 1;
3889
}
3890
entry.search-missing {
3892
background-color: #DD2C00;
3893
color: #FFFFFF;
3894
}
3895
workbench treeview.image {
3897
color: alpha(currentColor, 0.6);
3898
}
3899
workbench treeview.image:selected {
3901
color: rgba(255, 255, 255, 0.6);
3902
}
3903
dockbin {
3905
border: 1px solid rgba(0, 0, 0, 0.1);
3906
-PnlDockBin-handle-size: 1;
3907
}
3908
dockpaned {
3910
border: 1px solid rgba(0, 0, 0, 0.1);
3911
}
3912
eggsearchbar box.search-bar {
3914
padding: 0 8px;
3915
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3916
background-color: #F5F5F5;
3917
}
3918
docktabstrip {
3920
padding: 0 8px;
3921
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3922
background-color: #F5F5F5;
3923
}
3924
docktab {
3926
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
3927
min-height: 24px;
3928
min-width: 24px;
3929
margin-bottom: -1px;
3930
padding: 6px 6px;
3931
outline-offset: -6px;
3932
border-width: 1px;
3933
border-color: transparent;
3934
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 10%, transparent 0%);
3935
background-repeat: no-repeat;
3936
background-position: center;
3937
background-size: 0% 0%;
3938
color: rgba(0, 0, 0, 0.6);
3939
font-weight: 500;
3940
}
3941
docktab:hover {
3943
box-shadow: inset 0 -2px alpha(currentColor, 0.3);
3944
color: rgba(0, 0, 0, 0.8);
3945
}
3946
docktab:checked {
3948
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);
3949
box-shadow: inset 0 -2px #42A5F5;
3950
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
3951
background-size: 1000% 1000%;
3952
color: rgba(0, 0, 0, 0.8);
3953
}
3954
dockoverlayedge {
3956
background-color: #F5F5F5;
3957
}
3958
dockoverlayedge docktabstrip {
3960
padding: 0;
3961
border: none;
3962
}
3963
dockoverlayedge.left-edge docktab:hover {
3965
box-shadow: inset -2px 0 alpha(currentColor, 0.3);
3966
}
3967
dockoverlayedge.left-edge docktab:checked {
3969
box-shadow: inset -2px 0 #42A5F5;
3970
}
3971
dockoverlayedge.right-edge docktab:hover {
3973
box-shadow: inset 2px 0 alpha(currentColor, 0.3);
3974
}
3975
dockoverlayedge.right-edge docktab:checked {
3977
box-shadow: inset 2px 0 #42A5F5;
3978
}
3979
pillbox {
3981
background-color: #F5F5F5;
3982
border-radius: 2px;
3983
}
3984
buildperspective row {
3986
padding: 10px;
3987
}
3988
layoutpane entry.search {
3990
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.1);
3991
background-color: #FFFFFF;
3992
}
3993
editortweak entry.search {
3995
margin-bottom: -1px;
3996
box-shadow: none;
3997
}
3998
frame.gb-search-frame {
4000
border-bottom-right-radius: 5px;
4001
}
4002
.gb-search-entry-occurrences-tag {
4004
box-shadow: none;
4005
background-color: transparent;
4006
}
4007
docktabstrip {
4009
min-height: 39px;
4010
}
4011
workbench preferences preferencesgroup list entry {
4013
padding-top: 8px;
4014
padding-bottom: 8px;
4015
}
4016
/**********
4018
* Photos *
4019
**********/
4020
GdMainIconView.content-view {
4021
-GdMainIconView-icon-size: 48;
4022
}
4023
.documents-counter {
4025
margin: 8px;
4026
border-radius: 9999px;
4027
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
4028
background-color: #FF4081;
4029
color: #FFFFFF;
4030
font-weight: bold;
4031
}
4032
.documents-scrolledwin.frame {
4034
border-style: none;
4035
}
4036
.photos-fade-in {
4038
opacity: 1;
4039
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
4040
}
4041
.photos-fade-out {
4043
opacity: 0;
4044
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
4045
}
4046
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) {
4048
border-style: none none none solid;
4049
}
4050
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(rtl) {
4052
border-style: none solid none none;
4053
}
4054
/*********
4056
* Music *
4057
*********/
4058
.side-panel:dir(ltr) {
4059
border-style: solid;
4060
border-color: rgba(0, 0, 0, 0.1);
4061
}
4062
.side-panel:dir(rtl) {
4064
border-style: solid;
4065
border-color: rgba(0, 0, 0, 0.1);
4066
}
4067
.side-panel .view {
4069
background-image: image(#FAFAFA);
4070
}
4071
.side-panel .view:hover {
4073
background-image: image(rgba(242, 242, 242, 0.99));
4074
}
4075
.side-panel .view:selected {
4077
background-image: image(#42A5F5);
4078
}
4079
.side-panel .view:selected:hover {
4081
background-image: image(#4baaf6);
4082
}
4083
.songs-list:hover {
4085
background-image: image(alpha(currentColor, 0.05));
4086
}
4087
frame.documents-dropdown {
4089
margin: 8px;
4090
}
4091
frame.documents-dropdown > border {
4093
border: none;
4094
}
4095
box.vertical:not(.titlebar) > revealer > toolbar.search-bar {
4097
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4098
}
4099
box.vertical:not(.titlebar) > revealer > toolbar.search-bar button > widget {
4101
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4102
}
4103
/*********
4105
* To Do *
4106
*********/
4107
task-row {
4108
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
4109
margin: 0 -4px;
4110
}
4111
task-row:hover {
4113
transition: none;
4114
}
4115
task-row label {
4117
margin: 0 8px;
4118
}
4119
task-row image {
4121
margin: 0 4px;
4122
}
4123
task-list-view > box > revealer > box > button {
4125
min-height: 36px;
4126
margin: -4px;
4127
padding: 0 12px;
4128
}
4129
task-list-view > box > revealer > box > button label {
4131
margin: 0 8px;
4132
}
4133
task-list-view > box > revealer > box > button image {
4135
margin: 0 4px;
4136
}
4137
/*******
4139
* eog *
4140
*******/
4141
#eog-thumb-nav scrolledwindow {
4142
border-top: none;
4143
}
4144
#eog-thumb-nav button {
4146
-gtk-outline-radius: 2px;
4147
}
4148
/*************
4150
* Evolution *
4151
*************/
4152
frame.taskbar > border {
4153
border-style: solid none none;
4154
}
4155
box.vertical > paned.horizontal notebook widget .frame {
4157
border-style: none;
4158
}
4159
/********
4161
* gitg *
4162
********/
4163
frame.commit-frame > border {
4164
border-style: solid none none;
4165
}
4166
/**************
4168
* Characters *
4169
**************/
4170
box.dialog-vbox scrolledwindow.related {
4171
border: 1px solid rgba(0, 0, 0, 0.1);
4172
}
4173
list.categories {
4175
background-image: image(#FAFAFA);
4176
}
4177
/**************
4179
* Calculator *
4180
**************/
4181
button.title label {
4182
min-height: 36px;
4183
}
4184
/*********
4186
* Tilix *
4187
*********/
4188
overlay > revealer.left > scrolledwindow.frame,
4189
overlay > revealer.right > scrolledwindow.frame {
4190
border-style: none;
4191
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22);
4192
}
4193
overlay > revealer.left > scrolledwindow.frame {
4195
margin-right: 32px;
4196
}
4197
overlay > revealer.right > scrolledwindow.frame {
4199
margin-left: 32px;
4200
}
4201
.terminix-session-sidebar,
4203
.tilix-session-sidebar {
4204
background-image: image(#FAFAFA);
4205
}
4206
button.image-button.session-new-button {
4208
min-width: 32px;
4209
}
4210
/***********
4212
* Eclipse *
4213
***********/
4214
window.background > box.vertical > scrolledwindow > widget toolbar {
4215
padding: 2px;
4216
}
4217
window.background > box.vertical > scrolledwindow > widget toolbar separator,
4219
window.background > box.vertical > scrolledwindow > widget toolbar button {
4220
margin: 2px;
4221
}
4222
window.background > box.vertical > scrolledwindow > widget toolbar button {
4224
border-radius: 2px;
4225
}
4226
/***********
4228
* Firefox *
4229
***********/
4230
window.background:not(.csd) > widget > separator {
4231
color: rgba(0, 0, 0, 0.2);
4232
}
4233
window.background:not(.csd) > widget > scrollbar {
4235
background-clip: border-box;
4236
}
4237
window.background:not(.csd) > widget > scrollbar,
4239
window.background:not(.csd) > widget > frame > border {
4240
border-color: rgba(0, 0, 0, 0.2);
4241
}
4242
window.background:not(.csd) > widget > entry,
4244
window.background:not(.csd) > widget > button > button {
4245
border: 1px solid rgba(0, 0, 0, 0.2);
4246
border-radius: 3px;
4247
box-shadow: none;
4248
}
4249
window.background:not(.csd) > widget > entry {
4251
min-height: 30px;
4252
}
4253
window.background:not(.csd) > widget > entry:focus {
4255
border-color: #42A5F5;
4256
}
4257
window.background:not(.csd) > widget > button > button {
4259
padding: 4px 8px;
4260
background-size: auto;
4261
}
4262
window.background:not(.csd) > widget > button > button:hover {
4264
background-image: image(alpha(currentColor, 0.05));
4265
}
4266
window.background:not(.csd) > widget > button > button:active {
4268
background-image: image(alpha(currentColor, 0.1));
4269
}
4270
window.background:not(.csd) > window > menu,
4272
window.background:not(.csd) > menu > menu {
4273
border: none;
4274
}
4275
window.background:not(.csd) > widget > menubar {
4277
color: rgba(0, 0, 0, 0.6);
4278
}
4279
window.background:not(.csd) > widget > menubar:hover {
4281
color: rgba(0, 0, 0, 0.8);
4282
}
4283
window.background:not(.csd) > widget > menubar:disabled {
4285
color: rgba(0, 0, 0, 0.24);
4286
}
4287
window.background:not(.csd) > widget > frame {
4289
color: rgba(0, 0, 0, 0.2);
4290
}
4291
window.background:not(.csd) > widget > checkbutton > check,
4293
window.background:not(.csd) > widget > radiobutton > radio {
4294
margin: 0;
4295
padding: 0;
4296
}
4297
window.background:not(.csd) > window.background > menu > separator {
4299
color: rgba(0, 0, 0, 0.1);
4300
}
4301
/***********
4303
* Synapse *
4304
***********/
4305
box.vertical > widget > widget:selected {
4306
background-color: #42A5F5;
4307
}
4308
/*********
4310
* Unity *
4311
*********/
4312
UnityDecoration {
4313
-UnityDecoration-extents: 28px 0 0 0;
4314
-UnityDecoration-input-extents: 8px;
4315
-UnityDecoration-shadow-offset-x: 0;
4316
-UnityDecoration-shadow-offset-y: 3px;
4317
-UnityDecoration-active-shadow-color: rgba(0, 0, 0, 0.48);
4318
-UnityDecoration-active-shadow-radius: 18px;
4319
-UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32);
4320
-UnityDecoration-inactive-shadow-radius: 6px;
4321
-UnityDecoration-glow-size: 8px;
4322
-UnityDecoration-glow-color: #42A5F5;
4323
-UnityDecoration-title-indent: 4px;
4324
-UnityDecoration-title-fade: 32px;
4325
-UnityDecoration-title-alignment: 0.0;
4326
}
4327
UnityDecoration .top {
4329
padding: 0 2px;
4330
border-style: none;
4331
border-radius: 2px 2px 0 0;
4332
box-shadow: inset 0 1px rgba(255, 255, 255, 0.2);
4333
background-color: #cfcfcf;
4334
color: rgba(0, 0, 0, 0.8);
4335
}
4336
UnityDecoration .top:backdrop {
4338
color: rgba(0, 0, 0, 0.6);
4339
}
4340
UnityDecoration .menuitem {
4342
color: alpha(currentColor, 0.75);
4343
}
4344
UnityDecoration .menuitem:hover {
4346
box-shadow: inset 0 -2px #42A5F5;
4347
background-color: transparent;
4348
color: currentColor;
4349
}
4350
.background:not(.csd) headerbar:not(.titlebar) {
4352
border-radius: 0;
4353
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
4354
}
4355
.background:not(.csd) headerbar:not(.titlebar).inline-toolbar {
4357
border-style: none;
4358
}
4359
UnityPanelWidget,
4361
.unity-panel {
4362
background-color: #cfcfcf;
4363
color: rgba(0, 0, 0, 0.8);
4364
}
4365
UnityPanelWidget:backdrop,
4367
.unity-panel:backdrop {
4368
color: rgba(0, 0, 0, 0.6);
4369
}
4370
.unity-panel.menuitem,
4372
.unity-panel .menuitem {
4373
color: alpha(currentColor, 0.75);
4374
}
4375
.unity-panel.menubar.menuitem:hover,
4377
.unity-panel.menubar .menuitem *:hover {
4378
box-shadow: inset 0 -2px #42A5F5;
4379
background-color: transparent;
4380
color: currentColor;
4381
}
4382
.menu IdoPlaybackMenuItem.menuitem:active {
4384
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
4385
animation: spin 1s linear infinite;
4386
color: #42A5F5;
4387
}
4388
/**************
4390
* Mate-Panel *
4391
**************/
4392
.mate-panel-menu-bar menubar,
4393
#PanelApplet-window-menu-applet-button {
4394
background-color: transparent;
4395
}
4396
#PanelPlug,
4398
PanelToplevel.background {
4399
background-color: #cfcfcf;
4400
color: rgba(0, 0, 0, 0.8);
4401
font-weight: 500;
4402
}
4403
PanelToplevel > widget > button {
4405
padding: 0 4px;
4406
border-radius: 0;
4407
}
4408
PanelSeparator {
4410
color: rgba(0, 0, 0, 0.1);
4411
}
4412
MatePanelAppletFrameDBus {
4414
border-style: solid;
4415
border-width: 0 1px;
4416
border-color: rgba(0, 0, 0, 0.1);
4417
}
4418
.mate-panel-menu-bar menubar menuitem {
4420
padding: 4px;
4421
}
4422
.mate-panel-menu-bar menubar menu menuitem {
4424
padding: 6px;
4425
}
4426
.mate-panel-menu-bar #PanelApplet button {
4428
-GtkWidget-window-dragging: true;
4429
padding: 4px;
4430
border-radius: 0;
4431
}
4432
PanelApplet.wnck-applet .wnck-pager {
4434
background-color: transparent;
4435
color: #40C4FF;
4436
}
4437
PanelApplet.wnck-applet .wnck-pager:hover {
4439
background-color: alpha(currentColor, 0.15);
4440
}
4441
PanelApplet.wnck-applet .wnck-pager:active {
4443
background-color: alpha(currentColor, 0.3);
4444
}
4445
PanelApplet.wnck-applet .wnck-pager:selected {
4447
background-color: #42A5F5;
4448
}
4449
#MatePanelPopupWindow {
4451
border: 1px solid rgba(0, 0, 0, 0.1);
4452
border-radius: 3px;
4453
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
4454
}
4455
#MatePanelPopupWindow frame > border {
4457
border-style: none;
4458
}
4459
#MatePanelPopupWindow ClockMap {
4461
border: 1px solid rgba(0, 0, 0, 0.1);
4462
}
4463
na-tray-applet {
4465
-NaTrayApplet-icon-padding: 3px;
4466
-NaTrayApplet-icon-size: 16;
4467
}
4468
.mate-panel-menu-bar {
4470
-PanelMenuBar-icon-visible: true;
4471
}
4472
.mate-panel-applet-slider {
4474
background-color: transparent;
4475
}
4476
.mate-panel-applet-slider frame {
4478
border: 1px solid rgba(0, 0, 0, 0.1);
4479
border-radius: 3px;
4480
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
4481
background-color: #F5F5F5;
4482
}
4483
.mate-panel-applet-slider frame frame {
4485
all: unset;
4486
}
4487
.mate-panel-applet-slider frame > border {
4489
border-style: none;
4490
}
4491
/*********************
4493
* CAJA File manager *
4494
*********************/
4495
.caja-navigation-window button.toggle.image-button {
4496
border-radius: 2px;
4497
}
4498
.caja-pathbar button {
4500
margin: 0 -1px 0 -2px;
4501
}
4502
.caja-pathbar button > widget {
4504
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4505
-GtkArrow-arrow-scaling: 1;
4506
}
4507
.caja-side-pane notebook viewport.frame,
4509
.caja-side-pane notebook widget .vertical {
4510
background-color: #FFFFFF;
4511
}
4512
.caja-side-pane notebook,
4514
.caja-notebook {
4515
border-top: 1px solid rgba(0, 0, 0, 0.1);
4516
}
4517
.caja-side-pane notebook .frame,
4519
.caja-notebook .frame {
4520
border-style: none;
4521
}
4522
.caja-navigation-window statusbar {
4524
margin: 0 -10px;
4525
padding: 0 4px;
4526
border-top: 1px solid rgba(0, 0, 0, 0.1);
4527
}
4528
.caja-notebook frame > border {
4530
border-style: none;
4531
}
4532
#caja-extra-view-widget {
4534
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4535
background-color: #F5F5F5;
4536
}
4537
#caja-extra-view-widget > box > box > label {
4539
font-weight: bold;
4540
}
4541
/*********
4543
* Pluma *
4544
*********/
4545
.pluma-window statusbar {
4546
margin: 0 -10px;
4547
padding: 0 4px;
4548
border-top: 1px solid rgba(0, 0, 0, 0.1);
4549
}
4550
.pluma-window statusbar frame > border {
4552
border-style: none;
4553
}
4554
.pluma-window statusbar frame button.flat {
4556
padding: 0 4px;
4557
border-radius: 0;
4558
}
4559
.pluma-window statusbar frame button.flat widget {
4561
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4562
-GtkArrow-arrow-scaling: 1;
4563
}
4564
.pluma-print-preview toolbar {
4566
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4567
}
4568
.pluma-window paned.horizontal box.vertical box.horizontal button.flat {
4570
margin: 1px;
4571
}
4572
.pluma-window paned.horizontal box.vertical .frame {
4574
border-style: none;
4575
}
4576
.pluma-window paned.horizontal box.vertical notebook.frame {
4578
margin-top: -1px;
4579
border-top: 1px solid rgba(0, 0, 0, 0.1);
4580
}
4581
.pluma-window paned.horizontal box.vertical notebook.frame box.vertical toolbar.horizontal {
4583
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4584
}
4585
/*********
4587
* Atril *
4588
*********/
4589
.atril-window paned.horizontal box.vertical .frame {
4590
border-style: none;
4591
}
4592
.atril-window paned.horizontal box.vertical notebook .frame {
4594
border-top: 1px solid rgba(0, 0, 0, 0.1);
4595
}
4596
/* mate-screensaver lock dialog */
4598
.lock-dialog {
4599
border-radius: 2px;
4600
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);
4601
}
4602
.lock-dialog frame > border {
4604
border-style: none;
4605
}
4606
/************************
4608
* LightDM GTK+ Greeter *
4609
************************/
4610
#panel_window {
4611
background-color: rgba(0, 0, 0, 0.3);
4612
color: #FFFFFF;
4613
}
4614
#panel_window menubar,
4616
#panel_window separator {
4617
background-color: transparent;
4618
}
4619
#panel_window separator {
4621
padding: 0 4px;
4622
}
4623
#panel_window separator:first-child {
4625
padding: 0 8px;
4626
}
4627
#panel_window menubar > menuitem {
4629
color: rgba(255, 255, 255, 0.75);
4630
}
4631
#panel_window menubar > menuitem:hover {
4633
color: #FFFFFF;
4634
}
4635
#panel_window menubar > menuitem:disabled label {
4637
color: rgba(255, 255, 255, 0.3);
4638
}
4639
#login_window,
4641
#shutdown_dialog,
4642
#restart_dialog {
4643
margin: 8px;
4644
border-radius: 2px;
4645
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);
4646
background-color: #FAFAFA;
4647
}
4648
#content_frame {
4650
padding-bottom: 20px;
4651
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4652
}
4653
#buttonbox_frame {
4655
padding-top: 24px;
4656
}
4657
#buttonbox_frame button {
4659
margin: -16px;
4660
}
4661
#greeter_infobar {
4663
margin-top: -1px;
4664
}
4665
/* GTK NAMED COLORS
4667
----------------
4668
use responsibly! */
4669
/*
4670
widget text/foreground color */
4671
@define-color theme_fg_color rgba(0, 0, 0, 0.8);
4672
/*
4673
text color for entries, views and content in general */
4674
@define-color theme_text_color rgba(0, 0, 0, 0.8);
4675
/*
4676
widget base background color */
4677
@define-color theme_bg_color #F5F5F5;
4678
/*
4679
text widgets and the like base background color */
4680
@define-color theme_base_color #FFFFFF;
4681
/*
4682
base background color of selections */
4683
@define-color theme_selected_bg_color #42A5F5;
4684
/*
4685
text/foreground color of selections */
4686
@define-color theme_selected_fg_color #FFFFFF;
4687
/*
4688
base background color of insensitive widgets */
4689
@define-color insensitive_bg_color #F5F5F5;
4690
/*
4691
text foreground color of insensitive widgets */
4692
@define-color insensitive_fg_color rgba(0, 0, 0, 0.32);
4693
/*
4694
insensitive text widgets and the like base background color */
4695
@define-color insensitive_base_color #FAFAFA;
4696
/*
4697
widget text/foreground color on backdrop windows */
4698
@define-color theme_unfocused_fg_color rgba(0, 0, 0, 0.8);
4699
/*
4700
text color for entries, views and content in general on backdrop windows */
4701
@define-color theme_unfocused_text_color rgba(0, 0, 0, 0.8);
4702
/*
4703
widget base background color on backdrop windows */
4704
@define-color theme_unfocused_bg_color #F5F5F5;
4705
/*
4706
text widgets and the like base background color on backdrop windows */
4707
@define-color theme_unfocused_base_color #FFFFFF;
4708
/*
4709
base background color of selections on backdrop windows */
4710
@define-color theme_unfocused_selected_bg_color #42A5F5;
4711
/*
4712
text/foreground color of selections on backdrop windows */
4713
@define-color theme_unfocused_selected_fg_color #FFFFFF;
4714
/*
4715
insensitive color on backdrop windows */
4716
@define-color unfocused_insensitive_color rgba(0, 0, 0, 0.32);
4717
/*
4718
widgets main borders color */
4719
@define-color borders rgba(0, 0, 0, 0.1);
4720
/*
4721
widgets main borders color on backdrop windows */
4722
@define-color unfocused_borders rgba(0, 0, 0, 0.1);
4723
/*
4724
these are pretty self explicative */
4725
@define-color warning_color #FF6D00;
4726
@define-color error_color #DD2C00;
4727
@define-color success_color #00C853;
4728
/*
4729
FIXME this is really an API */
4730
@define-color content_view_bg #FFFFFF;
4731
@define-color placeholder_text_color rgba(128, 128, 128, 0.88);
4732