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-compact.css

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