A fork of the Materia GTK theme.

Important information: Google announced that, from September 2026, Android devices will require ALL apps to be signed by Google, effectively leading to an iOS situation. Value your right to a computer that does what you want; do not tolerate this monopolistic practice! Contact me if you don't understand why it is bad. Click to learn more.

 gtk-light-compact.css

View raw Download
text/plain • 121.26 kiB
ASCII text, with very long lines (417)
        
            
1
@keyframes ripple_effect {
2
to {
3
background-size: 1000% 1000%;
4
}
5
}
6
7
@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
16
* {
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
34
switch:focus slider,
35
notebook:focus tab,
36
*:focus {
37
outline-color: alpha(currentColor, 0.3);
38
}
39
40
/***************
41
* Base States *
42
***************/
43
.background {
44
background-color: #F5F5F5;
45
color: rgba(0, 0, 0, 0.8);
46
}
47
48
/*
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
58
.gtkstyle-fallback {
59
background-color: #F5F5F5;
60
color: rgba(0, 0, 0, 0.8);
61
}
62
63
.gtkstyle-fallback:hover {
64
background-color: #e8e8e8;
65
color: rgba(0, 0, 0, 0.8);
66
}
67
68
.gtkstyle-fallback:active {
69
background-color: gainsboro;
70
color: rgba(0, 0, 0, 0.8);
71
}
72
73
.gtkstyle-fallback:disabled {
74
background-color: #F5F5F5;
75
color: rgba(0, 0, 0, 0.32);
76
}
77
78
.gtkstyle-fallback:selected {
79
background-color: #42A5F5;
80
color: #FFFFFF;
81
}
82
83
.view {
84
background-color: #FFFFFF;
85
color: rgba(0, 0, 0, 0.8);
86
}
87
88
.view:disabled {
89
color: rgba(0, 0, 0, 0.32);
90
}
91
92
textview text {
93
background-color: #FFFFFF;
94
}
95
96
textview border {
97
background-color: #FAFAFA;
98
}
99
100
iconview, .nautilus-canvas-item, .caja-canvas-item {
101
border-radius: 2px;
102
}
103
104
.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
114
flowbox flowboxchild {
115
padding: 4px;
116
border-radius: 2px;
117
}
118
119
.content-view .tile:selected {
120
background-color: transparent;
121
color: inherit;
122
}
123
124
label {
125
caret-color: currentColor;
126
}
127
128
label.separator {
129
color: rgba(0, 0, 0, 0.8);
130
}
131
132
label selection {
133
background-color: #42A5F5;
134
color: #FFFFFF;
135
}
136
137
label:disabled {
138
color: rgba(0, 0, 0, 0.32);
139
}
140
141
tab label:disabled,
142
button label:disabled {
143
color: inherit;
144
}
145
146
.dim-label, label.separator, .titlebar:not(headerbar) .subtitle,
147
headerbar .subtitle {
148
opacity: 0.6;
149
}
150
151
assistant .sidebar {
152
padding: 4px 0;
153
}
154
155
assistant .sidebar label {
156
min-height: 32px;
157
padding: 0 12px;
158
color: rgba(0, 0, 0, 0.48);
159
font-weight: 500;
160
}
161
162
assistant .sidebar label.highlight {
163
color: rgba(0, 0, 0, 0.8);
164
}
165
166
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
170
/*********************
171
* Spinner Animation *
172
*********************/
173
@keyframes spin {
174
to {
175
-gtk-icon-transform: rotate(1turn);
176
}
177
}
178
179
@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
206
spinner {
207
background: none;
208
opacity: 0;
209
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
210
}
211
212
spinner:checked {
213
opacity: 1;
214
animation: spin 1s linear infinite, spin_colors 4s linear infinite;
215
}
216
217
spinner:checked:disabled {
218
opacity: 0.4;
219
}
220
221
/****************
222
* Text Entries *
223
****************/
224
spinbutton:not(.vertical),
225
entry {
226
min-height: 32px;
227
padding: 0 8px;
228
border-radius: 2px;
229
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
230
border-image: none;
231
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
232
background-color: #FFFFFF;
233
color: rgba(0, 0, 0, 0.8);
234
}
235
236
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
242
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
249
spinbutton.flat:not(.vertical), notebook > stack:not(:only-child) entry:not(.search),
250
notebook > stack:not(:only-child) spinbutton:not(.vertical), colorchooser .popover.osd spinbutton:not(.vertical), entry.preferences-search, layoutpane entry.search, editortweak entry.search, #login_window entry,
251
entry.flat {
252
border-radius: 0;
253
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
254
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
255
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
256
background-color: transparent;
257
color: rgba(0, 0, 0, 0.8);
258
}
259
260
spinbutton.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry:focus:not(.search),
261
notebook > stack:not(:only-child) spinbutton:focus:not(.vertical), colorchooser .popover.osd spinbutton:focus:not(.vertical), entry.preferences-search:focus, layoutpane entry.search:focus, editortweak entry.search:focus, #login_window entry:focus,
262
entry.flat:focus {
263
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
264
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
265
}
266
267
spinbutton.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry:disabled:not(.search),
268
notebook > stack:not(:only-child) spinbutton:disabled:not(.vertical), colorchooser .popover.osd spinbutton:disabled:not(.vertical), entry.preferences-search:disabled, layoutpane entry.search:disabled, editortweak entry.search:disabled, #login_window entry:disabled,
269
entry.flat:disabled {
270
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
271
background-color: transparent;
272
color: rgba(0, 0, 0, 0.32);
273
}
274
275
spinbutton:not(.vertical) image,
276
entry image {
277
color: alpha(currentColor, 0.75);
278
}
279
280
spinbutton:not(.vertical) image:hover, spinbutton:not(.vertical) image:active,
281
entry image:hover,
282
entry image:active {
283
color: currentColor;
284
}
285
286
spinbutton:not(.vertical) image:disabled,
287
entry image:disabled {
288
color: alpha(currentColor, 0.6);
289
}
290
291
spinbutton:not(.vertical) image.left,
292
entry image.left {
293
margin-left: 2px;
294
margin-right: 6px;
295
}
296
297
spinbutton:not(.vertical) image.right,
298
entry image.right {
299
margin-left: 6px;
300
margin-right: 2px;
301
}
302
303
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
314
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
325
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
334
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
340
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
347
spinbutton.error.flat:not(.vertical), notebook > stack:not(:only-child) entry.error:not(.search),
348
notebook > stack:not(:only-child) spinbutton.error:not(.vertical), colorchooser .popover.osd spinbutton.error:not(.vertical), entry.error.preferences-search, layoutpane entry.error.search, editortweak entry.error.search, #login_window entry.error,
349
entry.error.flat {
350
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
351
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #DD2C00 0%, transparent 0%) 0 0 0/0 0 0px;
352
box-shadow: inset 0 -1px #DD2C00;
353
background-color: transparent;
354
color: rgba(0, 0, 0, 0.8);
355
}
356
357
spinbutton.error.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry.error:focus:not(.search),
358
notebook > stack:not(:only-child) spinbutton.error:focus:not(.vertical), colorchooser .popover.osd spinbutton.error:focus:not(.vertical), entry.error.preferences-search:focus, layoutpane entry.error.search:focus, editortweak entry.error.search:focus, #login_window entry.error:focus,
359
entry.error.flat:focus {
360
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #DD2C00 100%, transparent 0%) 0 0 2/0 0 2px;
361
box-shadow: inset 0 -1px #DD2C00;
362
}
363
364
spinbutton.error.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry.error:disabled:not(.search),
365
notebook > stack:not(:only-child) spinbutton.error:disabled:not(.vertical), colorchooser .popover.osd spinbutton.error:disabled:not(.vertical), entry.error.preferences-search:disabled, layoutpane entry.error.search:disabled, editortweak entry.error.search:disabled, #login_window entry.error:disabled,
366
entry.error.flat:disabled {
367
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
368
background-color: transparent;
369
color: rgba(0, 0, 0, 0.32);
370
}
371
372
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
381
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
387
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
394
spinbutton.warning.flat:not(.vertical), notebook > stack:not(:only-child) entry.warning:not(.search),
395
notebook > stack:not(:only-child) spinbutton.warning:not(.vertical), colorchooser .popover.osd spinbutton.warning:not(.vertical), entry.warning.preferences-search, layoutpane entry.warning.search, editortweak entry.warning.search, #login_window entry.warning,
396
entry.warning.flat {
397
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
398
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FF6D00 0%, transparent 0%) 0 0 0/0 0 0px;
399
box-shadow: inset 0 -1px #FF6D00;
400
background-color: transparent;
401
color: rgba(0, 0, 0, 0.8);
402
}
403
404
spinbutton.warning.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry.warning:focus:not(.search),
405
notebook > stack:not(:only-child) spinbutton.warning:focus:not(.vertical), colorchooser .popover.osd spinbutton.warning:focus:not(.vertical), entry.warning.preferences-search:focus, layoutpane entry.warning.search:focus, editortweak entry.warning.search:focus, #login_window entry.warning:focus,
406
entry.warning.flat:focus {
407
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FF6D00 100%, transparent 0%) 0 0 2/0 0 2px;
408
box-shadow: inset 0 -1px #FF6D00;
409
}
410
411
spinbutton.warning.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry.warning:disabled:not(.search),
412
notebook > stack:not(:only-child) spinbutton.warning:disabled:not(.vertical), colorchooser .popover.osd spinbutton.warning:disabled:not(.vertical), entry.warning.preferences-search:disabled, layoutpane entry.warning.search:disabled, editortweak entry.warning.search:disabled, #login_window entry.warning:disabled,
413
entry.warning.flat:disabled {
414
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
415
background-color: transparent;
416
color: rgba(0, 0, 0, 0.32);
417
}
418
419
spinbutton:not(.vertical) progress,
420
entry progress {
421
margin: 2px -6px;
422
border-bottom: 2px solid #42A5F5;
423
background-color: transparent;
424
}
425
426
.linked:not(.vertical) > spinbutton.flat:not(.vertical), notebook > stack:not(:only-child) .linked:not(.vertical) > entry:not(.search),
427
notebook > stack:not(:only-child) .linked:not(.vertical) > spinbutton:not(.vertical), colorchooser .popover.osd .linked:not(.vertical) > spinbutton:not(.vertical), .linked:not(.vertical) > entry.preferences-search, layoutpane .linked:not(.vertical) > entry.search, editortweak .linked:not(.vertical) > entry.search, #login_window .linked:not(.vertical) > entry,
428
.linked.vertical > spinbutton.flat:not(.vertical), notebook > stack:not(:only-child)
429
.linked.vertical > entry:not(.search),
430
notebook > stack:not(:only-child)
431
.linked.vertical > spinbutton:not(.vertical), colorchooser .popover.osd
432
.linked.vertical > spinbutton:not(.vertical),
433
.linked.vertical > entry.preferences-search, layoutpane
434
.linked.vertical > entry.search, editortweak
435
.linked.vertical > entry.search, #login_window
436
.linked.vertical > entry, .linked:not(.vertical) >
437
entry.flat,
438
.linked.vertical >
439
entry.flat {
440
border-radius: 0;
441
}
442
443
treeview entry.flat, treeview entry {
444
min-height: 0;
445
padding: 2px;
446
border-radius: 0;
447
background-color: #FFFFFF;
448
}
449
450
treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:focus {
451
border-image: none;
452
box-shadow: none;
453
}
454
455
/***********
456
* Buttons *
457
***********/
458
@keyframes needs_attention {
459
from {
460
background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent));
461
}
462
to {
463
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#FF4081), to(transparent));
464
}
465
}
466
467
468
button {
469
min-height: 24px;
470
min-width: 16px;
471
padding: 4px 8px;
472
border-radius: 2px;
473
font-weight: 500;
474
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1), background-size 0.5s cubic-bezier(0, 0, 0.2, 1), background-image 1s cubic-bezier(0, 0, 0.2, 1);
475
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 0 0 9999px transparent;
476
background-color: #FAFAFA;
477
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
478
background-repeat: no-repeat;
479
background-position: center;
480
background-size: 1000% 1000%;
481
color: rgba(0, 0, 0, 0.6);
482
}
483
484
485
button:hover {
486
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 0 0 9999px transparent;
487
color: rgba(0, 0, 0, 0.8);
488
}
489
490
491
button:active {
492
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
493
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
494
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), inset 0 0 0 9999px alpha(currentColor, 0.15);
495
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
496
background-size: 0% 0%;
497
color: rgba(0, 0, 0, 0.8);
498
}
499
500
501
button:disabled {
502
box-shadow: none;
503
background-color: alpha(currentColor, 0.3);
504
color: rgba(0, 0, 0, 0.24);
505
}
506
507
508
button:checked {
509
background-color: #42A5F5;
510
color: #FFFFFF;
511
}
512
513
514
button:checked:disabled {
515
background-color: alpha(currentColor, 0.3);
516
color: rgba(66, 165, 245, 0.4);
517
}
518
519
modelbutton.flat,
520
.menuitem.button.flat, spinbutton:not(.vertical) button, spinbutton.vertical button, popover.background.menu button,
521
popover.background button.model, notebook > header > tabs > arrow, scrollbar button, check,
522
radio, calendar.button, messagedialog.csd .dialog-action-area button, button.sidebar-button, .gedit-search-slider button, popover.messagepopover .popover-action-area button, PanelToplevel > widget > button, .lightdm-gtk-greeter button, :not(headerbar) .caja-pathbar button, .caja-pathbar :not(headerbar) button, :not(headerbar)
523
.path-bar button, layouttabbar button, .mate-panel-menu-bar #PanelApplet button:not(.flat), toolbar button, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
524
headerbar button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button,
525
button.flat {
526
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0.5s cubic-bezier(0, 0, 0.2, 1), background-image 1s cubic-bezier(0, 0, 0.2, 1);
527
box-shadow: inset 0 0 0 9999px transparent;
528
background-color: transparent;
529
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
530
background-repeat: no-repeat;
531
background-position: center;
532
background-size: 1000% 1000%;
533
color: alpha(currentColor, 0.75);
534
}
535
536
modelbutton.flat:hover,
537
.menuitem.button.flat:hover, spinbutton:not(.vertical) button:hover, spinbutton.vertical button:hover, popover.background.menu button:hover,
538
popover.background button.model:hover, notebook > header > tabs > arrow:hover, scrollbar button:hover, check:hover,
539
radio:hover, calendar.button:hover, messagedialog.csd .dialog-action-area button:hover, button.sidebar-button:hover, .gedit-search-slider button:hover, popover.messagepopover .popover-action-area button:hover, PanelToplevel > widget > button:hover, .lightdm-gtk-greeter button:hover, :not(headerbar) .caja-pathbar button:hover, .caja-pathbar :not(headerbar) button:hover, :not(headerbar)
540
.path-bar button:hover, layouttabbar button:hover, .mate-panel-menu-bar #PanelApplet button:hover:not(.flat), toolbar button:hover, .titlebar:not(headerbar) button:hover:not(.suggested-action):not(.destructive-action),
541
headerbar button:hover:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:hover:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:hover,
542
button.flat:hover {
543
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
544
color: currentColor;
545
}
546
547
modelbutton.flat:active,
548
.menuitem.button.flat:active, spinbutton:not(.vertical) button:active, spinbutton.vertical button:active, popover.background.menu button:active,
549
popover.background button.model:active, notebook > header > tabs > arrow:active, scrollbar button:active, check:active,
550
radio:active, calendar.button:active, messagedialog.csd .dialog-action-area button:active, button.sidebar-button:active, .gedit-search-slider button:active, popover.messagepopover .popover-action-area button:active, PanelToplevel > widget > button:active, .lightdm-gtk-greeter button:active, :not(headerbar) .caja-pathbar button:active, .caja-pathbar :not(headerbar) button:active, :not(headerbar)
551
.path-bar button:active, layouttabbar button:active, .mate-panel-menu-bar #PanelApplet button:active:not(.flat), toolbar button:active, .titlebar:not(headerbar) button:active:not(.suggested-action):not(.destructive-action),
552
headerbar button:active:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:active:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:active,
553
button.flat:active {
554
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
555
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
556
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
557
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
558
background-size: 0% 0%;
559
color: currentColor;
560
}
561
562
modelbutton.flat:disabled,
563
.menuitem.button.flat:disabled, spinbutton:not(.vertical) button:disabled, spinbutton.vertical button:disabled, popover.background.menu button:disabled,
564
popover.background button.model:disabled, notebook > header > tabs > arrow:disabled, scrollbar button:disabled, check:disabled,
565
radio:disabled, calendar.button:disabled, messagedialog.csd .dialog-action-area button:disabled, button.sidebar-button:disabled, .gedit-search-slider button:disabled, popover.messagepopover .popover-action-area button:disabled, PanelToplevel > widget > button:disabled, .lightdm-gtk-greeter button:disabled, :not(headerbar) .caja-pathbar button:disabled, .caja-pathbar :not(headerbar) button:disabled, :not(headerbar)
566
.path-bar button:disabled, layouttabbar button:disabled, .mate-panel-menu-bar #PanelApplet button:disabled:not(.flat), toolbar button:disabled, .titlebar:not(headerbar) button:disabled:not(.suggested-action):not(.destructive-action),
567
headerbar button:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:disabled:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:disabled,
568
button.flat:disabled {
569
box-shadow: none;
570
background-color: transparent;
571
color: alpha(currentColor, 0.3);
572
}
573
574
:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar)
575
.path-bar button:checked, layouttabbar button:checked, .mate-panel-menu-bar #PanelApplet button:checked:not(.flat), toolbar button:checked, .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action),
576
headerbar button:checked:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked,
577
button.flat:checked {
578
background-color: alpha(currentColor, 0.3);
579
color: currentColor;
580
}
581
582
:not(headerbar) .caja-pathbar button:checked:disabled, .caja-pathbar :not(headerbar) button:checked:disabled, :not(headerbar)
583
.path-bar button:checked:disabled, layouttabbar button:checked:disabled, .mate-panel-menu-bar #PanelApplet button:checked:disabled:not(.flat), toolbar button:checked:disabled, .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action),
584
headerbar button:checked:disabled:not(.suggested-action):not(.destructive-action), actionbar > revealer > box button:checked:disabled:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification button:checked:disabled,
585
button.flat:checked:disabled {
586
background-color: alpha(currentColor, 0.3);
587
color: alpha(currentColor, 0.4);
588
}
589
590
591
button.text-button {
592
padding-left: 16px;
593
padding-right: 16px;
594
}
595
596
597
button.image-button {
598
min-width: 24px;
599
padding: 4px;
600
}
601
602
603
button.text-button.image-button label:first-child {
604
margin-left: 12px;
605
}
606
607
608
button.text-button.image-button label:last-child {
609
margin-right: 12px;
610
}
611
612
613
button.text-button.image-button image:not(:only-child) {
614
margin: 0 4px;
615
}
616
617
toolbar .linked > button, .titlebar:not(headerbar) .linked > button:not(.suggested-action):not(.destructive-action),
618
headerbar .linked > button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked > button:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification .linked > button, toolbar
619
.linked.vertical > button, .titlebar:not(headerbar)
620
.linked.vertical > button:not(.suggested-action):not(.destructive-action),
621
headerbar
622
.linked.vertical > button:not(.suggested-action):not(.destructive-action), actionbar > revealer > box
623
.linked.vertical > button:not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification
624
.linked.vertical > button, .linked >
625
button.flat,
626
.linked.vertical >
627
button.flat {
628
border-radius: 2px;
629
}
630
631
infobar.info button:disabled, infobar.question button:disabled, infobar.warning button:disabled, infobar.error button:disabled, row:selected
632
button:disabled {
633
color: rgba(255, 255, 255, 0.3);
634
}
635
636
637
button.osd {
638
padding: 10px 14px;
639
}
640
641
642
button.osd.image-button {
643
padding: 10px;
644
}
645
646
647
button.osd:disabled {
648
opacity: 0;
649
}
650
651
652
button.suggested-action {
653
background-color: #FF4081;
654
color: #FFFFFF;
655
}
656
657
658
button.suggested-action:disabled {
659
box-shadow: none;
660
background-color: alpha(currentColor, 0.3);
661
color: rgba(0, 0, 0, 0.32);
662
}
663
664
665
button.suggested-action:checked {
666
background-color: #ff79a7;
667
}
668
669
670
button.suggested-action.flat {
671
background-color: transparent;
672
color: #FF4081;
673
}
674
675
676
button.suggested-action.flat:disabled {
677
box-shadow: none;
678
background-color: transparent;
679
color: alpha(currentColor, 0.4);
680
}
681
682
683
button.suggested-action.flat:checked {
684
background-color: alpha(currentColor, 0.3);
685
}
686
687
688
button.destructive-action {
689
background-color: #FF5252;
690
color: #FFFFFF;
691
}
692
693
694
button.destructive-action:disabled {
695
box-shadow: none;
696
background-color: alpha(currentColor, 0.3);
697
color: rgba(0, 0, 0, 0.32);
698
}
699
700
701
button.destructive-action:checked {
702
background-color: #ff8686;
703
}
704
705
706
button.destructive-action.flat {
707
background-color: transparent;
708
color: #FF5252;
709
}
710
711
712
button.destructive-action.flat:disabled {
713
box-shadow: none;
714
background-color: transparent;
715
color: alpha(currentColor, 0.4);
716
}
717
718
719
button.destructive-action.flat:checked {
720
background-color: alpha(currentColor, 0.3);
721
}
722
723
.stack-switcher >
724
button {
725
outline-offset: -4px;
726
}
727
728
.stack-switcher >
729
button > label {
730
padding-left: 6px;
731
padding-right: 6px;
732
}
733
734
.stack-switcher >
735
button > image {
736
padding-left: 6px;
737
padding-right: 6px;
738
padding-top: 3px;
739
padding-bottom: 3px;
740
}
741
742
.stack-switcher >
743
button.text-button {
744
padding-left: 10px;
745
padding-right: 10px;
746
}
747
748
.stack-switcher >
749
button.image-button {
750
padding-left: 2px;
751
padding-right: 2px;
752
}
753
754
.stack-switcher >
755
button.needs-attention:checked > label,
756
.stack-switcher >
757
button.needs-attention:checked > image {
758
animation: none;
759
background-image: none;
760
}
761
762
763
button separator {
764
min-width: 0;
765
min-height: 0;
766
background-color: transparent;
767
}
768
769
.primary-toolbar
770
button {
771
-gtk-icon-shadow: none;
772
}
773
774
775
button.image-button:not(.text-button), toolbar .linked > button.image-button:not(.text-button), .titlebar:not(headerbar) .linked > button.image-button:not(.text-button):not(.suggested-action):not(.destructive-action),
776
headerbar .linked > button.image-button:not(.text-button):not(.suggested-action):not(.destructive-action), actionbar > revealer > box .linked > button.image-button:not(.text-button):not(.suggested-action):not(.destructive-action):not(.server-list-button), .app-notification .linked > button.image-button:not(.text-button), toolbar
777
.linked.vertical > button.image-button:not(.text-button),
778
headerbar
779
.linked.vertical > button.image-button:not(.text-button):not(.suggested-action):not(.destructive-action), .app-notification
780
.linked.vertical > button.image-button:not(.text-button), .linked > button.flat.image-button:not(.text-button),
781
.linked.vertical > button.flat.image-button:not(.text-button), .inline-toolbar button:not(.text-button), check,
782
radio, button.titlebutton, .nautilus-window headerbar > revealer > button,
783
button.close,
784
button.circular {
785
border-radius: 9999px;
786
-gtk-outline-radius: 9999px;
787
}
788
789
spinbutton:not(.vertical) button, notebook > header tab button.flat, button.sidebar-button, .nautilus-window .floating-bar button, .gedit-document-panel row button.flat, .gedit-search-slider button:dir(ltr), .gedit-search-slider button:dir(rtl), .pluma-window paned.horizontal box.vertical box.horizontal button.flat {
790
min-height: 20px;
791
min-width: 20px;
792
padding: 0;
793
border-radius: 9999px;
794
-gtk-outline-radius: 9999px;
795
}
796
797
.stack-switcher >
798
button.needs-attention > label,
799
.stack-switcher >
800
button.needs-attention > image, stacksidebar row.needs-attention > label {
801
animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
802
background-repeat: no-repeat;
803
background-position: right 3px;
804
background-size: 6px 6px;
805
}
806
807
.stack-switcher >
808
button.needs-attention > label:dir(rtl),
809
.stack-switcher >
810
button.needs-attention > image:dir(rtl), stacksidebar row.needs-attention > label:dir(rtl) {
811
background-position: left 3px;
812
}
813
814
.linked:not(.vertical) > combobox:not(:only-child) > box > button.combo, .linked:not(.vertical) > spinbutton:not(:only-child):not(.vertical), .linked:not(.vertical) > entry:not(:only-child), .linked > button:not(:only-child) {
815
border-radius: 0;
816
-gtk-outline-radius: 2px;
817
}
818
819
.linked:not(.vertical) > combobox:not(:only-child):first-child > box > button.combo, .linked:not(.vertical) > spinbutton:not(:only-child):first-child:not(.vertical), .linked:not(.vertical) > entry:not(:only-child):first-child, .linked > button:not(:only-child):first-child, combobox.linked button:not(:only-child):nth-child(2):dir(rtl) {
820
border-radius: 2px 0 0 2px;
821
}
822
823
.linked:not(.vertical) > combobox:not(:only-child):last-child > box > button.combo, .linked:not(.vertical) > spinbutton:not(:only-child):last-child:not(.vertical), .linked:not(.vertical) > entry:not(:only-child):last-child, .linked > button:not(:only-child):last-child, combobox.linked button:not(:only-child):nth-child(2):dir(ltr) {
824
border-radius: 0 2px 2px 0;
825
}
826
827
.linked.vertical > combobox:not(:only-child) > box > button.combo, .linked.vertical > spinbutton:not(:only-child):not(.vertical), .linked.vertical > entry:not(:only-child), .linked.vertical > button:not(:only-child) {
828
border-radius: 0;
829
-gtk-outline-radius: 2px;
830
}
831
832
.linked.vertical > combobox:not(:only-child):first-child > box > button.combo, .linked.vertical > spinbutton:not(:only-child):first-child:not(.vertical), .linked.vertical > entry:not(:only-child):first-child, .linked.vertical > button:not(:only-child):first-child {
833
border-radius: 2px 2px 0 0;
834
}
835
836
.linked.vertical > combobox:not(:only-child):last-child > box > button.combo, .linked.vertical > spinbutton:not(:only-child):last-child:not(.vertical), .linked.vertical > entry:not(:only-child):last-child, .linked.vertical > button:not(:only-child):last-child {
837
border-radius: 0 0 2px 2px;
838
}
839
840
/* menu buttons */
841
modelbutton.flat,
842
.menuitem.button.flat {
843
min-height: 28px;
844
padding: 0 8px;
845
border-radius: 2px;
846
color: inherit;
847
}
848
849
modelbutton.flat check,
850
modelbutton.flat radio,
851
.menuitem.button.flat check,
852
.menuitem.button.flat radio {
853
box-shadow: none;
854
background-image: none;
855
}
856
857
modelbutton.flat check:not(:checked):not(:indeterminate),
858
modelbutton.flat radio:not(:checked):not(:indeterminate),
859
.menuitem.button.flat check:not(:checked):not(:indeterminate),
860
.menuitem.button.flat radio:not(:checked):not(:indeterminate) {
861
color: alpha(currentColor, 0.6);
862
}
863
864
modelbutton.flat check:last-child,
865
modelbutton.flat radio:last-child,
866
.menuitem.button.flat check:last-child,
867
.menuitem.button.flat radio:last-child {
868
margin-left: -8px;
869
margin-right: -16px;
870
}
871
872
modelbutton.flat check:first-child,
873
modelbutton.flat radio:first-child,
874
.menuitem.button.flat check:first-child,
875
.menuitem.button.flat radio:first-child {
876
margin-left: -16px;
877
margin-right: -8px;
878
}
879
880
modelbutton.flat arrow {
881
background: none;
882
}
883
884
modelbutton.flat arrow:hover {
885
background: none;
886
}
887
888
modelbutton.flat arrow.left {
889
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
890
}
891
892
modelbutton.flat arrow.right {
893
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
894
}
895
896
button.color {
897
min-height: 20px;
898
min-width: 20px;
899
padding: 6px;
900
}
901
902
/*********
903
* Links *
904
*********/
905
*:link, button:link,
906
button:visited, *:link:hover, button:hover:link,
907
button:hover:visited, *:link:active, button:active:link,
908
button:active:visited {
909
color: #42A5F5;
910
}
911
912
*:link:visited,
913
button:visited, *:link:visited:hover,
914
button:visited:hover, *:link:visited:active,
915
button:visited:active {
916
color: #E040FB;
917
}
918
919
infobar.info *:link, infobar.info button:link, infobar.info
920
button:visited, infobar.question *:link, infobar.question button:link, infobar.question
921
button:visited, infobar.warning *:link, infobar.warning button:link, infobar.warning
922
button:visited, infobar.error *:link, infobar.error button:link, infobar.error
923
button:visited, *:link:selected, button:selected:link,
924
button:selected:visited, .selection-mode.titlebar:not(headerbar) .subtitle:link,
925
headerbar.selection-mode .subtitle:link,
926
*:selected *:link,
927
*:selected button:link,
928
*:selected
929
button:visited {
930
color: #FFFFFF;
931
}
932
933
button:link > label,
934
button:visited > label {
935
text-decoration-line: underline;
936
}
937
938
/*****************
939
* GtkSpinButton *
940
*****************/
941
spinbutton:not(.vertical) {
942
padding: 0;
943
}
944
945
notebook > stack:not(:only-child) spinbutton:not(.vertical) entry, notebook > stack:not(:only-child) spinbutton:not(.vertical) entry:focus, notebook > stack:not(:only-child) spinbutton:not(.vertical) entry:disabled,
946
spinbutton:not(.vertical) entry {
947
min-width: 28px;
948
margin: 0;
949
border-image: none;
950
border-radius: 0;
951
box-shadow: none;
952
background-color: transparent;
953
}
954
955
spinbutton:not(.vertical) button {
956
border: solid 6px transparent;
957
}
958
959
spinbutton:not(.vertical) button.up:dir(ltr), spinbutton:not(.vertical) button.down:dir(rtl) {
960
margin-left: -3px;
961
}
962
963
spinbutton:not(.vertical) button.up:dir(rtl), spinbutton:not(.vertical) button.down:dir(ltr) {
964
margin-right: -3px;
965
}
966
967
spinbutton.vertical:disabled {
968
color: rgba(0, 0, 0, 0.32);
969
}
970
971
spinbutton.vertical:drop(active) {
972
box-shadow: none;
973
}
974
975
spinbutton.vertical entry {
976
min-height: 32px;
977
min-width: 44px;
978
padding: 0;
979
}
980
981
spinbutton.vertical button {
982
min-height: 32px;
983
min-width: 44px;
984
padding: 0;
985
}
986
987
spinbutton.vertical button.up {
988
border-radius: 2px 2px 0 0;
989
}
990
991
spinbutton.vertical button.down {
992
border-radius: 0 0 2px 2px;
993
}
994
995
treeview spinbutton:not(.vertical) {
996
min-height: 0;
997
border-style: none;
998
border-radius: 0;
999
}
1000
1001
treeview spinbutton:not(.vertical) entry {
1002
min-height: 0;
1003
padding: 1px 2px;
1004
}
1005
1006
/**************
1007
* ComboBoxes *
1008
**************/
1009
combobox arrow {
1010
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1011
min-height: 16px;
1012
min-width: 16px;
1013
}
1014
1015
combobox decoration,
1016
combobox button.combo:checked {
1017
transition: none;
1018
}
1019
1020
combobox button.combo cellview:dir(ltr) {
1021
margin-left: 0px;
1022
}
1023
1024
combobox button.combo cellview:dir(rtl) {
1025
margin-right: 0px;
1026
}
1027
1028
combobox #gtk-combobox-popup-menu {
1029
padding: 2px 0;
1030
}
1031
1032
combobox #gtk-combobox-popup-menu menuitem {
1033
min-height: 28px;
1034
padding: 0 8px;
1035
}
1036
1037
combobox:drop(active) {
1038
box-shadow: none;
1039
}
1040
1041
notebook > stack:not(:only-child) button.combo, #login_window #user_combobox button {
1042
border-radius: 0;
1043
background-image: none;
1044
font-weight: inherit;
1045
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1046
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1047
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
1048
background-color: transparent;
1049
color: rgba(0, 0, 0, 0.8);
1050
}
1051
1052
notebook > stack:not(:only-child) button.combo:hover, #login_window #user_combobox button:hover {
1053
box-shadow: inset 0 -2px alpha(currentColor, 0.3);
1054
}
1055
1056
notebook > stack:not(:only-child) button.combo:checked, #login_window #user_combobox button:checked {
1057
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1058
}
1059
1060
notebook > stack:not(:only-child) button.combo:disabled, #login_window #user_combobox button:disabled {
1061
color: rgba(0, 0, 0, 0.32);
1062
}
1063
1064
/************
1065
* Toolbars *
1066
************/
1067
toolbar {
1068
-GtkWidget-window-dragging: true;
1069
padding: 3px;
1070
background-color: #F5F5F5;
1071
}
1072
1073
.osd toolbar {
1074
background-color: transparent;
1075
}
1076
1077
toolbar.osd, .app-notification, frame.documents-dropdown {
1078
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1079
padding: 6px;
1080
border-radius: 2px;
1081
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);
1082
background-color: #FFFFFF;
1083
}
1084
1085
toolbar.osd:backdrop, .app-notification:backdrop, frame.documents-dropdown:backdrop {
1086
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);
1087
}
1088
1089
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 {
1090
border-radius: 0;
1091
}
1092
1093
toolbar.horizontal separator {
1094
margin: 3px;
1095
}
1096
1097
toolbar.vertical separator {
1098
margin: 3px;
1099
}
1100
1101
toolbar:not(.inline-toolbar):not(.osd) scale,
1102
toolbar:not(.inline-toolbar):not(.osd) entry,
1103
toolbar:not(.inline-toolbar):not(.osd) spinbutton,
1104
toolbar:not(.inline-toolbar):not(.osd) button {
1105
margin: 3px;
1106
}
1107
1108
toolbar:not(.inline-toolbar):not(.osd) .linked entry:not(:first-child),
1109
toolbar:not(.inline-toolbar):not(.osd) .linked spinbutton:not(:first-child),
1110
toolbar:not(.inline-toolbar):not(.osd) .linked button:not(:first-child) {
1111
margin-left: 0;
1112
}
1113
1114
toolbar:not(.inline-toolbar):not(.osd) .linked entry:not(:last-child),
1115
toolbar:not(.inline-toolbar):not(.osd) .linked spinbutton:not(:last-child),
1116
toolbar:not(.inline-toolbar):not(.osd) .linked button:not(:last-child) {
1117
margin-right: 0;
1118
}
1119
1120
toolbar:not(.inline-toolbar):not(.osd) switch {
1121
margin: 9px 3px;
1122
}
1123
1124
.inline-toolbar {
1125
padding: 6px;
1126
border-style: solid;
1127
border-width: 0 1px 1px;
1128
border-color: rgba(0, 0, 0, 0.1);
1129
background-color: #FAFAFA;
1130
}
1131
1132
searchbar,
1133
.location-bar {
1134
padding: 6px;
1135
border-style: solid;
1136
border-width: 0 0 1px;
1137
border-color: rgba(0, 0, 0, 0.1);
1138
background-color: #F5F5F5;
1139
background-clip: border-box;
1140
}
1141
1142
/***************
1143
* Header bars *
1144
***************/
1145
.titlebar:not(headerbar),
1146
headerbar {
1147
transition: background-color 0.2s cubic-bezier(0, 0, 0.2, 1);
1148
min-height: 44px;
1149
padding: 0 6px;
1150
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);
1151
background-color: #E0E0E0;
1152
color: rgba(0, 0, 0, 0.8);
1153
}
1154
1155
.titlebar:disabled:not(headerbar) :not(button) > label,
1156
headerbar:disabled :not(button) > label {
1157
color: rgba(0, 0, 0, 0.32);
1158
}
1159
1160
.titlebar:backdrop:not(headerbar),
1161
headerbar:backdrop {
1162
color: rgba(0, 0, 0, 0.6);
1163
}
1164
1165
.titlebar:backdrop:disabled:not(headerbar) :not(button) > label,
1166
headerbar:backdrop:disabled :not(button) > label {
1167
color: rgba(0, 0, 0, 0.24);
1168
}
1169
1170
.titlebar:not(headerbar) .title,
1171
headerbar .title {
1172
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1173
padding: 0 12px;
1174
font-weight: bold;
1175
}
1176
1177
.titlebar:not(headerbar) .subtitle,
1178
headerbar .subtitle {
1179
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1180
padding: 0 12px;
1181
font-size: smaller;
1182
}
1183
1184
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
1185
headerbar button:not(.suggested-action):not(.destructive-action) {
1186
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1187
}
1188
1189
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1190
headerbar button:not(.suggested-action):not(.destructive-action):checked {
1191
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1192
}
1193
1194
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1195
headerbar button:not(.suggested-action):not(.destructive-action):checked,
1196
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled {
1197
background-color: transparent;
1198
}
1199
1200
.titlebar:not(headerbar) button.suggested-action:disabled, .titlebar:not(headerbar) button.destructive-action:disabled,
1201
headerbar button.suggested-action:disabled,
1202
headerbar button.destructive-action:disabled {
1203
color: alpha(currentColor, 0.4);
1204
}
1205
1206
.selection-mode.titlebar:not(headerbar),
1207
headerbar.selection-mode {
1208
transition: background-color 0.00001s 0.3s;
1209
animation: header_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1);
1210
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);
1211
background-color: #42A5F5;
1212
color: #FFFFFF;
1213
}
1214
1215
.selection-mode.titlebar:backdrop:not(headerbar),
1216
headerbar.selection-mode:backdrop {
1217
color: rgba(255, 255, 255, 0.75);
1218
}
1219
1220
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
1221
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action) {
1222
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px;
1223
color: currentColor;
1224
}
1225
1226
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled,
1227
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled {
1228
color: alpha(currentColor, 0.4);
1229
}
1230
1231
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
1232
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked {
1233
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
1234
color: currentColor;
1235
}
1236
1237
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
1238
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled {
1239
color: alpha(currentColor, 0.4);
1240
}
1241
1242
.selection-mode.titlebar:not(headerbar) .selection-menu,
1243
headerbar.selection-mode .selection-menu {
1244
padding-left: 16px;
1245
padding-right: 16px;
1246
}
1247
1248
.selection-mode.titlebar:not(headerbar) .selection-menu GtkArrow,
1249
headerbar.selection-mode .selection-menu GtkArrow {
1250
-GtkArrow-arrow-scaling: 1;
1251
}
1252
1253
.selection-mode.titlebar:not(headerbar) .selection-menu .arrow,
1254
headerbar.selection-mode .selection-menu .arrow {
1255
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1256
}
1257
1258
.fullscreen .titlebar:not(headerbar),
1259
.tiled .titlebar:not(headerbar),
1260
.maximized .titlebar:not(headerbar), .fullscreen
1261
headerbar,
1262
.tiled
1263
headerbar,
1264
.maximized
1265
headerbar {
1266
border-radius: 0;
1267
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1268
}
1269
1270
.default-decoration.titlebar:not(headerbar),
1271
headerbar.default-decoration {
1272
min-height: 20px;
1273
padding: 6px;
1274
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
1275
}
1276
1277
.fullscreen .default-decoration.titlebar:not(headerbar),
1278
.tiled .default-decoration.titlebar:not(headerbar),
1279
.maximized .default-decoration.titlebar:not(headerbar), .fullscreen
1280
headerbar.default-decoration,
1281
.tiled
1282
headerbar.default-decoration,
1283
.maximized
1284
headerbar.default-decoration {
1285
box-shadow: none;
1286
}
1287
1288
.default-decoration.titlebar:not(headerbar) button.titlebutton,
1289
headerbar.default-decoration button.titlebutton {
1290
min-height: 20px;
1291
min-width: 20px;
1292
margin: 0;
1293
padding: 0;
1294
}
1295
1296
.background:not(.csd) .default-decoration.titlebar:not(headerbar) button.titlebutton:active, .background:not(.csd)
1297
headerbar.default-decoration button.titlebutton:active {
1298
background-size: 1000% 1000%;
1299
}
1300
1301
headerbar entry,
1302
headerbar spinbutton,
1303
headerbar button {
1304
margin-top: 6px;
1305
margin-bottom: 6px;
1306
}
1307
1308
headerbar switch {
1309
margin-top: 12px;
1310
margin-bottom: 12px;
1311
}
1312
1313
headerbar spinbutton button {
1314
margin-top: 0;
1315
margin-bottom: 0;
1316
}
1317
1318
.background:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) .titlebar {
1319
border-top-left-radius: 2px;
1320
border-top-right-radius: 2px;
1321
}
1322
1323
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) separator:first-child + headerbar,
1324
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) headerbar:first-child {
1325
border-top-left-radius: 2px;
1326
}
1327
1328
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) headerbar:last-child {
1329
border-top-right-radius: 2px;
1330
}
1331
1332
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 {
1333
border-top-left-radius: 2px;
1334
border-top-right-radius: 2px;
1335
}
1336
1337
window.csd > .titlebar:not(headerbar) {
1338
padding: 0;
1339
background-color: transparent;
1340
background-image: none;
1341
border-style: none;
1342
box-shadow: none;
1343
}
1344
1345
.titlebar:not(headerbar) > separator {
1346
background-color: #E0E0E0;
1347
background-image: image(rgba(0, 0, 0, 0.1));
1348
}
1349
1350
/************
1351
* Pathbars *
1352
************/
1353
.caja-pathbar button,
1354
.path-bar button {
1355
padding-left: 4px;
1356
padding-right: 4px;
1357
}
1358
1359
.caja-pathbar button label:not(:only-child):first-child,
1360
.path-bar button label:not(:only-child):first-child {
1361
margin-left: 4px;
1362
}
1363
1364
.caja-pathbar button label:not(:only-child):last-child,
1365
.path-bar button label:not(:only-child):last-child {
1366
margin-right: 4px;
1367
}
1368
1369
.caja-pathbar button.slider-button,
1370
.path-bar button.slider-button {
1371
padding-left: 4px;
1372
padding-right: 4px;
1373
}
1374
1375
:not(headerbar) .caja-pathbar button, .caja-pathbar :not(headerbar) button, :not(headerbar)
1376
.path-bar button {
1377
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1378
border-radius: 2px;
1379
}
1380
1381
:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar)
1382
.path-bar button:checked {
1383
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1384
}
1385
1386
: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)
1387
.path-bar button:checked, :not(headerbar)
1388
.path-bar button:checked:disabled {
1389
background-color: transparent;
1390
}
1391
1392
/**************
1393
* Tree Views *
1394
**************/
1395
treeview.view {
1396
border-left-color: alpha(currentColor, 0.3);
1397
border-top-color: rgba(0, 0, 0, 0.1);
1398
}
1399
1400
* {
1401
-GtkTreeView-horizontal-separator: 4;
1402
-GtkTreeView-grid-line-width: 1;
1403
-GtkTreeView-grid-line-pattern: '';
1404
-GtkTreeView-tree-line-width: 1;
1405
-GtkTreeView-tree-line-pattern: '';
1406
-GtkTreeView-expander-size: 16;
1407
}
1408
1409
treeview.view.separator {
1410
min-height: 5px;
1411
color: rgba(0, 0, 0, 0.1);
1412
}
1413
1414
treeview.view:drop(active) {
1415
border-style: solid none;
1416
border-width: 1px;
1417
border-color: #FF4081;
1418
}
1419
1420
treeview.view:drop(active).after {
1421
border-top-style: none;
1422
}
1423
1424
treeview.view:drop(active).before {
1425
border-bottom-style: none;
1426
}
1427
1428
treeview.view.expander {
1429
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1430
-gtk-icon-transform: rotate(-90deg);
1431
color: rgba(0, 0, 0, 0.6);
1432
}
1433
1434
treeview.view.expander:dir(rtl) {
1435
-gtk-icon-transform: rotate(90deg);
1436
}
1437
1438
treeview.view.expander:checked {
1439
-gtk-icon-transform: unset;
1440
}
1441
1442
treeview.view.expander:hover, treeview.view.expander:active {
1443
color: rgba(0, 0, 0, 0.8);
1444
}
1445
1446
treeview.view.expander:disabled {
1447
color: rgba(0, 0, 0, 0.24);
1448
}
1449
1450
treeview.view.expander:selected {
1451
color: rgba(255, 255, 255, 0.75);
1452
}
1453
1454
treeview.view.expander:selected:hover, treeview.view.expander:selected:active {
1455
color: #FFFFFF;
1456
}
1457
1458
treeview.view.expander:selected:disabled {
1459
color: rgba(255, 255, 255, 0.3);
1460
}
1461
1462
treeview.view.progressbar {
1463
border-bottom: 4px solid #42A5F5;
1464
box-shadow: none;
1465
background-color: transparent;
1466
}
1467
1468
treeview.view.progressbar:selected {
1469
border-bottom-color: currentColor;
1470
}
1471
1472
treeview.view.trough {
1473
border-bottom: 4px solid rgba(66, 165, 245, 0.3);
1474
box-shadow: none;
1475
background-color: transparent;
1476
}
1477
1478
treeview.view.trough:selected {
1479
border-bottom-color: alpha(currentColor, 0.3);
1480
}
1481
1482
treeview.view header button {
1483
padding: 2px 6px;
1484
border-style: none solid solid none;
1485
border-width: 1px;
1486
border-color: rgba(0, 0, 0, 0.1);
1487
border-radius: 0;
1488
background-clip: border-box;
1489
}
1490
1491
treeview.view header button, treeview.view header button:hover, treeview.view header button:active {
1492
box-shadow: none;
1493
}
1494
1495
treeview.view header button, treeview.view header button:disabled {
1496
background-color: #FFFFFF;
1497
}
1498
1499
treeview.view header button:last-child {
1500
border-right-style: none;
1501
}
1502
1503
treeview.view button.dnd,
1504
treeview.view header.button.dnd {
1505
padding: 2px 6px;
1506
border-style: none solid solid;
1507
border-width: 1px;
1508
border-color: rgba(0, 0, 0, 0.1);
1509
border-radius: 0;
1510
box-shadow: none;
1511
background-color: #FFFFFF;
1512
background-clip: border-box;
1513
color: #42A5F5;
1514
}
1515
1516
treeview.view acceleditor > label {
1517
background-color: #42A5F5;
1518
}
1519
1520
/*********
1521
* Menus *
1522
*********/
1523
menubar,
1524
.menubar {
1525
-GtkWidget-window-dragging: true;
1526
padding: 0;
1527
background-color: #E0E0E0;
1528
}
1529
1530
menubar > menuitem,
1531
.menubar > menuitem {
1532
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
1533
min-height: 20px;
1534
padding: 4px 8px;
1535
color: rgba(0, 0, 0, 0.6);
1536
}
1537
1538
menubar > menuitem:hover,
1539
.menubar > menuitem:hover {
1540
transition: none;
1541
background-color: alpha(currentColor, 0.15);
1542
color: rgba(0, 0, 0, 0.8);
1543
}
1544
1545
menubar > menuitem:disabled,
1546
.menubar > menuitem:disabled {
1547
color: rgba(0, 0, 0, 0.24);
1548
}
1549
1550
.csd.popup {
1551
border-radius: 2px;
1552
}
1553
1554
menu,
1555
.menu,
1556
.context-menu {
1557
margin: 4px 0;
1558
padding: 4px 0;
1559
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
1560
background-color: #FFFFFF;
1561
border: 1px solid rgba(0, 0, 0, 0.1);
1562
}
1563
1564
.csd menu, .csd
1565
.menu, .csd
1566
.context-menu {
1567
border: none;
1568
border-radius: 2px;
1569
}
1570
1571
menu menuitem,
1572
.menu menuitem,
1573
.context-menu menuitem {
1574
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
1575
min-height: 20px;
1576
min-width: 40px;
1577
padding: 4px 8px;
1578
font: initial;
1579
text-shadow: none;
1580
}
1581
1582
menu menuitem:hover,
1583
.menu menuitem:hover,
1584
.context-menu menuitem:hover {
1585
transition: none;
1586
background-color: alpha(currentColor, 0.15);
1587
}
1588
1589
menu menuitem:disabled,
1590
.menu menuitem:disabled,
1591
.context-menu menuitem:disabled {
1592
color: rgba(0, 0, 0, 0.32);
1593
}
1594
1595
menu menuitem arrow,
1596
.menu menuitem arrow,
1597
.context-menu menuitem arrow {
1598
min-height: 16px;
1599
min-width: 16px;
1600
}
1601
1602
menu menuitem arrow:dir(ltr),
1603
.menu menuitem arrow:dir(ltr),
1604
.context-menu menuitem arrow:dir(ltr) {
1605
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1606
margin-left: 8px;
1607
}
1608
1609
menu menuitem arrow:dir(rtl),
1610
.menu menuitem arrow:dir(rtl),
1611
.context-menu menuitem arrow:dir(rtl) {
1612
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl");
1613
margin-right: 8px;
1614
}
1615
1616
menu menuitem label:dir(rtl), menu menuitem label:dir(ltr),
1617
.menu menuitem label:dir(rtl),
1618
.menu menuitem label:dir(ltr),
1619
.context-menu menuitem label:dir(rtl),
1620
.context-menu menuitem label:dir(ltr) {
1621
color: inherit;
1622
}
1623
1624
menu > arrow,
1625
.menu > arrow,
1626
.context-menu > arrow {
1627
min-height: 16px;
1628
min-width: 16px;
1629
padding: 4px;
1630
border-radius: 0;
1631
background-color: #FFFFFF;
1632
color: rgba(0, 0, 0, 0.6);
1633
}
1634
1635
menu > arrow.top,
1636
.menu > arrow.top,
1637
.context-menu > arrow.top {
1638
margin-top: -4px;
1639
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
1640
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
1641
}
1642
1643
menu > arrow.bottom,
1644
.menu > arrow.bottom,
1645
.context-menu > arrow.bottom {
1646
margin-bottom: -4px;
1647
border-top: 1px solid rgba(0, 0, 0, 0.1);
1648
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1649
}
1650
1651
menu > arrow:hover,
1652
.menu > arrow:hover,
1653
.context-menu > arrow:hover {
1654
background-image: image(alpha(currentColor, 0.15));
1655
color: rgba(0, 0, 0, 0.8);
1656
}
1657
1658
menu > arrow:disabled,
1659
.menu > arrow:disabled,
1660
.context-menu > arrow:disabled {
1661
border-color: transparent;
1662
background-color: transparent;
1663
color: transparent;
1664
}
1665
1666
menu separator,
1667
.menu separator,
1668
.context-menu separator {
1669
margin: 4px 0;
1670
}
1671
1672
menuitem accelerator {
1673
color: alpha(currentColor, 0.6);
1674
}
1675
1676
.popup:not(.csd) menu menuitem {
1677
color: #333333;
1678
}
1679
1680
.popup:not(.csd) menu menuitem:hover {
1681
background-color: #e0e0e0;
1682
}
1683
1684
.popup:not(.csd) menu menuitem:disabled {
1685
color: #adadad;
1686
}
1687
1688
.popup:not(.csd) menu accelerator {
1689
color: #858585;
1690
}
1691
1692
/************
1693
* Popovers *
1694
************/
1695
popover.background {
1696
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1697
padding: 2px;
1698
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
1699
background-color: #FAFAFA;
1700
}
1701
1702
popover.background:backdrop {
1703
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1704
}
1705
1706
popover.background, .csd popover.background {
1707
border-style: solid;
1708
border-width: 1px;
1709
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3);
1710
border-radius: 3px;
1711
}
1712
1713
popover.background > stack {
1714
margin: -4px;
1715
}
1716
1717
popover.background > toolbar {
1718
margin: -2px;
1719
}
1720
1721
popover.background > list,
1722
popover.background > .view,
1723
popover.background > toolbar {
1724
border-style: none;
1725
box-shadow: none;
1726
background-color: transparent;
1727
}
1728
1729
popover.background.menu button,
1730
popover.background button.model {
1731
min-height: 32px;
1732
padding: 0 8px;
1733
border-radius: 2px;
1734
}
1735
1736
popover.background separator {
1737
margin: 4px 0;
1738
}
1739
1740
popover.background list separator {
1741
margin: 0;
1742
}
1743
1744
/*************
1745
* Notebooks *
1746
*************/
1747
notebook > header {
1748
border-width: 1px;
1749
border-color: rgba(0, 0, 0, 0.1);
1750
background-color: #F5F5F5;
1751
background-clip: border-box;
1752
}
1753
1754
notebook > header.top {
1755
border-bottom-style: solid;
1756
}
1757
1758
notebook > header.top > tabs {
1759
margin-bottom: -1px;
1760
}
1761
1762
notebook > header.top > tabs > tab:hover {
1763
box-shadow: inset 0 -2px alpha(currentColor, 0.3);
1764
}
1765
1766
notebook > header.top > tabs > tab:checked {
1767
box-shadow: inset 0 -2px #42A5F5;
1768
}
1769
1770
notebook > header.bottom {
1771
border-top-style: solid;
1772
}
1773
1774
notebook > header.bottom > tabs {
1775
margin-top: -1px;
1776
}
1777
1778
notebook > header.bottom > tabs > tab:hover {
1779
box-shadow: inset 0 2px alpha(currentColor, 0.3);
1780
}
1781
1782
notebook > header.bottom > tabs > tab:checked {
1783
box-shadow: inset 0 2px #42A5F5;
1784
}
1785
1786
notebook > header.left {
1787
border-right-style: solid;
1788
}
1789
1790
notebook > header.left > tabs {
1791
margin-right: -1px;
1792
}
1793
1794
notebook > header.left > tabs > tab:hover {
1795
box-shadow: inset -2px 0 alpha(currentColor, 0.3);
1796
}
1797
1798
notebook > header.left > tabs > tab:checked {
1799
box-shadow: inset -2px 0 #42A5F5;
1800
}
1801
1802
notebook > header.right {
1803
border-left-style: solid;
1804
}
1805
1806
notebook > header.right > tabs {
1807
margin-left: -1px;
1808
}
1809
1810
notebook > header.right > tabs > tab:hover {
1811
box-shadow: inset 2px 0 alpha(currentColor, 0.3);
1812
}
1813
1814
notebook > header.right > tabs > tab:checked {
1815
box-shadow: inset 2px 0 #42A5F5;
1816
}
1817
1818
notebook > header.top > tabs > arrow {
1819
border-top-style: none;
1820
}
1821
1822
notebook > header.bottom > tabs > arrow {
1823
border-bottom-style: none;
1824
}
1825
1826
notebook > header.top > tabs > arrow, notebook > header.bottom > tabs > arrow {
1827
padding-left: 4px;
1828
padding-right: 4px;
1829
}
1830
1831
notebook > header.top > tabs > arrow.down, notebook > header.bottom > tabs > arrow.down {
1832
margin-left: -8px;
1833
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
1834
}
1835
1836
notebook > header.top > tabs > arrow.up, notebook > header.bottom > tabs > arrow.up {
1837
margin-right: -8px;
1838
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1839
}
1840
1841
notebook > header.left > tabs > arrow {
1842
border-left-style: none;
1843
}
1844
1845
notebook > header.right > tabs > arrow {
1846
border-right-style: none;
1847
}
1848
1849
notebook > header.left > tabs > arrow, notebook > header.right > tabs > arrow {
1850
padding-top: 4px;
1851
padding-bottom: 4px;
1852
}
1853
1854
notebook > header.left > tabs > arrow.down, notebook > header.right > tabs > arrow.down {
1855
margin-top: -8px;
1856
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
1857
}
1858
1859
notebook > header.left > tabs > arrow.up, notebook > header.right > tabs > arrow.up {
1860
margin-bottom: -8px;
1861
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1862
}
1863
1864
notebook > header > tabs > arrow {
1865
min-height: 16px;
1866
min-width: 16px;
1867
border-radius: 0;
1868
}
1869
1870
notebook > header tab {
1871
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
1872
min-height: 20px;
1873
min-width: 20px;
1874
padding: 6px 12px;
1875
outline-offset: -6px;
1876
border-width: 1px;
1877
border-color: transparent;
1878
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 10%, transparent 0%);
1879
background-repeat: no-repeat;
1880
background-position: center;
1881
background-size: 0% 0%;
1882
color: rgba(0, 0, 0, 0.6);
1883
font-weight: 500;
1884
}
1885
1886
notebook > header tab:hover {
1887
color: rgba(0, 0, 0, 0.8);
1888
}
1889
1890
notebook > header tab:hover.reorderable-page {
1891
border-color: rgba(0, 0, 0, 0.1);
1892
background-color: #FAFAFA;
1893
}
1894
1895
notebook > header tab:disabled {
1896
color: rgba(0, 0, 0, 0.24);
1897
}
1898
1899
notebook > header tab:checked {
1900
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);
1901
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
1902
background-size: 1000% 1000%;
1903
color: rgba(0, 0, 0, 0.8);
1904
}
1905
1906
notebook > header tab:checked:disabled {
1907
color: rgba(0, 0, 0, 0.32);
1908
}
1909
1910
notebook > header tab:checked.reorderable-page {
1911
border-color: rgba(0, 0, 0, 0.1);
1912
background-color: #FFFFFF;
1913
}
1914
1915
notebook > header tab button.flat:last-child {
1916
margin-left: 6px;
1917
margin-right: -6px;
1918
}
1919
1920
notebook > header tab button.flat:first-child {
1921
margin-left: -6px;
1922
margin-right: 6px;
1923
}
1924
1925
notebook > header.top tabs, notebook > header.bottom tabs {
1926
padding-left: 8px;
1927
padding-right: 8px;
1928
}
1929
1930
notebook > header.top tabs:not(:only-child):first-child, notebook > header.bottom tabs:not(:only-child):first-child {
1931
margin-left: 0;
1932
}
1933
1934
notebook > header.top tabs:not(:only-child):last-child, notebook > header.bottom tabs:not(:only-child):last-child {
1935
margin-right: 0;
1936
}
1937
1938
notebook > header.top tabs tab.reorderable-page, notebook > header.bottom tabs tab.reorderable-page {
1939
margin: 0 -1px;
1940
border-style: none solid;
1941
}
1942
1943
notebook > header.left tabs, notebook > header.right tabs {
1944
padding-top: 8px;
1945
padding-bottom: 8px;
1946
}
1947
1948
notebook > header.left tabs:not(:only-child):first-child, notebook > header.right tabs:not(:only-child):first-child {
1949
margin-top: 0;
1950
}
1951
1952
notebook > header.left tabs:not(:only-child):last-child, notebook > header.right tabs:not(:only-child):last-child {
1953
margin-bottom: 0;
1954
}
1955
1956
notebook > header.left tabs tab.reorderable-page, notebook > header.right tabs tab.reorderable-page {
1957
margin: -1px 0;
1958
border-style: solid none;
1959
}
1960
1961
notebook > stack:not(:only-child) {
1962
background-color: #FFFFFF;
1963
}
1964
1965
/**************
1966
* Scrollbars *
1967
**************/
1968
scrollbar {
1969
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
1970
background-color: #FFFFFF;
1971
background-clip: padding-box;
1972
}
1973
1974
* {
1975
-GtkScrollbar-has-backward-stepper: false;
1976
-GtkScrollbar-has-forward-stepper: false;
1977
}
1978
1979
scrollbar.top {
1980
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
1981
}
1982
1983
scrollbar.bottom {
1984
border-top: 1px solid rgba(0, 0, 0, 0.1);
1985
}
1986
1987
scrollbar.left {
1988
border-right: 1px solid rgba(0, 0, 0, 0.1);
1989
}
1990
1991
scrollbar.right {
1992
border-left: 1px solid rgba(0, 0, 0, 0.1);
1993
}
1994
1995
scrollbar slider {
1996
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0;
1997
min-width: 8px;
1998
min-height: 8px;
1999
border: 4px solid transparent;
2000
border-radius: 9999px;
2001
background-clip: padding-box;
2002
background-color: rgba(0, 0, 0, 0.48);
2003
}
2004
2005
scrollbar slider:hover {
2006
background-color: rgba(0, 0, 0, 0.6);
2007
}
2008
2009
scrollbar slider:active {
2010
background-color: rgba(0, 0, 0, 0.8);
2011
}
2012
2013
scrollbar slider:disabled {
2014
background-color: rgba(0, 0, 0, 0.192);
2015
}
2016
2017
scrollbar.fine-tune slider {
2018
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0, min-width 0, min-height 0;
2019
min-width: 4px;
2020
min-height: 4px;
2021
}
2022
2023
scrollbar.fine-tune.horizontal slider {
2024
margin: 2px 0;
2025
}
2026
2027
scrollbar.fine-tune.vertical slider {
2028
margin: 0 2px;
2029
}
2030
2031
scrollbar.overlay-indicator:not(.dragging):not(.hovering) {
2032
border-color: transparent;
2033
background-color: transparent;
2034
}
2035
2036
scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider {
2037
min-width: 4px;
2038
min-height: 4px;
2039
margin: 3px;
2040
border: 1px solid rgba(255, 255, 255, 0.3);
2041
}
2042
2043
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button {
2044
min-width: 4px;
2045
min-height: 4px;
2046
margin: 3px;
2047
border: 1px solid rgba(255, 255, 255, 0.3);
2048
border-radius: 9999px;
2049
background-color: rgba(0, 0, 0, 0.48);
2050
background-clip: padding-box;
2051
-gtk-icon-source: none;
2052
}
2053
2054
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled {
2055
background-color: rgba(0, 0, 0, 0.192);
2056
}
2057
2058
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider {
2059
min-width: 24px;
2060
}
2061
2062
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal button {
2063
min-width: 8px;
2064
}
2065
2066
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider {
2067
min-height: 24px;
2068
}
2069
2070
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button {
2071
min-height: 8px;
2072
}
2073
2074
scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering {
2075
background-color: rgba(255, 255, 255, 0.9);
2076
}
2077
2078
scrollbar.horizontal slider {
2079
min-width: 24px;
2080
}
2081
2082
scrollbar.vertical slider {
2083
min-height: 24px;
2084
}
2085
2086
scrollbar button {
2087
min-width: 16px;
2088
min-height: 16px;
2089
padding: 0;
2090
border-radius: 0;
2091
}
2092
2093
scrollbar.vertical button.down {
2094
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
2095
}
2096
2097
scrollbar.vertical button.up {
2098
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
2099
}
2100
2101
scrollbar.horizontal button.down {
2102
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
2103
}
2104
2105
scrollbar.horizontal button.up {
2106
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
2107
}
2108
2109
/**********
2110
* Switch *
2111
**********/
2112
switch {
2113
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2114
margin: 6px 0;
2115
border: 4px solid transparent;
2116
border-radius: 9999px;
2117
background-color: alpha(currentColor, 0.3);
2118
background-clip: padding-box;
2119
font-size: 0;
2120
}
2121
2122
switch:disabled {
2123
color: alpha(currentColor, 0.4);
2124
}
2125
2126
switch:checked {
2127
background-color: rgba(255, 64, 129, 0.5);
2128
}
2129
2130
switch:checked:disabled {
2131
background-color: rgba(255, 64, 129, 0.2);
2132
color: rgba(0, 0, 0, 0.32);
2133
}
2134
2135
switch slider {
2136
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
2137
border-image: none;
2138
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2139
background-color: #FFFFFF;
2140
color: rgba(0, 0, 0, 0.8);
2141
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0;
2142
min-width: 20px;
2143
min-height: 20px;
2144
margin: -4px 0 -4px -4px;
2145
border-radius: 9999px;
2146
-gtk-outline-radius: 9999px;
2147
}
2148
2149
switch:hover slider {
2150
border-image: none;
2151
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2152
}
2153
2154
switch:checked slider {
2155
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;
2156
animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1);
2157
margin: -4px -4px -4px 0;
2158
background-color: #FF4081;
2159
color: #FFFFFF;
2160
}
2161
2162
switch:disabled slider {
2163
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2164
background-color: #FAFAFA;
2165
color: rgba(0, 0, 0, 0.32);
2166
}
2167
2168
switch:checked:disabled slider {
2169
animation: none;
2170
}
2171
2172
/*************************
2173
* Check and Radio items *
2174
*************************/
2175
.view.content-view.check:not(list),
2176
.content-view .tile check:not(list) {
2177
min-height: 40px;
2178
min-width: 40px;
2179
margin: 0;
2180
padding: 0;
2181
box-shadow: none;
2182
background-color: transparent;
2183
background-image: none;
2184
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2185
}
2186
2187
.view.content-view.check:not(list):hover, .view.content-view.check:not(list):active,
2188
.content-view .tile check:not(list):hover,
2189
.content-view .tile check:not(list):active {
2190
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2191
}
2192
2193
.view.content-view.check:not(list),
2194
.content-view .tile check:not(list) {
2195
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-unchecked.png"), url("assets/selectionmode-checkbox-unchecked@2.png"));
2196
}
2197
2198
.view.content-view.check:not(list):checked,
2199
.content-view .tile check:not(list):checked {
2200
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-checked.png"), url("assets/selectionmode-checkbox-checked@2.png"));
2201
}
2202
2203
checkbutton.text-button,
2204
radiobutton.text-button {
2205
padding: 2px;
2206
outline-offset: 0;
2207
}
2208
2209
checkbutton.text-button label:not(:only-child),
2210
radiobutton.text-button label:not(:only-child) {
2211
margin: 0 4px;
2212
}
2213
2214
check,
2215
radio {
2216
min-height: 24px;
2217
min-width: 24px;
2218
margin: -10px;
2219
padding: 10px;
2220
}
2221
2222
check:checked, check:indeterminate,
2223
radio:checked,
2224
radio:indeterminate {
2225
color: #FF4081;
2226
}
2227
2228
check:checked:disabled, check:indeterminate:disabled,
2229
radio:checked:disabled,
2230
radio:indeterminate:disabled {
2231
color: rgba(255, 64, 129, 0.4);
2232
}
2233
2234
row check:not(:checked):not(:indeterminate), row
2235
radio:not(:checked):not(:indeterminate) {
2236
color: alpha(currentColor, 0.75);
2237
}
2238
2239
row check:not(:checked):not(:indeterminate):hover, row check:not(:checked):not(:indeterminate):active, row
2240
radio:not(:checked):not(:indeterminate):hover, row
2241
radio:not(:checked):not(:indeterminate):active {
2242
color: currentColor;
2243
}
2244
2245
row check:not(:checked):not(:indeterminate):disabled, row
2246
radio:not(:checked):not(:indeterminate):disabled {
2247
color: alpha(currentColor, 0.3);
2248
}
2249
2250
menu menuitem check, menu menuitem
2251
radio {
2252
transition: none;
2253
min-height: 16px;
2254
min-width: 16px;
2255
margin: 0;
2256
padding: 0;
2257
}
2258
2259
menu menuitem check:dir(ltr), menu menuitem
2260
radio:dir(ltr) {
2261
margin-right: 8px;
2262
}
2263
2264
menu menuitem check:dir(rtl), menu menuitem
2265
radio:dir(rtl) {
2266
margin-left: 8px;
2267
}
2268
2269
menu menuitem check:not(:checked):not(:indeterminate), menu menuitem
2270
radio:not(:checked):not(:indeterminate) {
2271
color: alpha(currentColor, 0.6);
2272
}
2273
2274
menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem
2275
radio, menu menuitem
2276
radio:hover, menu menuitem
2277
radio:disabled {
2278
box-shadow: none;
2279
}
2280
2281
2282
check {
2283
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.symbolic.png")));
2284
}
2285
2286
2287
check:checked {
2288
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.symbolic.png")));
2289
}
2290
2291
2292
check:indeterminate {
2293
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.symbolic.png")));
2294
}
2295
2296
2297
radio {
2298
border-image-slice: 22;
2299
border-image-width: 22px;
2300
}
2301
2302
2303
radio {
2304
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.symbolic.png")));
2305
}
2306
2307
2308
radio:indeterminate {
2309
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-mixed-symbolic.symbolic.png")));
2310
}
2311
2312
2313
radio {
2314
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent));
2315
}
2316
2317
2318
radio:checked:not(:indeterminate) {
2319
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.11364, to(#FF4081), to(transparent));
2320
}
2321
2322
2323
radio:checked:not(:indeterminate):disabled {
2324
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.11364, to(rgba(255, 64, 129, 0.4)), to(transparent));
2325
}
2326
2327
window.background:not(.csd) > widget > checkbutton > check,
2328
menu menuitem check {
2329
border-radius: 2px;
2330
-gtk-outline-radius: 2px;
2331
-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")));
2332
}
2333
2334
window.background:not(.csd) > widget > checkbutton > check:checked,
2335
menu menuitem check:checked {
2336
-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")));
2337
}
2338
2339
window.background:not(.csd) > widget > checkbutton > check:indeterminate,
2340
menu menuitem check:indeterminate {
2341
-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")));
2342
}
2343
2344
window.background:not(.csd) > widget > radiobutton > radio,
2345
menu menuitem radio {
2346
border-image: none;
2347
-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")));
2348
}
2349
2350
window.background:not(.csd) > widget > radiobutton > radio:checked,
2351
menu menuitem radio:checked {
2352
-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")));
2353
}
2354
2355
window.background:not(.csd) > widget > radiobutton > radio:indeterminate,
2356
menu menuitem radio:indeterminate {
2357
-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")));
2358
}
2359
2360
check:not(:checked):active {
2361
-gtk-icon-transform: rotate(90deg);
2362
}
2363
2364
check:not(:checked):indeterminate:active,
2365
radio:not(:checked):indeterminate:active {
2366
-gtk-icon-transform: scaleX(-1);
2367
}
2368
2369
check:not(:checked),
2370
radio:not(:checked) {
2371
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;
2372
}
2373
2374
check:not(:checked):active,
2375
radio:not(:checked):active {
2376
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0, -gtk-icon-transform 0;
2377
}
2378
2379
menu menuitem check:not(:checked), menu menuitem
2380
radio:not(:checked) {
2381
transition: none;
2382
}
2383
2384
treeview.view check,
2385
treeview.view radio {
2386
padding: 0;
2387
}
2388
2389
treeview.view check:hover,
2390
treeview.view radio:hover {
2391
box-shadow: inset 0 0 0 9999px alpha(rgba(0, 0, 0, 0.8), 0.05);
2392
}
2393
2394
treeview.view check:hover:disabled,
2395
treeview.view radio:hover:disabled {
2396
box-shadow: none;
2397
}
2398
2399
treeview.view check:hover:selected,
2400
treeview.view radio:hover:selected {
2401
box-shadow: inset 0 0 0 9999px alpha(#FFFFFF, 0.05);
2402
}
2403
2404
treeview.view check,
2405
treeview.view radio {
2406
color: rgba(0, 0, 0, 0.6);
2407
}
2408
2409
treeview.view check:hover, treeview.view check:active,
2410
treeview.view radio:hover,
2411
treeview.view radio:active {
2412
color: rgba(0, 0, 0, 0.8);
2413
}
2414
2415
treeview.view check:disabled,
2416
treeview.view radio:disabled {
2417
color: rgba(0, 0, 0, 0.24);
2418
}
2419
2420
treeview.view check:checked, treeview.view check:indeterminate,
2421
treeview.view radio:checked,
2422
treeview.view radio:indeterminate {
2423
color: #FF4081;
2424
}
2425
2426
treeview.view check:checked:disabled, treeview.view check:indeterminate:disabled,
2427
treeview.view radio:checked:disabled,
2428
treeview.view radio:indeterminate:disabled {
2429
color: rgba(255, 64, 129, 0.4);
2430
}
2431
2432
treeview.view check:selected,
2433
treeview.view radio:selected {
2434
color: rgba(255, 255, 255, 0.75);
2435
}
2436
2437
treeview.view check:selected:hover, treeview.view check:selected:active,
2438
treeview.view radio:selected:hover,
2439
treeview.view radio:selected:active {
2440
color: #FFFFFF;
2441
}
2442
2443
treeview.view check:selected:disabled,
2444
treeview.view radio:selected:disabled {
2445
color: rgba(255, 255, 255, 0.3);
2446
}
2447
2448
treeview.view check:selected:checked, treeview.view check:selected:indeterminate,
2449
treeview.view radio:selected:checked,
2450
treeview.view radio:selected:indeterminate {
2451
color: #FF4081;
2452
}
2453
2454
treeview.view check:selected:checked:disabled, treeview.view check:selected:indeterminate:disabled,
2455
treeview.view radio:selected:checked:disabled,
2456
treeview.view radio:selected:indeterminate:disabled {
2457
color: rgba(255, 64, 129, 0.4);
2458
}
2459
2460
treeview.view radio:checked {
2461
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-checked-symbolic.symbolic.png")));
2462
border-image: none;
2463
}
2464
2465
/************
2466
* GtkScale *
2467
************/
2468
scale {
2469
min-height: 8px;
2470
min-width: 8px;
2471
padding: 12px;
2472
}
2473
2474
scale * {
2475
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2476
}
2477
2478
scale slider {
2479
min-height: 24px;
2480
min-width: 24px;
2481
margin: -10px;
2482
}
2483
2484
scale trough {
2485
outline-offset: 2px;
2486
background-color: alpha(currentColor, 0.3);
2487
}
2488
2489
scale trough:disabled {
2490
color: rgba(0, 0, 0, 0.32);
2491
}
2492
2493
scale highlight {
2494
background-color: #FF4081;
2495
}
2496
2497
scale highlight:disabled {
2498
background-color: transparent;
2499
}
2500
2501
scale fill {
2502
background-color: alpha(currentColor, 0.3);
2503
}
2504
2505
scale fill:disabled {
2506
background-color: transparent;
2507
}
2508
2509
scale slider {
2510
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
2511
background-repeat: no-repeat;
2512
background-position: center;
2513
background-size: calc(100% - 8px);
2514
}
2515
2516
scale slider {
2517
background-image: -gtk-scaled(url("assets/scale-slider.png"), url("assets/scale-slider@2.png"));
2518
}
2519
2520
scale slider:disabled {
2521
background-image: -gtk-scaled(url("assets/scale-slider-disabled.png"), url("assets/scale-slider-disabled@2.png"));
2522
}
2523
2524
scale slider:hover {
2525
background-size: calc(100% - 4px);
2526
}
2527
2528
scale slider:active {
2529
background-size: calc(100% - 0px);
2530
}
2531
2532
scale.fine-tune slider {
2533
background-size: calc(100% - 12px);
2534
}
2535
2536
scale value {
2537
color: alpha(currentColor, 0.6);
2538
}
2539
2540
scale marks {
2541
color: alpha(currentColor, 0.3);
2542
}
2543
2544
scale marks.top {
2545
margin-bottom: 8px;
2546
margin-top: -16px;
2547
}
2548
2549
scale marks.bottom {
2550
margin-top: 8px;
2551
margin-bottom: -16px;
2552
}
2553
2554
scale marks.top {
2555
margin-right: 8px;
2556
margin-left: -16px;
2557
}
2558
2559
scale marks.bottom {
2560
margin-left: 8px;
2561
margin-right: -16px;
2562
}
2563
2564
scale.horizontal indicator {
2565
min-height: 8px;
2566
min-width: 1px;
2567
}
2568
2569
scale.vertical indicator {
2570
min-height: 1px;
2571
min-width: 8px;
2572
}
2573
2574
scale.horizontal.marks-before:not(.marks-after) slider {
2575
min-height: 30px;
2576
min-width: 24px;
2577
margin-top: -16px;
2578
background-position: center calc(100% - 4px);
2579
}
2580
2581
scale.horizontal.marks-before:not(.marks-after) slider {
2582
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider.png"), url("assets/scale-horz-marks-before-slider@2.png"));
2583
}
2584
2585
scale.horizontal.marks-before:not(.marks-after) slider:disabled {
2586
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider-disabled.png"), url("assets/scale-horz-marks-before-slider-disabled@2.png"));
2587
}
2588
2589
scale.horizontal.marks-before:not(.marks-after) slider:hover {
2590
background-position: center calc(100% - 2px);
2591
}
2592
2593
scale.horizontal.marks-before:not(.marks-after) slider:active {
2594
background-position: center calc(100% - 0px);
2595
}
2596
2597
scale.horizontal.marks-before:not(.marks-after).fine-tune slider {
2598
background-position: center calc(100% - 6px);
2599
}
2600
2601
scale.horizontal.marks-after:not(.marks-before) slider {
2602
min-height: 30px;
2603
min-width: 24px;
2604
margin-bottom: -16px;
2605
background-position: center calc(4px);
2606
}
2607
2608
scale.horizontal.marks-after:not(.marks-before) slider {
2609
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider.png"), url("assets/scale-horz-marks-after-slider@2.png"));
2610
}
2611
2612
scale.horizontal.marks-after:not(.marks-before) slider:disabled {
2613
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider-disabled.png"), url("assets/scale-horz-marks-after-slider-disabled@2.png"));
2614
}
2615
2616
scale.horizontal.marks-after:not(.marks-before) slider:hover {
2617
background-position: center calc(2px);
2618
}
2619
2620
scale.horizontal.marks-after:not(.marks-before) slider:active {
2621
background-position: center calc(0px);
2622
}
2623
2624
scale.horizontal.marks-after:not(.marks-before).fine-tune slider {
2625
background-position: center calc(6px);
2626
}
2627
2628
scale.vertical.marks-before:not(.marks-after) slider {
2629
min-height: 24px;
2630
min-width: 30px;
2631
margin-left: -16px;
2632
background-position: calc(4px) center;
2633
}
2634
2635
scale.vertical.marks-before:not(.marks-after) slider {
2636
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider.png"), url("assets/scale-vert-marks-before-slider@2.png"));
2637
}
2638
2639
scale.vertical.marks-before:not(.marks-after) slider:disabled {
2640
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider-disabled.png"), url("assets/scale-vert-marks-before-slider-disabled@2.png"));
2641
}
2642
2643
scale.vertical.marks-before:not(.marks-after) slider:hover {
2644
background-position: calc(2px) center;
2645
}
2646
2647
scale.vertical.marks-before:not(.marks-after) slider:active {
2648
background-position: calc(0px) center;
2649
}
2650
2651
scale.vertical.marks-before:not(.marks-after).fine-tune slider {
2652
background-position: calc(6px) center;
2653
}
2654
2655
scale.vertical.marks-after:not(.marks-before) slider {
2656
min-height: 24px;
2657
min-width: 30px;
2658
margin-right: -16px;
2659
background-position: calc(100% - 4px) center;
2660
}
2661
2662
scale.vertical.marks-after:not(.marks-before) slider {
2663
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider.png"), url("assets/scale-vert-marks-after-slider@2.png"));
2664
}
2665
2666
scale.vertical.marks-after:not(.marks-before) slider:disabled {
2667
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider-disabled.png"), url("assets/scale-vert-marks-after-slider-disabled@2.png"));
2668
}
2669
2670
scale.vertical.marks-after:not(.marks-before) slider:hover {
2671
background-position: calc(100% - 2px) center;
2672
}
2673
2674
scale.vertical.marks-after:not(.marks-before) slider:active {
2675
background-position: calc(100% - 0px) center;
2676
}
2677
2678
scale.vertical.marks-after:not(.marks-before).fine-tune slider {
2679
background-position: calc(100% - 6px) center;
2680
}
2681
2682
scale.color {
2683
min-height: 0;
2684
min-width: 0;
2685
}
2686
2687
scale.color.horizontal {
2688
padding: 0 0 12px 0;
2689
}
2690
2691
scale.color.horizontal slider:dir(ltr), scale.color.horizontal slider:dir(rtl) {
2692
margin-bottom: -12px;
2693
margin-top: -2px;
2694
}
2695
2696
scale.color.vertical:dir(ltr) {
2697
padding: 0 0 0 12px;
2698
}
2699
2700
scale.color.vertical:dir(ltr) slider {
2701
margin-left: -12px;
2702
margin-right: -2px;
2703
}
2704
2705
scale.color.vertical:dir(rtl) {
2706
padding: 0 12px 0 0;
2707
}
2708
2709
scale.color.vertical:dir(rtl) slider {
2710
margin-right: -12px;
2711
margin-left: -2px;
2712
}
2713
2714
/*****************
2715
* Progress bars *
2716
*****************/
2717
progressbar {
2718
color: rgba(0, 0, 0, 0.48);
2719
font-size: smaller;
2720
}
2721
2722
progressbar.horizontal trough,
2723
progressbar.horizontal progress {
2724
min-height: 4px;
2725
}
2726
2727
progressbar.vertical trough,
2728
progressbar.vertical progress {
2729
min-width: 4px;
2730
}
2731
2732
progressbar trough {
2733
background-color: rgba(66, 165, 245, 0.3);
2734
}
2735
2736
progressbar progress {
2737
background-color: #42A5F5;
2738
}
2739
2740
progressbar trough.empty progress {
2741
all: unset;
2742
}
2743
2744
/*************
2745
* Level Bar *
2746
*************/
2747
levelbar block {
2748
min-width: 32px;
2749
min-height: 4px;
2750
}
2751
2752
levelbar.vertical block {
2753
min-width: 4px;
2754
min-height: 32px;
2755
}
2756
2757
levelbar trough {
2758
padding: 2px;
2759
border-radius: 2px;
2760
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
2761
border-image: none;
2762
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2763
background-color: #FFFFFF;
2764
color: rgba(0, 0, 0, 0.8);
2765
}
2766
2767
levelbar trough:disabled {
2768
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2769
background-color: #FAFAFA;
2770
color: rgba(0, 0, 0, 0.32);
2771
}
2772
2773
levelbar.horizontal.discrete block {
2774
margin: 0 1px;
2775
}
2776
2777
levelbar.horizontal.discrete trough {
2778
padding: 2px 1px;
2779
}
2780
2781
levelbar.vertical.discrete block {
2782
margin: 1px 0;
2783
}
2784
2785
levelbar.vertical.discrete trough {
2786
padding: 1px 2px;
2787
}
2788
2789
levelbar block.low {
2790
background-color: #FF6D00;
2791
}
2792
2793
levelbar block.high, levelbar block:not(.empty) {
2794
background-color: #42A5F5;
2795
}
2796
2797
levelbar block.full {
2798
background-color: #00C853;
2799
}
2800
2801
levelbar block.empty {
2802
background-color: alpha(currentColor, 0.3);
2803
color: rgba(0, 0, 0, 0.32);
2804
}
2805
2806
/****************
2807
* Print dialog *
2808
*****************/
2809
printdialog paper {
2810
padding: 0;
2811
border: 1px solid rgba(0, 0, 0, 0.1);
2812
background-color: #FFFFFF;
2813
color: rgba(0, 0, 0, 0.8);
2814
}
2815
2816
printdialog .dialog-action-box {
2817
margin: 12px;
2818
}
2819
2820
/**********
2821
* Frames *
2822
**********/
2823
frame > border,
2824
.frame {
2825
margin: 0;
2826
padding: 0;
2827
border: 1px solid rgba(0, 0, 0, 0.1);
2828
border-radius: 0;
2829
box-shadow: none;
2830
}
2831
2832
frame > border.flat,
2833
.frame.flat,
2834
frame.flat > border {
2835
border-style: none;
2836
}
2837
2838
actionbar > revealer > box {
2839
padding: 6px;
2840
border-top: 1px solid rgba(0, 0, 0, 0.1);
2841
}
2842
2843
scrolledwindow viewport.frame {
2844
border-style: none;
2845
}
2846
2847
overshoot.top {
2848
background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2849
background-repeat: no-repeat;
2850
background-position: center top;
2851
background-color: transparent;
2852
border: none;
2853
box-shadow: none;
2854
}
2855
2856
overshoot.bottom {
2857
background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2858
background-repeat: no-repeat;
2859
background-position: center bottom;
2860
background-color: transparent;
2861
border: none;
2862
box-shadow: none;
2863
}
2864
2865
overshoot.left {
2866
background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2867
background-repeat: no-repeat;
2868
background-position: left center;
2869
background-color: transparent;
2870
border: none;
2871
box-shadow: none;
2872
}
2873
2874
overshoot.right {
2875
background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2876
background-repeat: no-repeat;
2877
background-position: right center;
2878
background-color: transparent;
2879
border: none;
2880
box-shadow: none;
2881
}
2882
2883
undershoot.top {
2884
background-color: transparent;
2885
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
2886
padding-top: 1px;
2887
background-size: 12px 1px;
2888
background-repeat: repeat-x;
2889
background-origin: content-box;
2890
background-position: left top;
2891
}
2892
2893
undershoot.bottom {
2894
background-color: transparent;
2895
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
2896
padding-bottom: 1px;
2897
background-size: 12px 1px;
2898
background-repeat: repeat-x;
2899
background-origin: content-box;
2900
background-position: left bottom;
2901
}
2902
2903
undershoot.left {
2904
background-color: transparent;
2905
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
2906
padding-left: 1px;
2907
background-size: 1px 12px;
2908
background-repeat: repeat-y;
2909
background-origin: content-box;
2910
background-position: left top;
2911
}
2912
2913
undershoot.right {
2914
background-color: transparent;
2915
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%);
2916
padding-right: 1px;
2917
background-size: 1px 12px;
2918
background-repeat: repeat-y;
2919
background-origin: content-box;
2920
background-position: right top;
2921
}
2922
2923
junction {
2924
border-style: solid none none solid;
2925
border-width: 1px;
2926
border-color: rgba(0, 0, 0, 0.1);
2927
background-color: #FFFFFF;
2928
}
2929
2930
junction:dir(rtl) {
2931
border-style: solid solid none none;
2932
}
2933
2934
separator {
2935
min-width: 1px;
2936
min-height: 1px;
2937
background-color: rgba(0, 0, 0, 0.1);
2938
}
2939
2940
/*********
2941
* Lists *
2942
*********/
2943
list {
2944
border-color: rgba(0, 0, 0, 0.1);
2945
background-color: #FFFFFF;
2946
}
2947
2948
list row {
2949
padding: 2px;
2950
}
2951
2952
row.activatable, .view, treeview.view header button {
2953
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);
2954
box-shadow: inset 0 0 0 9999px transparent;
2955
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
2956
background-repeat: no-repeat;
2957
background-position: center;
2958
background-size: 1000% 1000%;
2959
}
2960
2961
row.activatable:hover, .view:hover, treeview.view header button:hover {
2962
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);
2963
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.05);
2964
}
2965
2966
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 {
2967
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, background-size 0, background-image 0;
2968
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
2969
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
2970
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
2971
background-size: 0% 0%;
2972
}
2973
2974
/*********************
2975
* App Notifications *
2976
*********************/
2977
.app-notification {
2978
margin: 8px;
2979
}
2980
2981
.app-notification.frame,
2982
.app-notification border {
2983
border-style: none;
2984
}
2985
2986
/*************
2987
* Expanders *
2988
*************/
2989
expander arrow {
2990
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
2991
min-width: 16px;
2992
min-height: 16px;
2993
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
2994
-gtk-icon-transform: rotate(-90deg);
2995
color: rgba(0, 0, 0, 0.6);
2996
}
2997
2998
expander arrow:dir(rtl) {
2999
-gtk-icon-transform: rotate(90deg);
3000
}
3001
3002
expander arrow:checked {
3003
-gtk-icon-transform: unset;
3004
}
3005
3006
expander arrow:hover, expander arrow:active {
3007
color: rgba(0, 0, 0, 0.8);
3008
}
3009
3010
expander arrow:disabled {
3011
color: rgba(0, 0, 0, 0.24);
3012
}
3013
3014
expander arrow:selected {
3015
color: rgba(255, 255, 255, 0.75);
3016
}
3017
3018
expander arrow:selected:hover, expander arrow:selected:active {
3019
color: #FFFFFF;
3020
}
3021
3022
expander arrow:selected:disabled {
3023
color: rgba(255, 255, 255, 0.3);
3024
}
3025
3026
/************
3027
* Calendar *
3028
************/
3029
calendar {
3030
padding: 1px;
3031
border: 1px solid rgba(0, 0, 0, 0.1);
3032
color: rgba(0, 0, 0, 0.8);
3033
}
3034
3035
calendar:disabled {
3036
color: rgba(0, 0, 0, 0.32);
3037
}
3038
3039
calendar:selected {
3040
border-radius: 3px;
3041
}
3042
3043
calendar.header {
3044
border-style: none none solid;
3045
border-radius: 0;
3046
}
3047
3048
calendar.highlight {
3049
color: alpha(currentColor, 0.6);
3050
font-weight: 500;
3051
}
3052
3053
calendar:indeterminate {
3054
color: alpha(currentColor, 0.4);
3055
}
3056
3057
/***********
3058
* Dialogs *
3059
***********/
3060
messagedialog.background {
3061
background-color: #FAFAFA;
3062
}
3063
3064
messagedialog .titlebar {
3065
min-height: 20px;
3066
border-style: none;
3067
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
3068
background-color: #FAFAFA;
3069
color: rgba(0, 0, 0, 0.8);
3070
}
3071
3072
messagedialog .titlebar:backdrop {
3073
color: rgba(0, 0, 0, 0.6);
3074
}
3075
3076
messagedialog.csd.background {
3077
border-bottom-left-radius: 2px;
3078
border-bottom-right-radius: 2px;
3079
}
3080
3081
messagedialog.csd .dialog-action-area button {
3082
padding: 8px 16px;
3083
border-top: 1px solid rgba(0, 0, 0, 0.1);
3084
border-radius: 0;
3085
}
3086
3087
messagedialog.csd .dialog-action-area button:first-child {
3088
border-bottom-left-radius: 2px;
3089
}
3090
3091
messagedialog.csd .dialog-action-area button:last-child {
3092
border-bottom-right-radius: 2px;
3093
}
3094
3095
filechooser .dialog-action-box {
3096
border-top: 1px solid rgba(0, 0, 0, 0.1);
3097
}
3098
3099
filechooser #pathbarbox {
3100
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3101
background-color: #F5F5F5;
3102
}
3103
3104
filechooserbutton:drop(active) {
3105
box-shadow: none;
3106
}
3107
3108
/***********
3109
* Sidebar *
3110
***********/
3111
.sidebar {
3112
border-style: none;
3113
background-color: #FAFAFA;
3114
}
3115
3116
stacksidebar.sidebar:dir(ltr) list, stacksidebar.sidebar.left list, stacksidebar.sidebar.left:dir(rtl) list, .sidebar:dir(ltr), .sidebar.left, .sidebar.left:dir(rtl) {
3117
border-right: 1px solid rgba(0, 0, 0, 0.1);
3118
border-left-style: none;
3119
}
3120
3121
stacksidebar.sidebar:dir(rtl) list, stacksidebar.sidebar.right list, .sidebar:dir(rtl), .sidebar.right {
3122
border-left: 1px solid rgba(0, 0, 0, 0.1);
3123
border-right-style: none;
3124
}
3125
3126
.sidebar list {
3127
background-color: transparent;
3128
}
3129
3130
paned .sidebar.left, paned .sidebar.right, paned .sidebar.left:dir(rtl), paned .sidebar:dir(rtl), paned .sidebar:dir(ltr), paned .sidebar {
3131
border-style: none;
3132
}
3133
3134
stacksidebar row {
3135
padding: 10px 4px;
3136
}
3137
3138
stacksidebar row > label {
3139
padding-left: 6px;
3140
padding-right: 6px;
3141
}
3142
3143
/****************
3144
* File chooser *
3145
****************/
3146
placessidebar > viewport.frame {
3147
border-style: none;
3148
}
3149
3150
placessidebar list {
3151
padding: 1px 0 4px;
3152
}
3153
3154
placessidebar row {
3155
min-height: 32px;
3156
margin: -1px 0;
3157
padding: 0;
3158
}
3159
3160
placessidebar row > revealer {
3161
padding: 0 12px;
3162
}
3163
3164
placessidebar row:selected {
3165
color: #FFFFFF;
3166
}
3167
3168
placessidebar row:disabled {
3169
color: rgba(0, 0, 0, 0.32);
3170
}
3171
3172
placessidebar row image.sidebar-icon {
3173
opacity: 0.6;
3174
}
3175
3176
placessidebar row image.sidebar-icon:dir(ltr) {
3177
padding-right: 8px;
3178
}
3179
3180
placessidebar row image.sidebar-icon:dir(rtl) {
3181
padding-left: 8px;
3182
}
3183
3184
placessidebar row label.sidebar-label:dir(ltr) {
3185
padding-right: 2px;
3186
}
3187
3188
placessidebar row label.sidebar-label:dir(rtl) {
3189
padding-left: 2px;
3190
}
3191
3192
placessidebar row.sidebar-placeholder-row {
3193
min-height: 2px;
3194
padding: 0 8px;
3195
background-image: image(#FF4081);
3196
background-clip: content-box;
3197
}
3198
3199
placessidebar row.sidebar-new-bookmark-row {
3200
color: #FF4081;
3201
}
3202
3203
placessidebar row:drop(active):not(:disabled) {
3204
box-shadow: inset 0 0 0 2px #FF4081;
3205
}
3206
3207
placesview .server-list-button > image {
3208
-gtk-icon-transform: rotate(0turn);
3209
}
3210
3211
placesview .server-list-button:checked > image {
3212
-gtk-icon-transform: rotate(-0.5turn);
3213
}
3214
3215
placesview > actionbar > revealer > box > label {
3216
padding-left: 8px;
3217
padding-right: 8px;
3218
}
3219
3220
/*********
3221
* Paned *
3222
*********/
3223
paned > separator {
3224
min-width: 1px;
3225
min-height: 1px;
3226
-gtk-icon-source: none;
3227
border-style: none;
3228
background-color: transparent;
3229
background-image: image(rgba(0, 0, 0, 0.1));
3230
background-size: 1px 1px;
3231
background-clip: content-box;
3232
}
3233
3234
paned > separator.wide {
3235
min-width: 6px;
3236
min-height: 6px;
3237
background-color: #F5F5F5;
3238
background-image: image(rgba(0, 0, 0, 0.1)), image(rgba(0, 0, 0, 0.1));
3239
background-size: 1px 1px, 1px 1px;
3240
}
3241
3242
paned.horizontal > separator {
3243
background-repeat: repeat-y;
3244
}
3245
3246
paned.horizontal > separator:dir(ltr) {
3247
margin: 0 -8px 0 0;
3248
padding: 0 8px 0 0;
3249
background-position: left;
3250
}
3251
3252
paned.horizontal > separator:dir(rtl) {
3253
margin: 0 0 0 -8px;
3254
padding: 0 0 0 8px;
3255
background-position: right;
3256
}
3257
3258
paned.horizontal > separator.wide {
3259
margin: 0;
3260
padding: 0;
3261
background-repeat: repeat-y, repeat-y;
3262
background-position: left, right;
3263
}
3264
3265
paned.vertical > separator {
3266
margin: 0 0 -8px 0;
3267
padding: 0 0 8px 0;
3268
background-repeat: repeat-x;
3269
background-position: top;
3270
}
3271
3272
paned.vertical > separator.wide {
3273
margin: 0;
3274
padding: 0;
3275
background-repeat: repeat-x, repeat-x;
3276
background-position: bottom, top;
3277
}
3278
3279
/**************
3280
* GtkInfoBar *
3281
**************/
3282
infobar {
3283
border-style: none;
3284
}
3285
3286
infobar.info {
3287
background-color: #66BB6A;
3288
}
3289
3290
infobar.question {
3291
background-color: #42A5F5;
3292
}
3293
3294
infobar.warning {
3295
background-color: #FFA726;
3296
}
3297
3298
infobar.error {
3299
background-color: #EF5350;
3300
}
3301
3302
infobar.info > label, infobar.info, infobar.question > label, infobar.question, infobar.warning > label, infobar.warning, infobar.error > label, infobar.error {
3303
color: #FFFFFF;
3304
}
3305
3306
/************
3307
* Tooltips *
3308
************/
3309
tooltip {
3310
border-radius: 2px;
3311
box-shadow: none;
3312
}
3313
3314
tooltip.background {
3315
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
3316
background-color: rgba(255, 255, 255, 0.9);
3317
}
3318
3319
tooltip:not(.csd):not(.unity-csd) {
3320
border: 1px solid rgba(0, 0, 0, 0.1);
3321
border-radius: 3px;
3322
background-clip: padding-box;
3323
}
3324
3325
tooltip decoration {
3326
background-color: transparent;
3327
}
3328
3329
tooltip label {
3330
min-height: 20px;
3331
padding: 0 2px;
3332
}
3333
3334
/*****************
3335
* Color Chooser *
3336
*****************/
3337
colorswatch.top {
3338
border-top-left-radius: 2.5px;
3339
border-top-right-radius: 2.5px;
3340
}
3341
3342
colorswatch.top overlay {
3343
border-top-left-radius: 2px;
3344
border-top-right-radius: 2px;
3345
}
3346
3347
colorswatch.bottom {
3348
border-bottom-left-radius: 2.5px;
3349
border-bottom-right-radius: 2.5px;
3350
}
3351
3352
colorswatch.bottom overlay {
3353
border-bottom-left-radius: 2px;
3354
border-bottom-right-radius: 2px;
3355
}
3356
3357
colorswatch.left, colorswatch:first-child:not(.top) {
3358
border-top-left-radius: 2.5px;
3359
border-bottom-left-radius: 2.5px;
3360
}
3361
3362
colorswatch.left overlay, colorswatch:first-child:not(.top) overlay {
3363
border-top-left-radius: 2px;
3364
border-bottom-left-radius: 2px;
3365
}
3366
3367
colorswatch.right, colorswatch:last-child:not(.bottom) {
3368
border-top-right-radius: 2.5px;
3369
border-bottom-right-radius: 2.5px;
3370
}
3371
3372
colorswatch.right overlay, colorswatch:last-child:not(.bottom) overlay {
3373
border-top-right-radius: 2px;
3374
border-bottom-right-radius: 2px;
3375
}
3376
3377
colorswatch.dark overlay {
3378
color: #FFFFFF;
3379
}
3380
3381
colorswatch.light overlay {
3382
color: rgba(0, 0, 0, 0.8);
3383
}
3384
3385
colorswatch.dark {
3386
color: #FFFFFF;
3387
}
3388
3389
colorswatch.light {
3390
color: rgba(0, 0, 0, 0.8);
3391
}
3392
3393
colorswatch:drop(active) {
3394
box-shadow: none;
3395
}
3396
3397
colorswatch:drop(active).light overlay {
3398
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;
3399
}
3400
3401
colorswatch:drop(active).dark overlay {
3402
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;
3403
}
3404
3405
colorswatch overlay {
3406
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3407
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3408
}
3409
3410
colorswatch overlay:hover {
3411
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3412
}
3413
3414
colorswatch#add-color-button {
3415
border-radius: 2px 2px 0 0;
3416
color: #FFFFFF;
3417
}
3418
3419
colorswatch#add-color-button:only-child {
3420
border-radius: 2px;
3421
}
3422
3423
colorswatch#add-color-button overlay {
3424
background-image: linear-gradient(to right, #EF5350 25%, #FFA726 25%, #FFA726 50%, #66BB6A 50%, #66BB6A 75%, #42A5F5 75%);
3425
color: #FFFFFF;
3426
}
3427
3428
colorswatch:disabled {
3429
opacity: 0.4;
3430
}
3431
3432
colorswatch:disabled overlay {
3433
box-shadow: none;
3434
}
3435
3436
colorswatch#editor-color-sample {
3437
border-radius: 2.5px;
3438
}
3439
3440
colorswatch#editor-color-sample overlay {
3441
border-radius: 2px;
3442
}
3443
3444
colorchooser .popover.osd {
3445
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3446
border-radius: 2px;
3447
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);
3448
background-color: #FFFFFF;
3449
}
3450
3451
colorchooser .popover.osd:backdrop {
3452
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);
3453
}
3454
3455
/********
3456
* Misc *
3457
********/
3458
.content-view {
3459
background-color: #F5F5F5;
3460
}
3461
3462
/**********************
3463
* Window Decorations *
3464
**********************/
3465
decoration {
3466
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3467
border-radius: 2px 2px 0 0;
3468
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent;
3469
margin: 8px;
3470
}
3471
3472
decoration:backdrop {
3473
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent;
3474
}
3475
3476
.maximized decoration,
3477
.fullscreen decoration,
3478
.tiled decoration {
3479
border-radius: 0;
3480
}
3481
3482
.popup decoration {
3483
box-shadow: none;
3484
}
3485
3486
.ssd decoration {
3487
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16);
3488
}
3489
3490
.csd.popup decoration {
3491
border-radius: 2px;
3492
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3493
}
3494
3495
tooltip.csd decoration {
3496
border-radius: 2px;
3497
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3498
}
3499
3500
messagedialog.csd decoration {
3501
border-radius: 2px;
3502
}
3503
3504
.solid-csd decoration {
3505
margin: 0;
3506
border-radius: 0;
3507
box-shadow: none;
3508
background-color: #E0E0E0;
3509
}
3510
3511
.view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3512
entry selection, modelbutton.flat:selected,
3513
.menuitem.button.flat:selected, popover.background.menu button:checked,
3514
popover.background button.model:checked, row:selected, calendar:selected, text:selected {
3515
background-color: #42A5F5;
3516
}
3517
3518
row:selected label, label:selected, .view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3519
entry selection, modelbutton.flat:selected,
3520
.menuitem.button.flat:selected, popover.background.menu button:checked,
3521
popover.background button.model:checked, row:selected, calendar:selected, text:selected {
3522
color: #FFFFFF;
3523
}
3524
3525
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,
3526
entry selection:disabled, modelbutton.flat:disabled:selected,
3527
.menuitem.button.flat:disabled:selected, popover.background.menu button:disabled:checked,
3528
popover.background button.model:disabled:checked, row:disabled:selected, calendar:disabled:selected, text:disabled:selected {
3529
color: rgba(255, 255, 255, 0.4);
3530
}
3531
3532
.monospace {
3533
font-family: monospace;
3534
}
3535
3536
/**********************
3537
* Touch Copy & Paste *
3538
**********************/
3539
cursor-handle {
3540
border-radius: 9999px;
3541
background-color: #FF4081;
3542
background-image: none;
3543
}
3544
3545
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) {
3546
padding-left: 6px;
3547
border-top-right-radius: 0;
3548
}
3549
3550
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) {
3551
padding-right: 6px;
3552
border-top-left-radius: 0;
3553
}
3554
3555
cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) {
3556
-GtkWidget-text-handle-width: 24;
3557
-GtkWidget-text-handle-height: 30;
3558
-gtk-icon-source: -gtk-scaled(url("assets/scale-horz-marks-before-slider.png"), url("assets/scale-horz-marks-before-slider@2.png"));
3559
}
3560
3561
.context-menu {
3562
font: initial;
3563
}
3564
3565
.keycap {
3566
min-width: 12px;
3567
min-height: 26px;
3568
margin-top: 2px;
3569
padding-bottom: 2px;
3570
padding-left: 8px;
3571
padding-right: 8px;
3572
border: solid 1px rgba(0, 0, 0, 0.1);
3573
border-radius: 3px;
3574
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.1);
3575
background-color: #FFFFFF;
3576
color: rgba(0, 0, 0, 0.8);
3577
font-size: smaller;
3578
}
3579
3580
:not(decoration):not(window):drop(active) {
3581
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
3582
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;
3583
caret-color: #FF4081;
3584
}
3585
3586
stackswitcher button.text-button {
3587
min-width: 100px;
3588
}
3589
3590
stackswitcher button.circular,
3591
stackswitcher button.text-button.circular {
3592
min-width: 32px;
3593
min-height: 32px;
3594
padding: 0;
3595
}
3596
3597
/************
3598
* Nautilus *
3599
************/
3600
.nautilus-window,
3601
.nautilus-window notebook,
3602
.nautilus-window notebook > stack {
3603
background-color: #FFFFFF;
3604
}
3605
3606
.nautilus-desktop.nautilus-canvas-item:not(:selected), .caja-desktop.caja-canvas-item:not(:selected) {
3607
color: #FFFFFF;
3608
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3609
}
3610
3611
@keyframes needs_attention_keyframes {
3612
to {
3613
background-color: alpha(currentColor, 0.3);
3614
}
3615
}
3616
3617
.nautilus-operations-button-needs-attention {
3618
animation: needs_attention_keyframes 0.3s cubic-bezier(0.4, 0, 0.2, 1) 2 alternate;
3619
}
3620
3621
.nautilus-operations-button-needs-attention-multiple {
3622
animation: needs_attention_keyframes 0.3s cubic-bezier(0.4, 0, 0.2, 1) 4 alternate;
3623
}
3624
3625
.nautilus-window .floating-bar {
3626
min-height: 32px;
3627
padding: 0;
3628
border-style: solid solid none;
3629
border-width: 1px;
3630
border-color: rgba(0, 0, 0, 0.1);
3631
border-radius: 3px 3px 0 0;
3632
background-color: #FFFFFF;
3633
background-clip: padding-box;
3634
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), border-width 0;
3635
}
3636
3637
.nautilus-window .floating-bar.bottom.left {
3638
margin-right: 7px;
3639
border-left-style: none;
3640
border-top-left-radius: 0;
3641
}
3642
3643
.nautilus-window .floating-bar.bottom.right {
3644
margin-left: 7px;
3645
border-right-style: none;
3646
border-top-right-radius: 0;
3647
}
3648
3649
.nautilus-window .floating-bar button {
3650
margin: 6px;
3651
}
3652
3653
.disk-space-display.unknown {
3654
background-color: #FF6D00;
3655
}
3656
3657
.disk-space-display.used {
3658
background-color: #42A5F5;
3659
}
3660
3661
.disk-space-display.free {
3662
background-color: alpha(currentColor, 0.3);
3663
color: rgba(0, 0, 0, 0.32);
3664
}
3665
3666
.documents-entry-tag, .photos-entry-tag {
3667
margin: 3px -2px 3px 8px;
3668
padding: 0 8px;
3669
border-radius: 9999px;
3670
box-shadow: none;
3671
background-color: #42A5F5;
3672
color: #FFFFFF;
3673
}
3674
3675
.documents-entry-tag:hover, .photos-entry-tag:hover {
3676
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3677
}
3678
3679
.documents-entry-tag.button, .button.photos-entry-tag {
3680
margin: 0 -2px;
3681
padding: 4px;
3682
border-radius: 9999px;
3683
box-shadow: none;
3684
color: rgba(255, 255, 255, 0.75);
3685
}
3686
3687
.documents-entry-tag.button:hover, .button.photos-entry-tag:hover, .documents-entry-tag.button:active, .button.photos-entry-tag:active {
3688
color: #FFFFFF;
3689
}
3690
3691
.nautilus-window searchbar {
3692
border-top: 1px solid rgba(0, 0, 0, 0.1);
3693
}
3694
3695
.nautilus-window .searchbar-container {
3696
margin-top: -1px;
3697
}
3698
3699
.conflict-row:not(:selected) {
3700
background-color: #ffd3b3;
3701
}
3702
3703
.nautilus-window flowboxchild > widget > .icon-item-background {
3704
padding: 4px;
3705
border-radius: 2px;
3706
}
3707
3708
.nautilus-window flowboxchild:selected {
3709
background-color: transparent;
3710
}
3711
3712
.nautilus-window flowboxchild:selected > widget > .icon-item-background {
3713
background-color: #42A5F5;
3714
}
3715
3716
dialog.background > box.dialog-vbox.vertical > grid.horizontal > scrolledwindow.frame {
3717
border-style: none;
3718
}
3719
3720
dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal:last-child {
3721
margin: -6px 0 0 -6px;
3722
border-top: 1px solid rgba(0, 0, 0, 0.1);
3723
}
3724
3725
dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal:last-child > label {
3726
margin: 0 8px;
3727
}
3728
3729
dialog.background > box.dialog-vbox.vertical > grid.horizontal > box.horizontal:last-child > box > button {
3730
border-radius: 0;
3731
}
3732
3733
.nautilus-window > popover.menu:not(:last-child) {
3734
padding: 3px;
3735
}
3736
3737
.nautilus-window > popover.menu:not(:last-child) > stack > box > box > box {
3738
margin-top: -6px;
3739
}
3740
3741
.nautilus-window > popover.menu:not(:last-child) > stack > box > box > box > box {
3742
margin-bottom: -6px;
3743
}
3744
3745
.nautilus-window > popover.menu:not(:last-child) > stack > box > box > box > box.linked {
3746
margin-top: 1px;
3747
}
3748
3749
.nautilus-window > popover.menu:not(:last-child) separator {
3750
margin-bottom: -2px;
3751
}
3752
3753
.nautilus-menu-sort-heading {
3754
margin: 1px 3px;
3755
font-weight: 500;
3756
}
3757
3758
.nautilus-menu-sort-heading:disabled {
3759
color: rgba(0, 0, 0, 0.48);
3760
}
3761
3762
.nautilus-window paned > separator {
3763
background-color: #F5F5F5;
3764
}
3765
3766
/*********
3767
* gedit *
3768
*********/
3769
.open-document-selector-name-label {
3770
font-weight: bold;
3771
}
3772
3773
.open-document-selector-path-label {
3774
color: alpha(currentColor, 0.6);
3775
font-size: smaller;
3776
}
3777
3778
.gedit-document-panel {
3779
background-color: #FAFAFA;
3780
}
3781
3782
.gedit-document-panel row button.flat {
3783
margin-top: 8px;
3784
margin-bottom: 8px;
3785
}
3786
3787
.gedit-document-panel-group-row:not(:first-child) {
3788
border-top: 1px solid rgba(0, 0, 0, 0.1);
3789
}
3790
3791
.gedit-side-panel-paned statusbar {
3792
border-top: 1px solid rgba(0, 0, 0, 0.1);
3793
}
3794
3795
.gedit-search-slider {
3796
margin: 4px 4px 8px;
3797
}
3798
3799
.gedit-search-slider entry:dir(ltr), .gedit-search-slider entry:dir(rtl) {
3800
border-radius: 2px;
3801
}
3802
3803
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag, .gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
3804
all: unset;
3805
color: alpha(currentColor, 0.6);
3806
}
3807
3808
.gedit-search-slider entry:dir(ltr) {
3809
margin-right: -58px;
3810
padding-right: 58px;
3811
}
3812
3813
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag {
3814
margin-left: 6px;
3815
}
3816
3817
.gedit-search-slider entry:dir(ltr) image.right {
3818
margin-right: 0;
3819
}
3820
3821
.gedit-search-slider entry:dir(rtl) {
3822
margin-left: -58px;
3823
padding-left: 58px;
3824
}
3825
3826
.gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
3827
margin-right: 6px;
3828
}
3829
3830
.gedit-search-slider entry:dir(rtl) image.left {
3831
margin-left: 0;
3832
}
3833
3834
.gedit-search-slider entry.error ~ button {
3835
color: rgba(255, 255, 255, 0.75);
3836
}
3837
3838
.gedit-search-slider entry.error ~ button:hover, .gedit-search-slider entry.error ~ button:active {
3839
color: #FFFFFF;
3840
}
3841
3842
.gedit-search-slider entry.error ~ button:disabled {
3843
color: rgba(255, 255, 255, 0.3);
3844
}
3845
3846
.gedit-search-slider button {
3847
border: solid 6px transparent;
3848
}
3849
3850
.gedit-search-slider button:last-child:dir(ltr), .gedit-search-slider button:not(:first-child):dir(rtl) {
3851
margin-left: -3px;
3852
}
3853
3854
.gedit-search-slider button:first-child:dir(rtl), .gedit-search-slider button:not(:last-child):dir(ltr) {
3855
margin-right: -3px;
3856
}
3857
3858
frame.gedit-map-frame > border:dir(ltr) {
3859
border-style: none none none solid;
3860
}
3861
3862
frame.gedit-map-frame > border:dir(rtl) {
3863
border-style: none solid none none;
3864
}
3865
3866
/**************
3867
* Tweak Tool *
3868
**************/
3869
.tweak-categories {
3870
background-image: image(#FAFAFA);
3871
}
3872
3873
.tweak-categories separator {
3874
min-width: 0;
3875
min-height: 0;
3876
background-color: transparent;
3877
}
3878
3879
.tweak {
3880
padding: 3px;
3881
}
3882
3883
.tweak.title:hover {
3884
box-shadow: none;
3885
}
3886
3887
.tweak-group-white,
3888
.tweak-white,
3889
.tweak-white:hover {
3890
background-image: image(#FFFFFF);
3891
}
3892
3893
.tweak-startup,
3894
.tweak-startup:hover {
3895
background-image: image(#FFFFFF);
3896
}
3897
3898
.tweak-group-startup {
3899
background-image: image(#FFFFFF);
3900
border: 1px solid rgba(0, 0, 0, 0.1);
3901
}
3902
3903
/***********
3904
* Builder *
3905
***********/
3906
layouttabbar {
3907
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3908
background-color: #F5F5F5;
3909
}
3910
3911
layouttabbar > box > button {
3912
margin: 4px 0;
3913
}
3914
3915
layouttab {
3916
margin: 0 8px;
3917
border-style: none solid;
3918
border-width: 1px;
3919
border-color: rgba(0, 0, 0, 0.1);
3920
box-shadow: inset 0 -2px #42A5F5;
3921
background-color: #FFFFFF;
3922
}
3923
3924
layouttab separator.vertical {
3925
margin: 8px 4px;
3926
}
3927
3928
layouttab button.text-button, layouttab button.image-button, layouttab button {
3929
margin-top: 8px;
3930
margin-bottom: 8px;
3931
padding: 0 4px;
3932
}
3933
3934
layout {
3935
border: 1px solid rgba(0, 0, 0, 0.1);
3936
-PnlDockBin-handle-size: 1;
3937
}
3938
3939
entry.search-missing {
3940
background-color: #DD2C00;
3941
color: #FFFFFF;
3942
}
3943
3944
window.workbench treeview.image {
3945
color: alpha(currentColor, 0.6);
3946
}
3947
3948
window.workbench treeview.image:selected {
3949
color: rgba(255, 255, 255, 0.6);
3950
}
3951
3952
popover.popover-selector list {
3953
padding: 6px;
3954
}
3955
3956
popover.popover-selector list row {
3957
border-radius: 2px;
3958
}
3959
3960
popover.popover-selector list row image:dir(ltr) {
3961
margin-right: 6px;
3962
}
3963
3964
popover.popover-selector list row image:dir(rtl) {
3965
margin-left: 6px;
3966
}
3967
3968
popover.popover-selector list row .accel:dir(ltr) {
3969
margin-left: 6px;
3970
}
3971
3972
popover.popover-selector list row .accel:dir(rtl) {
3973
margin-right: 6px;
3974
}
3975
3976
omnibar.linked:not(.vertical) entry {
3977
border-radius: 2px;
3978
}
3979
3980
omnibar:not(:hover):not(:active) entry {
3981
color: rgba(0, 0, 0, 0.6);
3982
}
3983
3984
popover.omnibar list row:not(:last-child) {
3985
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3986
}
3987
3988
entry.preferences-search {
3989
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.1);
3990
background-color: #FFFFFF;
3991
}
3992
3993
preferences stacksidebar.sidebar list {
3994
background-color: #FAFAFA;
3995
}
3996
3997
preferences stacksidebar.sidebar:dir(ltr) list, preferences stacksidebar.sidebar:dir(rtl) list {
3998
border-style: none;
3999
}
4000
4001
preferences stacksidebar.sidebar list separator {
4002
min-width: 0;
4003
min-height: 0;
4004
background-color: transparent;
4005
}
4006
4007
preferences > box > box:dir(ltr) {
4008
border-right: 1px solid rgba(0, 0, 0, 0.1);
4009
}
4010
4011
preferences > box > box:dir(rtl) {
4012
border-left: 1px solid rgba(0, 0, 0, 0.1);
4013
}
4014
4015
popover.messagepopover.background {
4016
padding: 0;
4017
}
4018
4019
popover.messagepopover .popover-action-area button {
4020
padding: 8px 16px;
4021
border-top: 1px solid rgba(0, 0, 0, 0.1);
4022
border-radius: 0;
4023
}
4024
4025
popover.messagepopover .popover-action-area button:first-child {
4026
border-bottom-left-radius: 2px;
4027
}
4028
4029
popover.messagepopover .popover-action-area button:last-child {
4030
border-bottom-right-radius: 2px;
4031
}
4032
4033
popover.messagepopover .popover-content-area {
4034
margin: 16px;
4035
}
4036
4037
popover.transfers list {
4038
background-color: transparent;
4039
}
4040
4041
popover.transfers list row:not(:first-child) {
4042
border-top: 1px solid rgba(0, 0, 0, 0.1);
4043
}
4044
4045
popover.transfers list row > box {
4046
padding: 10px;
4047
}
4048
4049
dockbin {
4050
border: 1px solid rgba(0, 0, 0, 0.1);
4051
-PnlDockBin-handle-size: 1;
4052
}
4053
4054
dockpaned {
4055
border: 1px solid rgba(0, 0, 0, 0.1);
4056
}
4057
4058
eggsearchbar box.search-bar {
4059
padding: 0 8px;
4060
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4061
background-color: #F5F5F5;
4062
}
4063
4064
docktabstrip {
4065
padding: 0 8px;
4066
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4067
background-color: #F5F5F5;
4068
}
4069
4070
docktab {
4071
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
4072
min-height: 20px;
4073
min-width: 20px;
4074
margin-bottom: -1px;
4075
padding: 6px 6px;
4076
outline-offset: -6px;
4077
border-width: 1px;
4078
border-color: transparent;
4079
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 10%, transparent 0%);
4080
background-repeat: no-repeat;
4081
background-position: center;
4082
background-size: 0% 0%;
4083
color: rgba(0, 0, 0, 0.6);
4084
font-weight: 500;
4085
}
4086
4087
docktab:hover {
4088
box-shadow: inset 0 -2px alpha(currentColor, 0.3);
4089
color: rgba(0, 0, 0, 0.8);
4090
}
4091
4092
docktab:checked {
4093
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);
4094
box-shadow: inset 0 -2px #42A5F5;
4095
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
4096
background-size: 1000% 1000%;
4097
color: rgba(0, 0, 0, 0.8);
4098
}
4099
4100
dockoverlayedge {
4101
background-color: #F5F5F5;
4102
}
4103
4104
dockoverlayedge docktabstrip {
4105
padding: 0;
4106
border: none;
4107
}
4108
4109
dockoverlayedge.left-edge docktab:hover {
4110
box-shadow: inset -2px 0 alpha(currentColor, 0.3);
4111
}
4112
4113
dockoverlayedge.left-edge docktab:checked {
4114
box-shadow: inset -2px 0 #42A5F5;
4115
}
4116
4117
dockoverlayedge.right-edge docktab:hover {
4118
box-shadow: inset 2px 0 alpha(currentColor, 0.3);
4119
}
4120
4121
dockoverlayedge.right-edge docktab:checked {
4122
box-shadow: inset 2px 0 #42A5F5;
4123
}
4124
4125
pillbox {
4126
background-color: #F5F5F5;
4127
border-radius: 2px;
4128
}
4129
4130
layoutpane entry.search {
4131
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.1);
4132
background-color: #FFFFFF;
4133
}
4134
4135
editortweak entry.search {
4136
margin-bottom: -1px;
4137
box-shadow: none;
4138
}
4139
4140
.gb-search-entry-occurrences-tag {
4141
box-shadow: none;
4142
background-color: transparent;
4143
}
4144
4145
docktabstrip {
4146
min-height: 39px;
4147
}
4148
4149
window.workbench preferences preferencesgroup list entry {
4150
padding-top: 8px;
4151
padding-bottom: 8px;
4152
}
4153
4154
button.run-arrow-button {
4155
padding-left: 8px;
4156
padding-right: 8px;
4157
}
4158
4159
/**********
4160
* Photos *
4161
**********/
4162
GdMainIconView.content-view {
4163
-GdMainIconView-icon-size: 48;
4164
}
4165
4166
.documents-counter {
4167
margin: 8px;
4168
border-radius: 9999px;
4169
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
4170
background-color: #FF4081;
4171
color: #FFFFFF;
4172
font-weight: bold;
4173
}
4174
4175
.documents-scrolledwin.frame {
4176
border-style: none;
4177
}
4178
4179
.documents-scrolledwin.frame frame.content-view > border {
4180
border-style: none;
4181
}
4182
4183
.photos-fade-in {
4184
opacity: 1;
4185
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
4186
}
4187
4188
.photos-fade-out {
4189
opacity: 0;
4190
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
4191
}
4192
4193
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) {
4194
border-style: none none none solid;
4195
}
4196
4197
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(rtl) {
4198
border-style: none solid none none;
4199
}
4200
4201
/*********
4202
* Music *
4203
*********/
4204
.side-panel:dir(ltr) {
4205
border-style: solid;
4206
border-color: rgba(0, 0, 0, 0.1);
4207
}
4208
4209
.side-panel:dir(rtl) {
4210
border-style: solid;
4211
border-color: rgba(0, 0, 0, 0.1);
4212
}
4213
4214
.side-panel .view {
4215
background-image: image(#FAFAFA);
4216
}
4217
4218
.side-panel .view:hover {
4219
background-image: image(rgba(242, 242, 242, 0.99));
4220
}
4221
4222
.side-panel .view:selected {
4223
background-image: image(#42A5F5);
4224
}
4225
4226
.side-panel .view:selected:hover {
4227
background-image: image(#4baaf6);
4228
}
4229
4230
.songs-list:hover {
4231
background-image: image(alpha(currentColor, 0.05));
4232
}
4233
4234
frame.documents-dropdown {
4235
margin: 8px;
4236
}
4237
4238
frame.documents-dropdown > border {
4239
border: none;
4240
}
4241
4242
box.vertical > revealer > toolbar.search-bar {
4243
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4244
background-clip: border-box;
4245
}
4246
4247
box.vertical > revealer > toolbar.search-bar button > widget {
4248
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4249
}
4250
4251
/*********
4252
* To Do *
4253
*********/
4254
taskrow {
4255
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
4256
margin: 0 -8px;
4257
}
4258
4259
taskrow:hover {
4260
transition: none;
4261
}
4262
4263
taskrow label {
4264
margin: 0 8px;
4265
}
4266
4267
taskrow image {
4268
min-width: 16px;
4269
}
4270
4271
task-list-view > box > revealer > box > button {
4272
margin: -4px;
4273
}
4274
4275
/*******
4276
* eog *
4277
*******/
4278
#eog-thumb-nav scrolledwindow {
4279
border-top: none;
4280
}
4281
4282
#eog-thumb-nav button {
4283
-gtk-outline-radius: 2px;
4284
}
4285
4286
/*************
4287
* Evolution *
4288
*************/
4289
frame.taskbar > border {
4290
border-style: solid none none;
4291
}
4292
4293
box.vertical > paned.horizontal notebook widget .frame {
4294
border-style: none;
4295
}
4296
4297
/********
4298
* gitg *
4299
********/
4300
frame.commit-frame > border {
4301
border-style: solid none none;
4302
}
4303
4304
/**************
4305
* Characters *
4306
**************/
4307
box.dialog-vbox scrolledwindow.related {
4308
border: 1px solid rgba(0, 0, 0, 0.1);
4309
}
4310
4311
list.categories {
4312
background-image: image(#FAFAFA);
4313
}
4314
4315
/**************
4316
* Calculator *
4317
**************/
4318
button.title label {
4319
min-height: 32px;
4320
}
4321
4322
/*********
4323
* Tilix *
4324
*********/
4325
overlay > revealer.left > scrolledwindow.frame,
4326
overlay > revealer.right > scrolledwindow.frame {
4327
border-style: none;
4328
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22);
4329
}
4330
4331
overlay > revealer.left > scrolledwindow.frame {
4332
margin-right: 32px;
4333
}
4334
4335
overlay > revealer.right > scrolledwindow.frame {
4336
margin-left: 32px;
4337
}
4338
4339
.terminix-session-sidebar,
4340
.tilix-session-sidebar {
4341
background-image: image(#FAFAFA);
4342
}
4343
4344
button.image-button.session-new-button {
4345
min-width: 28px;
4346
}
4347
4348
/***********
4349
* Eclipse *
4350
***********/
4351
window.background > box.vertical > scrolledwindow > widget toolbar {
4352
padding: 2px;
4353
}
4354
4355
window.background > box.vertical > scrolledwindow > widget toolbar separator,
4356
window.background > box.vertical > scrolledwindow > widget toolbar button {
4357
margin: 2px;
4358
}
4359
4360
window.background > box.vertical > scrolledwindow > widget toolbar button {
4361
border-radius: 2px;
4362
}
4363
4364
/***********
4365
* Firefox *
4366
***********/
4367
window.background:not(.csd) > widget > separator {
4368
color: rgba(0, 0, 0, 0.2);
4369
}
4370
4371
window.background:not(.csd) > widget > scrollbar {
4372
background-clip: border-box;
4373
}
4374
4375
window.background:not(.csd) > widget > scrollbar,
4376
window.background:not(.csd) > widget > frame > border {
4377
border-color: rgba(0, 0, 0, 0.2);
4378
}
4379
4380
window.background:not(.csd) > widget > entry,
4381
window.background:not(.csd) > widget > button > button {
4382
border: 1px solid rgba(0, 0, 0, 0.2);
4383
border-radius: 3px;
4384
box-shadow: none;
4385
}
4386
4387
window.background:not(.csd) > widget > entry {
4388
min-height: 30px;
4389
}
4390
4391
window.background:not(.csd) > widget > entry:focus {
4392
border-color: #42A5F5;
4393
}
4394
4395
window.background:not(.csd) > widget > button > button {
4396
padding: 4px 8px;
4397
background-size: auto;
4398
}
4399
4400
window.background:not(.csd) > widget > button > button:hover {
4401
background-image: image(alpha(currentColor, 0.05));
4402
}
4403
4404
window.background:not(.csd) > widget > button > button:active {
4405
background-image: image(alpha(currentColor, 0.1));
4406
}
4407
4408
window.background:not(.csd) > window > menu,
4409
window.background:not(.csd) > menu > menu {
4410
border: none;
4411
}
4412
4413
window.background:not(.csd) > widget > menubar {
4414
color: rgba(0, 0, 0, 0.6);
4415
}
4416
4417
window.background:not(.csd) > widget > menubar:hover {
4418
color: rgba(0, 0, 0, 0.8);
4419
}
4420
4421
window.background:not(.csd) > widget > menubar:disabled {
4422
color: rgba(0, 0, 0, 0.24);
4423
}
4424
4425
window.background:not(.csd) > widget > frame {
4426
color: rgba(0, 0, 0, 0.2);
4427
}
4428
4429
window.background:not(.csd) > widget > checkbutton > check,
4430
window.background:not(.csd) > widget > radiobutton > radio {
4431
margin: 0;
4432
padding: 0;
4433
}
4434
4435
window.background:not(.csd) > window.background > menu > separator {
4436
color: rgba(0, 0, 0, 0.1);
4437
}
4438
4439
/***********
4440
* Synapse *
4441
***********/
4442
box.vertical > widget > widget:selected {
4443
background-color: #42A5F5;
4444
}
4445
4446
/*********
4447
* Unity *
4448
*********/
4449
UnityDecoration {
4450
-UnityDecoration-extents: 28px 0 0 0;
4451
-UnityDecoration-input-extents: 8px;
4452
-UnityDecoration-shadow-offset-x: 0;
4453
-UnityDecoration-shadow-offset-y: 3px;
4454
-UnityDecoration-active-shadow-color: rgba(0, 0, 0, 0.48);
4455
-UnityDecoration-active-shadow-radius: 18px;
4456
-UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32);
4457
-UnityDecoration-inactive-shadow-radius: 6px;
4458
-UnityDecoration-glow-size: 8px;
4459
-UnityDecoration-glow-color: #42A5F5;
4460
-UnityDecoration-title-indent: 4px;
4461
-UnityDecoration-title-fade: 32px;
4462
-UnityDecoration-title-alignment: 0.0;
4463
}
4464
4465
UnityDecoration .top {
4466
padding: 0 2px;
4467
border-style: none;
4468
border-radius: 2px 2px 0 0;
4469
box-shadow: inset 0 1px rgba(255, 255, 255, 0.2);
4470
background-color: #cfcfcf;
4471
color: rgba(0, 0, 0, 0.8);
4472
}
4473
4474
UnityDecoration .top:backdrop {
4475
color: rgba(0, 0, 0, 0.6);
4476
}
4477
4478
UnityDecoration .menuitem {
4479
color: alpha(currentColor, 0.75);
4480
}
4481
4482
UnityDecoration .menuitem:hover {
4483
box-shadow: inset 0 -2px #42A5F5;
4484
background-color: transparent;
4485
color: currentColor;
4486
}
4487
4488
.background:not(.csd) headerbar:not(.titlebar) {
4489
border-radius: 0;
4490
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
4491
}
4492
4493
.background:not(.csd) headerbar:not(.titlebar).inline-toolbar {
4494
border-style: none;
4495
}
4496
4497
UnityPanelWidget,
4498
.unity-panel {
4499
background-color: #cfcfcf;
4500
color: rgba(0, 0, 0, 0.8);
4501
}
4502
4503
UnityPanelWidget:backdrop,
4504
.unity-panel:backdrop {
4505
color: rgba(0, 0, 0, 0.6);
4506
}
4507
4508
.unity-panel.menuitem,
4509
.unity-panel .menuitem {
4510
color: alpha(currentColor, 0.75);
4511
}
4512
4513
.unity-panel.menubar.menuitem:hover,
4514
.unity-panel.menubar .menuitem *:hover {
4515
box-shadow: inset 0 -2px #42A5F5;
4516
background-color: transparent;
4517
color: currentColor;
4518
}
4519
4520
.menu IdoPlaybackMenuItem.menuitem:active {
4521
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
4522
animation: spin 1s linear infinite;
4523
color: #42A5F5;
4524
}
4525
4526
/**************
4527
* Mate-Panel *
4528
**************/
4529
.mate-panel-menu-bar menubar,
4530
#PanelApplet-window-menu-applet-button {
4531
background-color: transparent;
4532
}
4533
4534
#PanelPlug,
4535
PanelToplevel.background {
4536
background-color: #cfcfcf;
4537
color: rgba(0, 0, 0, 0.8);
4538
font-weight: 500;
4539
}
4540
4541
PanelToplevel > widget > button {
4542
padding: 0 4px;
4543
border-radius: 0;
4544
}
4545
4546
PanelSeparator {
4547
color: rgba(0, 0, 0, 0.1);
4548
}
4549
4550
MatePanelAppletFrameDBus {
4551
border-style: solid;
4552
border-width: 0 1px;
4553
border-color: rgba(0, 0, 0, 0.1);
4554
}
4555
4556
.mate-panel-menu-bar menubar menuitem {
4557
padding: 4px;
4558
}
4559
4560
.mate-panel-menu-bar menubar menu menuitem {
4561
padding: 6px;
4562
}
4563
4564
.mate-panel-menu-bar #PanelApplet button {
4565
-GtkWidget-window-dragging: true;
4566
padding: 4px;
4567
border-radius: 0;
4568
}
4569
4570
PanelApplet.wnck-applet .wnck-pager {
4571
background-color: transparent;
4572
color: #40C4FF;
4573
}
4574
4575
PanelApplet.wnck-applet .wnck-pager:hover {
4576
background-color: alpha(currentColor, 0.15);
4577
}
4578
4579
PanelApplet.wnck-applet .wnck-pager:active {
4580
background-color: alpha(currentColor, 0.3);
4581
}
4582
4583
PanelApplet.wnck-applet .wnck-pager:selected {
4584
background-color: #42A5F5;
4585
}
4586
4587
#MatePanelPopupWindow {
4588
border: 1px solid rgba(0, 0, 0, 0.1);
4589
border-radius: 3px;
4590
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
4591
}
4592
4593
#MatePanelPopupWindow frame > border {
4594
border-style: none;
4595
}
4596
4597
#MatePanelPopupWindow ClockMap {
4598
border: 1px solid rgba(0, 0, 0, 0.1);
4599
}
4600
4601
na-tray-applet {
4602
-NaTrayApplet-icon-padding: 3px;
4603
-NaTrayApplet-icon-size: 16;
4604
}
4605
4606
.mate-panel-menu-bar {
4607
-PanelMenuBar-icon-visible: true;
4608
}
4609
4610
.mate-panel-applet-slider {
4611
background-color: transparent;
4612
}
4613
4614
.mate-panel-applet-slider frame {
4615
border: 1px solid rgba(0, 0, 0, 0.1);
4616
border-radius: 3px;
4617
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
4618
background-color: #F5F5F5;
4619
}
4620
4621
.mate-panel-applet-slider frame frame {
4622
all: unset;
4623
}
4624
4625
.mate-panel-applet-slider frame > border {
4626
border-style: none;
4627
}
4628
4629
/*********************
4630
* CAJA File manager *
4631
*********************/
4632
.caja-navigation-window button.toggle.image-button {
4633
border-radius: 2px;
4634
}
4635
4636
.caja-pathbar button {
4637
margin: 0 -1px 0 -2px;
4638
}
4639
4640
.caja-pathbar button > widget {
4641
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4642
-GtkArrow-arrow-scaling: 1;
4643
}
4644
4645
.caja-side-pane notebook viewport.frame,
4646
.caja-side-pane notebook widget .vertical {
4647
background-color: #FFFFFF;
4648
}
4649
4650
.caja-side-pane notebook,
4651
.caja-notebook {
4652
border-top: 1px solid rgba(0, 0, 0, 0.1);
4653
}
4654
4655
.caja-side-pane notebook .frame,
4656
.caja-notebook .frame {
4657
border-style: none;
4658
}
4659
4660
.caja-navigation-window statusbar {
4661
margin: 0 -10px;
4662
padding: 0 4px;
4663
border-top: 1px solid rgba(0, 0, 0, 0.1);
4664
}
4665
4666
.caja-notebook frame > border {
4667
border-style: none;
4668
}
4669
4670
#caja-extra-view-widget {
4671
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4672
background-color: #F5F5F5;
4673
}
4674
4675
#caja-extra-view-widget > box > box > label {
4676
font-weight: bold;
4677
}
4678
4679
/*********
4680
* Pluma *
4681
*********/
4682
.pluma-window statusbar {
4683
margin: 0 -10px;
4684
padding: 0 4px;
4685
border-top: 1px solid rgba(0, 0, 0, 0.1);
4686
}
4687
4688
.pluma-window statusbar frame > border {
4689
border-style: none;
4690
}
4691
4692
.pluma-window statusbar frame button.flat {
4693
padding: 0 4px;
4694
border-radius: 0;
4695
}
4696
4697
.pluma-window statusbar frame button.flat widget {
4698
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4699
-GtkArrow-arrow-scaling: 1;
4700
}
4701
4702
.pluma-print-preview toolbar {
4703
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4704
}
4705
4706
.pluma-window paned.horizontal box.vertical box.horizontal button.flat {
4707
margin: 1px;
4708
}
4709
4710
.pluma-window paned.horizontal box.vertical .frame {
4711
border-style: none;
4712
}
4713
4714
.pluma-window paned.horizontal box.vertical notebook.frame {
4715
margin-top: -1px;
4716
border-top: 1px solid rgba(0, 0, 0, 0.1);
4717
}
4718
4719
.pluma-window paned.horizontal box.vertical notebook.frame box.vertical toolbar.horizontal {
4720
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4721
}
4722
4723
/*********
4724
* Atril *
4725
*********/
4726
.atril-window paned.horizontal box.vertical .frame {
4727
border-style: none;
4728
}
4729
4730
.atril-window paned.horizontal box.vertical notebook .frame {
4731
border-top: 1px solid rgba(0, 0, 0, 0.1);
4732
}
4733
4734
/* mate-screensaver lock dialog */
4735
.lock-dialog {
4736
border-radius: 2px;
4737
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);
4738
}
4739
4740
.lock-dialog frame > border {
4741
border-style: none;
4742
}
4743
4744
/************************
4745
* LightDM GTK+ Greeter *
4746
************************/
4747
#panel_window {
4748
background-color: rgba(0, 0, 0, 0.3);
4749
color: #FFFFFF;
4750
}
4751
4752
#panel_window menubar,
4753
#panel_window separator {
4754
background-color: transparent;
4755
}
4756
4757
#panel_window separator {
4758
padding: 0 4px;
4759
}
4760
4761
#panel_window separator:first-child {
4762
padding: 0 8px;
4763
}
4764
4765
#panel_window menubar > menuitem {
4766
color: rgba(255, 255, 255, 0.75);
4767
}
4768
4769
#panel_window menubar > menuitem:hover {
4770
color: #FFFFFF;
4771
}
4772
4773
#panel_window menubar > menuitem:disabled label {
4774
color: rgba(255, 255, 255, 0.3);
4775
}
4776
4777
#login_window,
4778
#shutdown_dialog,
4779
#restart_dialog {
4780
margin: 8px;
4781
border-radius: 2px;
4782
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);
4783
background-color: #FAFAFA;
4784
}
4785
4786
#content_frame {
4787
padding-bottom: 20px;
4788
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4789
}
4790
4791
#buttonbox_frame {
4792
padding-top: 24px;
4793
}
4794
4795
#buttonbox_frame button {
4796
margin: -16px;
4797
}
4798
4799
#greeter_infobar {
4800
margin-top: -1px;
4801
}
4802
4803
/* GTK NAMED COLORS
4804
----------------
4805
use responsibly! */
4806
/*
4807
widget text/foreground color */
4808
@define-color theme_fg_color rgba(0, 0, 0, 0.8);
4809
/*
4810
text color for entries, views and content in general */
4811
@define-color theme_text_color rgba(0, 0, 0, 0.8);
4812
/*
4813
widget base background color */
4814
@define-color theme_bg_color #F5F5F5;
4815
/*
4816
text widgets and the like base background color */
4817
@define-color theme_base_color #FFFFFF;
4818
/*
4819
base background color of selections */
4820
@define-color theme_selected_bg_color #42A5F5;
4821
/*
4822
text/foreground color of selections */
4823
@define-color theme_selected_fg_color #FFFFFF;
4824
/*
4825
base background color of insensitive widgets */
4826
@define-color insensitive_bg_color #F5F5F5;
4827
/*
4828
text foreground color of insensitive widgets */
4829
@define-color insensitive_fg_color rgba(0, 0, 0, 0.32);
4830
/*
4831
insensitive text widgets and the like base background color */
4832
@define-color insensitive_base_color #FAFAFA;
4833
/*
4834
widget text/foreground color on backdrop windows */
4835
@define-color theme_unfocused_fg_color rgba(0, 0, 0, 0.8);
4836
/*
4837
text color for entries, views and content in general on backdrop windows */
4838
@define-color theme_unfocused_text_color rgba(0, 0, 0, 0.8);
4839
/*
4840
widget base background color on backdrop windows */
4841
@define-color theme_unfocused_bg_color #F5F5F5;
4842
/*
4843
text widgets and the like base background color on backdrop windows */
4844
@define-color theme_unfocused_base_color #FFFFFF;
4845
/*
4846
base background color of selections on backdrop windows */
4847
@define-color theme_unfocused_selected_bg_color #42A5F5;
4848
/*
4849
text/foreground color of selections on backdrop windows */
4850
@define-color theme_unfocused_selected_fg_color #FFFFFF;
4851
/*
4852
insensitive color on backdrop windows */
4853
@define-color unfocused_insensitive_color rgba(0, 0, 0, 0.32);
4854
/*
4855
widgets main borders color */
4856
@define-color borders rgba(0, 0, 0, 0.1);
4857
/*
4858
widgets main borders color on backdrop windows */
4859
@define-color unfocused_borders rgba(0, 0, 0, 0.1);
4860
/*
4861
these are pretty self explicative */
4862
@define-color warning_color #FF6D00;
4863
@define-color error_color #DD2C00;
4864
@define-color success_color #00C853;
4865
/*
4866
FIXME this is really an API */
4867
@define-color content_view_bg #FFFFFF;
4868
@define-color placeholder_text_color rgba(128, 128, 128, 0.88);
4869