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 • 134.46 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) .selection-menu,
1338
headerbar.selection-mode .selection-menu {
1339
padding-left: 16px;
1340
padding-right: 16px;
1341
}
1342
1343
.selection-mode.titlebar:not(headerbar) .selection-menu GtkArrow,
1344
headerbar.selection-mode .selection-menu GtkArrow {
1345
-GtkArrow-arrow-scaling: 1;
1346
}
1347
1348
.selection-mode.titlebar:not(headerbar) .selection-menu .arrow,
1349
headerbar.selection-mode .selection-menu .arrow {
1350
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1351
}
1352
1353
.fullscreen .titlebar:not(headerbar),
1354
.tiled .titlebar:not(headerbar),
1355
.maximized .titlebar:not(headerbar), .fullscreen
1356
headerbar,
1357
.tiled
1358
headerbar,
1359
.maximized
1360
headerbar {
1361
border-radius: 0;
1362
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1363
}
1364
1365
.default-decoration.titlebar:not(headerbar),
1366
headerbar.default-decoration {
1367
min-height: 20px;
1368
padding: 6px;
1369
box-shadow: inset 0 1px rgba(255, 255, 255, 0.15);
1370
}
1371
1372
.fullscreen .default-decoration.titlebar:not(headerbar),
1373
.tiled .default-decoration.titlebar:not(headerbar),
1374
.maximized .default-decoration.titlebar:not(headerbar), .fullscreen
1375
headerbar.default-decoration,
1376
.tiled
1377
headerbar.default-decoration,
1378
.maximized
1379
headerbar.default-decoration {
1380
box-shadow: none;
1381
}
1382
1383
.default-decoration.titlebar:not(headerbar) button.titlebutton,
1384
headerbar.default-decoration button.titlebutton {
1385
min-height: 20px;
1386
min-width: 20px;
1387
margin: 0;
1388
padding: 0;
1389
}
1390
1391
.background:not(.csd) .default-decoration.titlebar:not(headerbar) button.titlebutton:active, .background:not(.csd)
1392
headerbar.default-decoration button.titlebutton:active {
1393
background-size: 1000% 1000%;
1394
}
1395
1396
headerbar entry,
1397
headerbar spinbutton,
1398
headerbar button {
1399
margin-top: 6px;
1400
margin-bottom: 6px;
1401
}
1402
1403
headerbar switch {
1404
margin-top: 12px;
1405
margin-bottom: 12px;
1406
}
1407
1408
headerbar spinbutton button {
1409
margin-top: 0;
1410
margin-bottom: 0;
1411
}
1412
1413
.background:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) .titlebar {
1414
border-top-left-radius: 2px;
1415
border-top-right-radius: 2px;
1416
}
1417
1418
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) separator:first-child + headerbar,
1419
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) headerbar:first-child {
1420
border-top-left-radius: 2px;
1421
}
1422
1423
window:not(.tiled):not(.maximized):not(.fullscreen):not(.solid-csd) headerbar:last-child {
1424
border-top-right-radius: 2px;
1425
}
1426
1427
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 {
1428
border-top-left-radius: 2px;
1429
border-top-right-radius: 2px;
1430
}
1431
1432
window.csd > .titlebar:not(headerbar) {
1433
padding: 0;
1434
background-color: transparent;
1435
background-image: none;
1436
border-style: none;
1437
box-shadow: none;
1438
}
1439
1440
.titlebar:not(headerbar) > separator {
1441
background-color: #455A64;
1442
background-image: image(rgba(0, 0, 0, 0.1));
1443
}
1444
1445
/************
1446
* Pathbars *
1447
************/
1448
.caja-pathbar button,
1449
.path-bar button {
1450
padding-left: 4px;
1451
padding-right: 4px;
1452
}
1453
1454
.caja-pathbar button label:not(:only-child):first-child,
1455
.path-bar button label:not(:only-child):first-child {
1456
margin-left: 4px;
1457
}
1458
1459
.caja-pathbar button label:not(:only-child):last-child,
1460
.path-bar button label:not(:only-child):last-child {
1461
margin-right: 4px;
1462
}
1463
1464
.caja-pathbar button.slider-button,
1465
.path-bar button.slider-button {
1466
padding-left: 4px;
1467
padding-right: 4px;
1468
}
1469
1470
:not(headerbar) .caja-pathbar button, .caja-pathbar :not(headerbar) button, :not(headerbar)
1471
.path-bar button {
1472
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px;
1473
border-radius: 2px;
1474
}
1475
1476
:not(headerbar) .caja-pathbar button:checked, .caja-pathbar :not(headerbar) button:checked, :not(headerbar)
1477
.path-bar button:checked {
1478
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px;
1479
}
1480
1481
: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)
1482
.path-bar button:checked, :not(headerbar)
1483
.path-bar button:checked:disabled {
1484
background-color: transparent;
1485
}
1486
1487
/**************
1488
* Tree Views *
1489
**************/
1490
treeview.view {
1491
border-left-color: alpha(currentColor, 0.3);
1492
border-top-color: rgba(0, 0, 0, 0.1);
1493
}
1494
1495
* {
1496
-GtkTreeView-horizontal-separator: 4;
1497
-GtkTreeView-grid-line-width: 1;
1498
-GtkTreeView-grid-line-pattern: '';
1499
-GtkTreeView-tree-line-width: 1;
1500
-GtkTreeView-tree-line-pattern: '';
1501
-GtkTreeView-expander-size: 16;
1502
}
1503
1504
treeview.view:hover, treeview.view:active, treeview.view:selected {
1505
border-radius: 0;
1506
}
1507
1508
treeview.view.separator {
1509
min-height: 5px;
1510
color: rgba(0, 0, 0, 0.1);
1511
}
1512
1513
treeview.view:drop(active) {
1514
border-style: solid none;
1515
border-width: 1px;
1516
border-color: #FF4081;
1517
}
1518
1519
treeview.view:drop(active).after {
1520
border-top-style: none;
1521
}
1522
1523
treeview.view:drop(active).before {
1524
border-bottom-style: none;
1525
}
1526
1527
treeview.view.expander {
1528
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1529
-gtk-icon-transform: rotate(-90deg);
1530
color: rgba(0, 0, 0, 0.54);
1531
}
1532
1533
treeview.view.expander:dir(rtl) {
1534
-gtk-icon-transform: rotate(90deg);
1535
}
1536
1537
treeview.view.expander:checked {
1538
-gtk-icon-transform: unset;
1539
}
1540
1541
treeview.view.expander:hover, treeview.view.expander:active {
1542
color: rgba(0, 0, 0, 0.87);
1543
}
1544
1545
treeview.view.expander:disabled {
1546
color: rgba(0, 0, 0, 0.26);
1547
}
1548
1549
treeview.view.expander:selected {
1550
color: rgba(255, 255, 255, 0.7);
1551
}
1552
1553
treeview.view.expander:selected:hover, treeview.view.expander:selected:active {
1554
color: #FFFFFF;
1555
}
1556
1557
treeview.view.expander:selected:disabled {
1558
color: rgba(255, 255, 255, 0.3);
1559
}
1560
1561
treeview.view.progressbar {
1562
border-bottom: 4px solid #42A5F5;
1563
box-shadow: none;
1564
background-color: transparent;
1565
}
1566
1567
treeview.view.progressbar:selected {
1568
border-bottom-color: #FFFFFF;
1569
}
1570
1571
treeview.view.trough {
1572
border-bottom: 4px solid rgba(66, 165, 245, 0.3);
1573
box-shadow: none;
1574
background-color: transparent;
1575
}
1576
1577
treeview.view.trough:selected {
1578
border-bottom-color: rgba(255, 255, 255, 0.3);
1579
}
1580
1581
treeview.view header button {
1582
padding: 2px 6px;
1583
border-style: none solid solid none;
1584
border-width: 1px;
1585
border-color: rgba(0, 0, 0, 0.1);
1586
border-radius: 0;
1587
background-clip: border-box;
1588
}
1589
1590
treeview.view header button, treeview.view header button:hover, treeview.view header button:active {
1591
box-shadow: none;
1592
}
1593
1594
treeview.view header button, treeview.view header button:disabled {
1595
background-color: #FFFFFF;
1596
}
1597
1598
treeview.view header button:last-child {
1599
border-right-style: none;
1600
}
1601
1602
treeview.view button.dnd,
1603
treeview.view header.button.dnd {
1604
padding: 2px 6px;
1605
border-style: none solid solid;
1606
border-width: 1px;
1607
border-color: rgba(0, 0, 0, 0.1);
1608
border-radius: 0;
1609
box-shadow: none;
1610
background-color: #FFFFFF;
1611
background-clip: border-box;
1612
color: #42A5F5;
1613
}
1614
1615
treeview.view acceleditor > label {
1616
background-color: #42A5F5;
1617
}
1618
1619
/*********
1620
* Menus *
1621
*********/
1622
menubar,
1623
.menubar {
1624
-GtkWidget-window-dragging: true;
1625
padding: 0;
1626
background-color: #455A64;
1627
}
1628
1629
menubar > menuitem,
1630
.menubar > menuitem {
1631
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
1632
min-height: 20px;
1633
padding: 4px 8px;
1634
color: rgba(255, 255, 255, 0.7);
1635
}
1636
1637
menubar > menuitem:hover,
1638
.menubar > menuitem:hover {
1639
transition: none;
1640
background-color: rgba(255, 255, 255, 0.12);
1641
color: #FFFFFF;
1642
}
1643
1644
menubar > menuitem:disabled,
1645
.menubar > menuitem:disabled {
1646
color: rgba(255, 255, 255, 0.3);
1647
}
1648
1649
.csd.popup {
1650
background-color: transparent;
1651
}
1652
1653
menu,
1654
.menu,
1655
.context-menu {
1656
margin: 4px 0;
1657
padding: 4px 0;
1658
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
1659
background-color: #FFFFFF;
1660
border: 1px solid rgba(0, 0, 0, 0.1);
1661
}
1662
1663
.csd menu, .csd
1664
.menu, .csd
1665
.context-menu {
1666
border: none;
1667
border-radius: 2px;
1668
}
1669
1670
menu menuitem,
1671
.menu menuitem,
1672
.context-menu menuitem {
1673
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
1674
min-height: 20px;
1675
min-width: 40px;
1676
padding: 4px 8px;
1677
font: initial;
1678
text-shadow: none;
1679
}
1680
1681
menu menuitem:hover,
1682
.menu menuitem:hover,
1683
.context-menu menuitem:hover {
1684
transition: none;
1685
background-color: rgba(0, 0, 0, 0.12);
1686
}
1687
1688
menu menuitem:disabled,
1689
.menu menuitem:disabled,
1690
.context-menu menuitem:disabled {
1691
color: rgba(0, 0, 0, 0.38);
1692
}
1693
1694
menu menuitem arrow,
1695
.menu menuitem arrow,
1696
.context-menu menuitem arrow {
1697
min-height: 16px;
1698
min-width: 16px;
1699
}
1700
1701
menu menuitem arrow:dir(ltr),
1702
.menu menuitem arrow:dir(ltr),
1703
.context-menu menuitem arrow:dir(ltr) {
1704
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1705
margin-left: 8px;
1706
}
1707
1708
menu menuitem arrow:dir(rtl),
1709
.menu menuitem arrow:dir(rtl),
1710
.context-menu menuitem arrow:dir(rtl) {
1711
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl");
1712
margin-right: 8px;
1713
}
1714
1715
menu menuitem label:dir(rtl), menu menuitem label:dir(ltr),
1716
.menu menuitem label:dir(rtl),
1717
.menu menuitem label:dir(ltr),
1718
.context-menu menuitem label:dir(rtl),
1719
.context-menu menuitem label:dir(ltr) {
1720
color: inherit;
1721
}
1722
1723
menu > arrow,
1724
.menu > arrow,
1725
.context-menu > arrow {
1726
min-height: 16px;
1727
min-width: 16px;
1728
padding: 4px;
1729
background-color: #FFFFFF;
1730
color: rgba(0, 0, 0, 0.54);
1731
}
1732
1733
menu > arrow.top,
1734
.menu > arrow.top,
1735
.context-menu > arrow.top {
1736
margin-top: -4px;
1737
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
1738
border-radius: 2px 2px 0 0;
1739
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
1740
}
1741
1742
menu > arrow.bottom,
1743
.menu > arrow.bottom,
1744
.context-menu > arrow.bottom {
1745
margin-bottom: -12px;
1746
border-top: 1px solid rgba(0, 0, 0, 0.1);
1747
border-radius: 0 0 2px 2px;
1748
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1749
}
1750
1751
menu > arrow:hover,
1752
.menu > arrow:hover,
1753
.context-menu > arrow:hover {
1754
background-image: image(rgba(0, 0, 0, 0.12));
1755
color: rgba(0, 0, 0, 0.87);
1756
}
1757
1758
menu > arrow:disabled,
1759
.menu > arrow:disabled,
1760
.context-menu > arrow:disabled {
1761
border-color: transparent;
1762
background-color: transparent;
1763
color: transparent;
1764
}
1765
1766
menu separator,
1767
.menu separator,
1768
.context-menu separator {
1769
margin: 4px 0;
1770
}
1771
1772
menuitem accelerator {
1773
color: rgba(0, 0, 0, 0.54);
1774
}
1775
1776
.popup:not(.csd) menu menuitem {
1777
color: #212121;
1778
}
1779
1780
.popup:not(.csd) menu menuitem:hover {
1781
background-color: #E0E0E0;
1782
}
1783
1784
.popup:not(.csd) menu menuitem:disabled {
1785
color: #9E9E9E;
1786
}
1787
1788
.popup:not(.csd) menu accelerator {
1789
color: #757575;
1790
}
1791
1792
/************
1793
* Popovers *
1794
************/
1795
popover.background {
1796
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1797
padding: 2px;
1798
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
1799
background-color: #FAFAFA;
1800
}
1801
1802
popover.background:backdrop {
1803
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1804
}
1805
1806
popover.background, .csd popover.background {
1807
border-style: solid;
1808
border-width: 1px;
1809
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3);
1810
border-radius: 3px;
1811
}
1812
1813
popover.background > stack {
1814
margin: -4px;
1815
}
1816
1817
popover.background > toolbar {
1818
margin: -2px;
1819
}
1820
1821
popover.background > list,
1822
popover.background > .view,
1823
popover.background > toolbar {
1824
border-style: none;
1825
box-shadow: none;
1826
background-color: transparent;
1827
}
1828
1829
popover.background.menu button,
1830
popover.background button.model {
1831
min-height: 32px;
1832
padding: 0 8px;
1833
border-radius: 2px;
1834
}
1835
1836
popover.background separator {
1837
margin: 4px 0;
1838
}
1839
1840
popover.background list separator {
1841
margin: 0;
1842
}
1843
1844
/*************
1845
* Notebooks *
1846
*************/
1847
notebook > header {
1848
border-width: 1px;
1849
border-color: rgba(0, 0, 0, 0.1);
1850
background-color: #F5F5F5;
1851
background-clip: border-box;
1852
}
1853
1854
notebook > header.top {
1855
border-bottom-style: solid;
1856
}
1857
1858
notebook > header.top > tabs {
1859
margin-bottom: -1px;
1860
}
1861
1862
notebook > header.top > tabs > tab:hover {
1863
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.26);
1864
}
1865
1866
notebook > header.top > tabs > tab:checked {
1867
box-shadow: inset 0 -2px #42A5F5;
1868
}
1869
1870
notebook > header.bottom {
1871
border-top-style: solid;
1872
}
1873
1874
notebook > header.bottom > tabs {
1875
margin-top: -1px;
1876
}
1877
1878
notebook > header.bottom > tabs > tab:hover {
1879
box-shadow: inset 0 2px rgba(0, 0, 0, 0.26);
1880
}
1881
1882
notebook > header.bottom > tabs > tab:checked {
1883
box-shadow: inset 0 2px #42A5F5;
1884
}
1885
1886
notebook > header.left {
1887
border-right-style: solid;
1888
}
1889
1890
notebook > header.left > tabs {
1891
margin-right: -1px;
1892
}
1893
1894
notebook > header.left > tabs > tab:hover {
1895
box-shadow: inset -2px 0 rgba(0, 0, 0, 0.26);
1896
}
1897
1898
notebook > header.left > tabs > tab:checked {
1899
box-shadow: inset -2px 0 #42A5F5;
1900
}
1901
1902
notebook > header.right {
1903
border-left-style: solid;
1904
}
1905
1906
notebook > header.right > tabs {
1907
margin-left: -1px;
1908
}
1909
1910
notebook > header.right > tabs > tab:hover {
1911
box-shadow: inset 2px 0 rgba(0, 0, 0, 0.26);
1912
}
1913
1914
notebook > header.right > tabs > tab:checked {
1915
box-shadow: inset 2px 0 #42A5F5;
1916
}
1917
1918
notebook > header.top > tabs > arrow {
1919
border-top-style: none;
1920
}
1921
1922
notebook > header.bottom > tabs > arrow {
1923
border-bottom-style: none;
1924
}
1925
1926
notebook > header.top > tabs > arrow, notebook > header.bottom > tabs > arrow {
1927
padding-left: 4px;
1928
padding-right: 4px;
1929
}
1930
1931
notebook > header.top > tabs > arrow.down, notebook > header.bottom > tabs > arrow.down {
1932
margin-left: -8px;
1933
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
1934
}
1935
1936
notebook > header.top > tabs > arrow.up, notebook > header.bottom > tabs > arrow.up {
1937
margin-right: -8px;
1938
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
1939
}
1940
1941
notebook > header.left > tabs > arrow {
1942
border-left-style: none;
1943
}
1944
1945
notebook > header.right > tabs > arrow {
1946
border-right-style: none;
1947
}
1948
1949
notebook > header.left > tabs > arrow, notebook > header.right > tabs > arrow {
1950
padding-top: 4px;
1951
padding-bottom: 4px;
1952
}
1953
1954
notebook > header.left > tabs > arrow.down, notebook > header.right > tabs > arrow.down {
1955
margin-top: -8px;
1956
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
1957
}
1958
1959
notebook > header.left > tabs > arrow.up, notebook > header.right > tabs > arrow.up {
1960
margin-bottom: -8px;
1961
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
1962
}
1963
1964
notebook > header > tabs > arrow {
1965
min-height: 16px;
1966
min-width: 16px;
1967
border-radius: 0;
1968
}
1969
1970
notebook > header tab {
1971
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
1972
min-height: 20px;
1973
min-width: 20px;
1974
padding: 6px 12px;
1975
outline-offset: -6px;
1976
border-width: 1px;
1977
border-color: transparent;
1978
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 10%, transparent 0%);
1979
background-repeat: no-repeat;
1980
background-position: center;
1981
background-size: 0% 0%;
1982
color: rgba(0, 0, 0, 0.54);
1983
font-weight: 500;
1984
}
1985
1986
notebook > header tab:hover {
1987
color: rgba(0, 0, 0, 0.87);
1988
}
1989
1990
notebook > header tab:hover.reorderable-page {
1991
border-color: rgba(0, 0, 0, 0.1);
1992
background-color: #FAFAFA;
1993
}
1994
1995
notebook > header tab:disabled {
1996
color: rgba(0, 0, 0, 0.26);
1997
}
1998
1999
notebook > header tab:checked {
2000
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);
2001
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
2002
background-size: 1000% 1000%;
2003
color: rgba(0, 0, 0, 0.87);
2004
}
2005
2006
notebook > header tab:checked:disabled {
2007
color: rgba(0, 0, 0, 0.38);
2008
}
2009
2010
notebook > header tab:checked.reorderable-page {
2011
border-color: rgba(0, 0, 0, 0.1);
2012
background-color: #FFFFFF;
2013
}
2014
2015
notebook > header tab button.flat:last-child {
2016
margin-left: 6px;
2017
margin-right: -6px;
2018
}
2019
2020
notebook > header tab button.flat:first-child {
2021
margin-left: -6px;
2022
margin-right: 6px;
2023
}
2024
2025
notebook > header.top tabs, notebook > header.bottom tabs {
2026
padding-left: 8px;
2027
padding-right: 8px;
2028
}
2029
2030
notebook > header.top tabs:not(:only-child):first-child, notebook > header.bottom tabs:not(:only-child):first-child {
2031
margin-left: 0;
2032
}
2033
2034
notebook > header.top tabs:not(:only-child):last-child, notebook > header.bottom tabs:not(:only-child):last-child {
2035
margin-right: 0;
2036
}
2037
2038
notebook > header.top tabs tab.reorderable-page, notebook > header.bottom tabs tab.reorderable-page {
2039
margin: 0 -1px;
2040
border-style: none solid;
2041
}
2042
2043
notebook > header.left tabs, notebook > header.right tabs {
2044
padding-top: 8px;
2045
padding-bottom: 8px;
2046
}
2047
2048
notebook > header.left tabs:not(:only-child):first-child, notebook > header.right tabs:not(:only-child):first-child {
2049
margin-top: 0;
2050
}
2051
2052
notebook > header.left tabs:not(:only-child):last-child, notebook > header.right tabs:not(:only-child):last-child {
2053
margin-bottom: 0;
2054
}
2055
2056
notebook > header.left tabs tab.reorderable-page, notebook > header.right tabs tab.reorderable-page {
2057
margin: -1px 0;
2058
border-style: solid none;
2059
}
2060
2061
notebook > stack:not(:only-child) {
2062
background-color: #FFFFFF;
2063
}
2064
2065
/**************
2066
* Scrollbars *
2067
**************/
2068
scrollbar {
2069
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2070
background-color: #FFFFFF;
2071
background-clip: padding-box;
2072
}
2073
2074
* {
2075
-GtkScrollbar-has-backward-stepper: false;
2076
-GtkScrollbar-has-forward-stepper: false;
2077
}
2078
2079
scrollbar.top {
2080
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
2081
}
2082
2083
scrollbar.bottom {
2084
border-top: 1px solid rgba(0, 0, 0, 0.1);
2085
}
2086
2087
scrollbar.left {
2088
border-right: 1px solid rgba(0, 0, 0, 0.1);
2089
}
2090
2091
scrollbar.right {
2092
border-left: 1px solid rgba(0, 0, 0, 0.1);
2093
}
2094
2095
scrollbar slider {
2096
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0;
2097
min-width: 8px;
2098
min-height: 8px;
2099
border: 4px solid transparent;
2100
border-radius: 9999px;
2101
background-clip: padding-box;
2102
background-color: rgba(0, 0, 0, 0.38);
2103
}
2104
2105
scrollbar slider:hover {
2106
background-color: rgba(0, 0, 0, 0.54);
2107
}
2108
2109
scrollbar slider:active {
2110
background-color: rgba(0, 0, 0, 0.87);
2111
}
2112
2113
scrollbar slider:disabled {
2114
background-color: rgba(0, 0, 0, 0.26);
2115
}
2116
2117
scrollbar.fine-tune slider {
2118
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0, min-width 0, min-height 0;
2119
min-width: 4px;
2120
min-height: 4px;
2121
}
2122
2123
scrollbar.fine-tune.horizontal slider {
2124
margin: 2px 0;
2125
}
2126
2127
scrollbar.fine-tune.vertical slider {
2128
margin: 0 2px;
2129
}
2130
2131
scrollbar.overlay-indicator:not(.dragging):not(.hovering) {
2132
border-color: transparent;
2133
background-color: transparent;
2134
}
2135
2136
scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider {
2137
min-width: 4px;
2138
min-height: 4px;
2139
margin: 3px;
2140
border: 1px solid rgba(255, 255, 255, 0.3);
2141
}
2142
2143
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button {
2144
min-width: 4px;
2145
min-height: 4px;
2146
margin: 3px;
2147
border: 1px solid rgba(255, 255, 255, 0.3);
2148
border-radius: 9999px;
2149
background-color: rgba(0, 0, 0, 0.38);
2150
background-clip: padding-box;
2151
-gtk-icon-source: none;
2152
}
2153
2154
scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled {
2155
background-color: rgba(0, 0, 0, 0.26);
2156
}
2157
2158
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider {
2159
min-width: 24px;
2160
}
2161
2162
scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal button {
2163
min-width: 8px;
2164
}
2165
2166
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider {
2167
min-height: 24px;
2168
}
2169
2170
scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button {
2171
min-height: 8px;
2172
}
2173
2174
scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering {
2175
background-color: rgba(255, 255, 255, 0.9);
2176
}
2177
2178
scrollbar.horizontal slider {
2179
min-width: 24px;
2180
}
2181
2182
scrollbar.vertical slider {
2183
min-height: 24px;
2184
}
2185
2186
scrollbar button {
2187
min-width: 16px;
2188
min-height: 16px;
2189
padding: 0;
2190
border-radius: 0;
2191
}
2192
2193
scrollbar.vertical button.down {
2194
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
2195
}
2196
2197
scrollbar.vertical button.up {
2198
-gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
2199
}
2200
2201
scrollbar.horizontal button.down {
2202
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
2203
}
2204
2205
scrollbar.horizontal button.up {
2206
-gtk-icon-source: -gtk-icontheme("pan-start-symbolic");
2207
}
2208
2209
/**********
2210
* Switch *
2211
**********/
2212
switch {
2213
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2214
margin: 6px 0;
2215
padding: 0 2px;
2216
border: 4px solid transparent;
2217
border-radius: 9999px;
2218
background-color: rgba(0, 0, 0, 0.26);
2219
background-clip: padding-box;
2220
font-size: 0;
2221
}
2222
2223
switch:disabled {
2224
background-color: rgba(0, 0, 0, 0.12);
2225
}
2226
2227
switch:checked {
2228
background-color: rgba(255, 64, 129, 0.5);
2229
}
2230
2231
switch:checked:disabled {
2232
background-color: rgba(255, 64, 129, 0.3);
2233
}
2234
2235
switch slider {
2236
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
2237
min-width: 20px;
2238
min-height: 20px;
2239
margin: -3px -2px;
2240
border-radius: 9999px;
2241
-gtk-outline-radius: 9999px;
2242
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2243
background-color: #FFFFFF;
2244
}
2245
2246
switch:hover slider {
2247
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2248
}
2249
2250
switch:checked slider {
2251
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;
2252
animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1);
2253
background-color: #FF4081;
2254
color: #FFFFFF;
2255
}
2256
2257
switch:disabled slider {
2258
background-color: #FAFAFA;
2259
}
2260
2261
switch:checked:disabled slider {
2262
animation: none;
2263
}
2264
2265
/*************************
2266
* Check and Radio items *
2267
*************************/
2268
.view.content-view.check:not(list),
2269
.content-view .tile check:not(list) {
2270
min-height: 40px;
2271
min-width: 40px;
2272
margin: 0;
2273
padding: 0;
2274
box-shadow: none;
2275
background-color: transparent;
2276
background-image: none;
2277
-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2278
}
2279
2280
.view.content-view.check:not(list):hover, .view.content-view.check:not(list):active,
2281
.content-view .tile check:not(list):hover,
2282
.content-view .tile check:not(list):active {
2283
-gtk-icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
2284
}
2285
2286
.view.content-view.check:not(list),
2287
.content-view .tile check:not(list) {
2288
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-unchecked.png"), url("assets/selectionmode-checkbox-unchecked@2.png"));
2289
}
2290
2291
.view.content-view.check:not(list):checked,
2292
.content-view .tile check:not(list):checked {
2293
-gtk-icon-source: -gtk-scaled(url("assets/selectionmode-checkbox-checked.png"), url("assets/selectionmode-checkbox-checked@2.png"));
2294
}
2295
2296
checkbutton.text-button,
2297
radiobutton.text-button {
2298
padding: 2px;
2299
outline-offset: 0;
2300
}
2301
2302
checkbutton.text-button label:not(:only-child),
2303
radiobutton.text-button label:not(:only-child) {
2304
margin: 0 4px;
2305
}
2306
2307
check,
2308
radio {
2309
min-height: 24px;
2310
min-width: 24px;
2311
margin: -10px;
2312
padding: 10px;
2313
}
2314
2315
check:checked, check:indeterminate,
2316
radio:checked,
2317
radio:indeterminate {
2318
color: #FF4081;
2319
}
2320
2321
check:checked:disabled, check:indeterminate:disabled,
2322
radio:checked:disabled,
2323
radio:indeterminate:disabled {
2324
color: rgba(255, 64, 129, 0.5);
2325
}
2326
2327
row:selected check:not(:checked):not(:indeterminate), row:selected
2328
radio:not(:checked):not(:indeterminate) {
2329
color: rgba(255, 255, 255, 0.7);
2330
}
2331
2332
row:selected check:not(:checked):not(:indeterminate):hover, row:selected check:not(:checked):not(:indeterminate):active, row:selected
2333
radio:not(:checked):not(:indeterminate):hover, row:selected
2334
radio:not(:checked):not(:indeterminate):active {
2335
color: #FFFFFF;
2336
}
2337
2338
row:selected check:not(:checked):not(:indeterminate):disabled, row:selected
2339
radio:not(:checked):not(:indeterminate):disabled {
2340
color: rgba(255, 255, 255, 0.3);
2341
}
2342
2343
popover check, popover check:hover, popover check:disabled, popover
2344
radio, popover
2345
radio:hover, popover
2346
radio:disabled {
2347
box-shadow: none;
2348
background-image: none;
2349
}
2350
2351
popover check:not(:checked):not(:indeterminate):not(:disabled), popover
2352
radio:not(:checked):not(:indeterminate):not(:disabled) {
2353
color: rgba(0, 0, 0, 0.54);
2354
}
2355
2356
popover check.left:dir(rtl), popover
2357
radio.left:dir(rtl) {
2358
margin-left: -16px;
2359
margin-right: -8px;
2360
}
2361
2362
popover check.right:dir(ltr), popover
2363
radio.right:dir(ltr) {
2364
margin-left: -8px;
2365
margin-right: -16px;
2366
}
2367
2368
menu menuitem check, menu menuitem
2369
radio {
2370
transition: none;
2371
min-height: 16px;
2372
min-width: 16px;
2373
margin: 0;
2374
padding: 0;
2375
}
2376
2377
menu menuitem check:dir(ltr), menu menuitem
2378
radio:dir(ltr) {
2379
margin-right: 8px;
2380
}
2381
2382
menu menuitem check:dir(rtl), menu menuitem
2383
radio:dir(rtl) {
2384
margin-left: 8px;
2385
}
2386
2387
menu menuitem check:not(:checked):not(:indeterminate):not(:disabled), menu menuitem
2388
radio:not(:checked):not(:indeterminate):not(:disabled) {
2389
color: rgba(0, 0, 0, 0.54);
2390
}
2391
2392
menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem
2393
radio, menu menuitem
2394
radio:hover, menu menuitem
2395
radio:disabled {
2396
box-shadow: none;
2397
}
2398
2399
2400
check {
2401
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-unchecked-symbolic.symbolic.png")));
2402
}
2403
2404
2405
check:checked {
2406
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-checked-symbolic.symbolic.png")));
2407
}
2408
2409
2410
check:indeterminate {
2411
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/checkbox-mixed-symbolic.symbolic.png")));
2412
}
2413
2414
2415
radio {
2416
border-image-slice: 22;
2417
border-image-width: 22px;
2418
}
2419
2420
2421
radio {
2422
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-unchecked-symbolic.symbolic.png")));
2423
}
2424
2425
2426
radio:indeterminate {
2427
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-mixed-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-mixed-symbolic.symbolic.png")));
2428
}
2429
2430
2431
radio {
2432
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent));
2433
}
2434
2435
2436
radio:checked:not(:indeterminate) {
2437
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.11364, to(#FF4081), to(transparent));
2438
}
2439
2440
2441
radio:checked:not(:indeterminate):disabled {
2442
border-image-source: -gtk-gradient(radial, center center, 0, center center, 0.11364, to(rgba(255, 64, 129, 0.5)), to(transparent));
2443
}
2444
2445
window.background:not(.csd) > widget > checkbutton > check,
2446
menu menuitem check {
2447
border-radius: 2px;
2448
-gtk-outline-radius: 2px;
2449
-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")));
2450
}
2451
2452
window.background:not(.csd) > widget > checkbutton > check:checked,
2453
menu menuitem check:checked {
2454
-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")));
2455
}
2456
2457
window.background:not(.csd) > widget > checkbutton > check:indeterminate,
2458
menu menuitem check:indeterminate {
2459
-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")));
2460
}
2461
2462
window.background:not(.csd) > widget > radiobutton > radio,
2463
menu menuitem radio {
2464
border-image: none;
2465
-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")));
2466
}
2467
2468
window.background:not(.csd) > widget > radiobutton > radio:checked,
2469
menu menuitem radio:checked {
2470
-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")));
2471
}
2472
2473
window.background:not(.csd) > widget > radiobutton > radio:indeterminate,
2474
menu menuitem radio:indeterminate {
2475
-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")));
2476
}
2477
2478
check:not(:checked):active {
2479
-gtk-icon-transform: rotate(90deg);
2480
}
2481
2482
check:not(:checked):indeterminate:active,
2483
radio:not(:checked):indeterminate:active {
2484
-gtk-icon-transform: scaleX(-1);
2485
}
2486
2487
check:not(:checked),
2488
radio:not(:checked) {
2489
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;
2490
}
2491
2492
check:not(:checked):active,
2493
radio:not(:checked):active {
2494
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0, -gtk-icon-transform 0;
2495
}
2496
2497
menu menuitem check:not(:checked), menu menuitem
2498
radio:not(:checked) {
2499
transition: none;
2500
}
2501
2502
treeview.view check,
2503
treeview.view radio {
2504
padding: 0;
2505
}
2506
2507
treeview.view check:hover,
2508
treeview.view radio:hover {
2509
box-shadow: inset 0 0 0 9999px alpha(rgba(0, 0, 0, 0.87), 0.05);
2510
}
2511
2512
treeview.view check:hover:disabled,
2513
treeview.view radio:hover:disabled {
2514
box-shadow: none;
2515
}
2516
2517
treeview.view check:hover:selected,
2518
treeview.view radio:hover:selected {
2519
box-shadow: inset 0 0 0 9999px alpha(#FFFFFF, 0.05);
2520
}
2521
2522
treeview.view check,
2523
treeview.view radio {
2524
color: rgba(0, 0, 0, 0.54);
2525
}
2526
2527
treeview.view check:hover, treeview.view check:active,
2528
treeview.view radio:hover,
2529
treeview.view radio:active {
2530
color: rgba(0, 0, 0, 0.87);
2531
}
2532
2533
treeview.view check:disabled,
2534
treeview.view radio:disabled {
2535
color: rgba(0, 0, 0, 0.26);
2536
}
2537
2538
treeview.view check:checked, treeview.view check:indeterminate,
2539
treeview.view radio:checked,
2540
treeview.view radio:indeterminate {
2541
color: #FF4081;
2542
}
2543
2544
treeview.view check:checked:disabled, treeview.view check:indeterminate:disabled,
2545
treeview.view radio:checked:disabled,
2546
treeview.view radio:indeterminate:disabled {
2547
color: rgba(255, 64, 129, 0.5);
2548
}
2549
2550
treeview.view check:selected,
2551
treeview.view radio:selected {
2552
color: rgba(255, 255, 255, 0.7);
2553
}
2554
2555
treeview.view check:selected:hover, treeview.view check:selected:active,
2556
treeview.view radio:selected:hover,
2557
treeview.view radio:selected:active {
2558
color: #FFFFFF;
2559
}
2560
2561
treeview.view check:selected:disabled,
2562
treeview.view radio:selected:disabled {
2563
color: rgba(255, 255, 255, 0.3);
2564
}
2565
2566
treeview.view check:selected:checked, treeview.view check:selected:indeterminate,
2567
treeview.view radio:selected:checked,
2568
treeview.view radio:selected:indeterminate {
2569
color: #FF4081;
2570
}
2571
2572
treeview.view check:selected:checked:disabled, treeview.view check:selected:indeterminate:disabled,
2573
treeview.view radio:selected:checked:disabled,
2574
treeview.view radio:selected:indeterminate:disabled {
2575
color: rgba(255, 64, 129, 0.5);
2576
}
2577
2578
treeview.view radio:checked {
2579
-gtk-icon-source: image(-gtk-recolor(url("assets/scalable/radio-checked-symbolic.svg")), -gtk-recolor(url("assets/scalable/radio-checked-symbolic.symbolic.png")));
2580
border-image: none;
2581
}
2582
2583
/************
2584
* GtkScale *
2585
************/
2586
scale {
2587
min-height: 8px;
2588
min-width: 8px;
2589
padding: 12px;
2590
}
2591
2592
scale * {
2593
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
2594
}
2595
2596
scale slider {
2597
min-height: 24px;
2598
min-width: 24px;
2599
margin: -11px;
2600
}
2601
2602
scale trough {
2603
outline-offset: 2px;
2604
background-color: rgba(0, 0, 0, 0.26);
2605
}
2606
2607
scale trough:disabled {
2608
background-color: rgba(0, 0, 0, 0.12);
2609
}
2610
2611
scale highlight {
2612
background-color: #FF4081;
2613
}
2614
2615
scale highlight:disabled {
2616
background-color: transparent;
2617
}
2618
2619
scale fill {
2620
background-color: rgba(0, 0, 0, 0.26);
2621
}
2622
2623
scale fill:disabled {
2624
background-color: transparent;
2625
}
2626
2627
scale slider {
2628
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
2629
background-repeat: no-repeat;
2630
background-position: center;
2631
background-size: calc(100% - 10px);
2632
}
2633
2634
scale slider {
2635
background-image: -gtk-scaled(url("assets/scale-slider.png"), url("assets/scale-slider@2.png"));
2636
}
2637
2638
scale slider:disabled {
2639
background-image: -gtk-scaled(url("assets/scale-slider-disabled.png"), url("assets/scale-slider-disabled@2.png"));
2640
}
2641
2642
scale slider:hover {
2643
background-size: calc(100% - 8px);
2644
}
2645
2646
scale slider:active {
2647
background-size: calc(100% - 6px);
2648
}
2649
2650
scale.fine-tune slider {
2651
background-size: calc(100% - 12px);
2652
}
2653
2654
scale value {
2655
color: rgba(0, 0, 0, 0.38);
2656
}
2657
2658
scale marks {
2659
color: rgba(0, 0, 0, 0.26);
2660
}
2661
2662
scale marks.top {
2663
margin-bottom: 8px;
2664
margin-top: -16px;
2665
}
2666
2667
scale marks.bottom {
2668
margin-top: 8px;
2669
margin-bottom: -16px;
2670
}
2671
2672
scale marks.top {
2673
margin-right: 8px;
2674
margin-left: -16px;
2675
}
2676
2677
scale marks.bottom {
2678
margin-left: 8px;
2679
margin-right: -16px;
2680
}
2681
2682
scale.horizontal indicator {
2683
min-height: 8px;
2684
min-width: 1px;
2685
}
2686
2687
scale.vertical indicator {
2688
min-height: 1px;
2689
min-width: 8px;
2690
}
2691
2692
scale.horizontal.marks-before:not(.marks-after) slider {
2693
min-height: 30px;
2694
min-width: 24px;
2695
margin-top: -17px;
2696
background-position: center calc(100% - 5px);
2697
}
2698
2699
scale.horizontal.marks-before:not(.marks-after) slider {
2700
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider.png"), url("assets/scale-horz-marks-before-slider@2.png"));
2701
}
2702
2703
scale.horizontal.marks-before:not(.marks-after) slider:disabled {
2704
background-image: -gtk-scaled(url("assets/scale-horz-marks-before-slider-disabled.png"), url("assets/scale-horz-marks-before-slider-disabled@2.png"));
2705
}
2706
2707
scale.horizontal.marks-before:not(.marks-after) slider:hover {
2708
background-position: center calc(100% - 4px);
2709
}
2710
2711
scale.horizontal.marks-before:not(.marks-after) slider:active {
2712
background-position: center calc(100% - 3px);
2713
}
2714
2715
scale.horizontal.marks-before:not(.marks-after).fine-tune slider {
2716
background-position: center calc(100% - 6px);
2717
}
2718
2719
scale.horizontal.marks-after:not(.marks-before) slider {
2720
min-height: 30px;
2721
min-width: 24px;
2722
margin-bottom: -17px;
2723
background-position: center calc(5px);
2724
}
2725
2726
scale.horizontal.marks-after:not(.marks-before) slider {
2727
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider.png"), url("assets/scale-horz-marks-after-slider@2.png"));
2728
}
2729
2730
scale.horizontal.marks-after:not(.marks-before) slider:disabled {
2731
background-image: -gtk-scaled(url("assets/scale-horz-marks-after-slider-disabled.png"), url("assets/scale-horz-marks-after-slider-disabled@2.png"));
2732
}
2733
2734
scale.horizontal.marks-after:not(.marks-before) slider:hover {
2735
background-position: center calc(4px);
2736
}
2737
2738
scale.horizontal.marks-after:not(.marks-before) slider:active {
2739
background-position: center calc(3px);
2740
}
2741
2742
scale.horizontal.marks-after:not(.marks-before).fine-tune slider {
2743
background-position: center calc(6px);
2744
}
2745
2746
scale.vertical.marks-before:not(.marks-after) slider {
2747
min-height: 24px;
2748
min-width: 30px;
2749
margin-left: -17px;
2750
background-position: calc(5px) center;
2751
}
2752
2753
scale.vertical.marks-before:not(.marks-after) slider {
2754
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider.png"), url("assets/scale-vert-marks-before-slider@2.png"));
2755
}
2756
2757
scale.vertical.marks-before:not(.marks-after) slider:disabled {
2758
background-image: -gtk-scaled(url("assets/scale-vert-marks-before-slider-disabled.png"), url("assets/scale-vert-marks-before-slider-disabled@2.png"));
2759
}
2760
2761
scale.vertical.marks-before:not(.marks-after) slider:hover {
2762
background-position: calc(4px) center;
2763
}
2764
2765
scale.vertical.marks-before:not(.marks-after) slider:active {
2766
background-position: calc(3px) center;
2767
}
2768
2769
scale.vertical.marks-before:not(.marks-after).fine-tune slider {
2770
background-position: calc(6px) center;
2771
}
2772
2773
scale.vertical.marks-after:not(.marks-before) slider {
2774
min-height: 24px;
2775
min-width: 30px;
2776
margin-right: -17px;
2777
background-position: calc(100% - 5px) center;
2778
}
2779
2780
scale.vertical.marks-after:not(.marks-before) slider {
2781
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider.png"), url("assets/scale-vert-marks-after-slider@2.png"));
2782
}
2783
2784
scale.vertical.marks-after:not(.marks-before) slider:disabled {
2785
background-image: -gtk-scaled(url("assets/scale-vert-marks-after-slider-disabled.png"), url("assets/scale-vert-marks-after-slider-disabled@2.png"));
2786
}
2787
2788
scale.vertical.marks-after:not(.marks-before) slider:hover {
2789
background-position: calc(100% - 4px) center;
2790
}
2791
2792
scale.vertical.marks-after:not(.marks-before) slider:active {
2793
background-position: calc(100% - 3px) center;
2794
}
2795
2796
scale.vertical.marks-after:not(.marks-before).fine-tune slider {
2797
background-position: calc(100% - 6px) center;
2798
}
2799
2800
scale.color {
2801
min-height: 0;
2802
min-width: 0;
2803
}
2804
2805
scale.color.horizontal {
2806
padding: 0 0 12px 0;
2807
}
2808
2809
scale.color.horizontal slider:dir(ltr), scale.color.horizontal slider:dir(rtl) {
2810
margin-bottom: -12px;
2811
margin-top: -2px;
2812
}
2813
2814
scale.color.vertical:dir(ltr) {
2815
padding: 0 0 0 12px;
2816
}
2817
2818
scale.color.vertical:dir(ltr) slider {
2819
margin-left: -12px;
2820
margin-right: -2px;
2821
}
2822
2823
scale.color.vertical:dir(rtl) {
2824
padding: 0 12px 0 0;
2825
}
2826
2827
scale.color.vertical:dir(rtl) slider {
2828
margin-right: -12px;
2829
margin-left: -2px;
2830
}
2831
2832
/*****************
2833
* Progress bars *
2834
*****************/
2835
progressbar {
2836
color: rgba(0, 0, 0, 0.38);
2837
font-size: smaller;
2838
}
2839
2840
progressbar.horizontal trough,
2841
progressbar.horizontal progress {
2842
min-height: 4px;
2843
}
2844
2845
progressbar.vertical trough,
2846
progressbar.vertical progress {
2847
min-width: 4px;
2848
}
2849
2850
progressbar trough {
2851
background-color: rgba(66, 165, 245, 0.3);
2852
}
2853
2854
progressbar progress {
2855
background-color: #42A5F5;
2856
}
2857
2858
progressbar trough.empty progress {
2859
all: unset;
2860
}
2861
2862
/*************
2863
* Level Bar *
2864
*************/
2865
levelbar block {
2866
min-width: 32px;
2867
min-height: 4px;
2868
}
2869
2870
levelbar.vertical block {
2871
min-width: 4px;
2872
min-height: 32px;
2873
}
2874
2875
levelbar trough {
2876
padding: 2px;
2877
border-radius: 2px;
2878
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
2879
background-color: #FFFFFF;
2880
}
2881
2882
levelbar trough:disabled {
2883
background-color: #FAFAFA;
2884
}
2885
2886
levelbar.horizontal.discrete block {
2887
margin: 0 1px;
2888
}
2889
2890
levelbar.horizontal.discrete trough {
2891
padding: 2px 1px;
2892
}
2893
2894
levelbar.vertical.discrete block {
2895
margin: 1px 0;
2896
}
2897
2898
levelbar.vertical.discrete trough {
2899
padding: 1px 2px;
2900
}
2901
2902
levelbar block.low {
2903
background-color: #FF6D00;
2904
}
2905
2906
levelbar block.high, levelbar block:not(.empty) {
2907
background-color: #42A5F5;
2908
}
2909
2910
levelbar block.full {
2911
background-color: #00C853;
2912
}
2913
2914
levelbar block.empty {
2915
background-color: rgba(0, 0, 0, 0.12);
2916
}
2917
2918
/****************
2919
* Print dialog *
2920
*****************/
2921
printdialog paper {
2922
padding: 0;
2923
border: 1px solid rgba(0, 0, 0, 0.1);
2924
background-color: #FFFFFF;
2925
color: rgba(0, 0, 0, 0.87);
2926
}
2927
2928
printdialog .dialog-action-box {
2929
margin: 12px;
2930
}
2931
2932
/**********
2933
* Frames *
2934
**********/
2935
frame > border,
2936
.frame {
2937
margin: 0;
2938
padding: 0;
2939
border: 1px solid rgba(0, 0, 0, 0.1);
2940
border-radius: 0;
2941
box-shadow: none;
2942
}
2943
2944
frame > border.flat,
2945
.frame.flat,
2946
frame.flat > border {
2947
border-style: none;
2948
}
2949
2950
actionbar > revealer > box {
2951
padding: 6px;
2952
border-top: 1px solid rgba(0, 0, 0, 0.1);
2953
}
2954
2955
scrolledwindow viewport.frame {
2956
border-style: none;
2957
}
2958
2959
overshoot.top {
2960
background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2961
background-repeat: no-repeat;
2962
background-position: center top;
2963
background-color: transparent;
2964
border: none;
2965
box-shadow: none;
2966
}
2967
2968
overshoot.bottom {
2969
background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2970
background-repeat: no-repeat;
2971
background-position: center bottom;
2972
background-color: transparent;
2973
border: none;
2974
box-shadow: none;
2975
}
2976
2977
overshoot.left {
2978
background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2979
background-repeat: no-repeat;
2980
background-position: left center;
2981
background-color: transparent;
2982
border: none;
2983
box-shadow: none;
2984
}
2985
2986
overshoot.right {
2987
background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2988
background-repeat: no-repeat;
2989
background-position: right center;
2990
background-color: transparent;
2991
border: none;
2992
box-shadow: none;
2993
}
2994
2995
undershoot.top {
2996
background-color: transparent;
2997
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%);
2998
padding-top: 1px;
2999
background-size: 12px 1px;
3000
background-repeat: repeat-x;
3001
background-origin: content-box;
3002
background-position: left top;
3003
}
3004
3005
undershoot.bottom {
3006
background-color: transparent;
3007
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%);
3008
padding-bottom: 1px;
3009
background-size: 12px 1px;
3010
background-repeat: repeat-x;
3011
background-origin: content-box;
3012
background-position: left bottom;
3013
}
3014
3015
undershoot.left {
3016
background-color: transparent;
3017
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%);
3018
padding-left: 1px;
3019
background-size: 1px 12px;
3020
background-repeat: repeat-y;
3021
background-origin: content-box;
3022
background-position: left top;
3023
}
3024
3025
undershoot.right {
3026
background-color: transparent;
3027
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.26) 50%);
3028
padding-right: 1px;
3029
background-size: 1px 12px;
3030
background-repeat: repeat-y;
3031
background-origin: content-box;
3032
background-position: right top;
3033
}
3034
3035
junction {
3036
border-style: solid none none solid;
3037
border-width: 1px;
3038
border-color: rgba(0, 0, 0, 0.1);
3039
background-color: #FFFFFF;
3040
}
3041
3042
junction:dir(rtl) {
3043
border-style: solid solid none none;
3044
}
3045
3046
separator {
3047
min-width: 1px;
3048
min-height: 1px;
3049
background-color: rgba(0, 0, 0, 0.1);
3050
}
3051
3052
3053
button.font separator,
3054
button.file separator, .tweak-categories separator {
3055
min-width: 0;
3056
min-height: 0;
3057
background-color: transparent;
3058
}
3059
3060
/*********
3061
* Lists *
3062
*********/
3063
list {
3064
border-color: rgba(0, 0, 0, 0.1);
3065
background-color: #FFFFFF;
3066
}
3067
3068
list row {
3069
padding: 2px;
3070
}
3071
3072
row.activatable, .view, treeview.view header button, .budgie-menu button {
3073
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);
3074
box-shadow: inset 0 0 0 9999px transparent;
3075
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
3076
background-repeat: no-repeat;
3077
background-position: center;
3078
background-size: 1000% 1000%;
3079
}
3080
3081
row.activatable:hover, .view:hover, treeview.view header button:hover, .budgie-menu button:hover {
3082
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);
3083
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.05);
3084
}
3085
3086
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 {
3087
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, background-size 0, background-image 0;
3088
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
3089
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.15);
3090
background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 10%, transparent 0%);
3091
background-size: 0% 0%;
3092
}
3093
3094
/*********************
3095
* App Notifications *
3096
*********************/
3097
.app-notification {
3098
margin: 8px;
3099
}
3100
3101
.app-notification.frame,
3102
.app-notification border {
3103
border-style: none;
3104
}
3105
3106
/*************
3107
* Expanders *
3108
*************/
3109
expander arrow {
3110
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
3111
min-width: 16px;
3112
min-height: 16px;
3113
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
3114
-gtk-icon-transform: rotate(-90deg);
3115
color: rgba(0, 0, 0, 0.54);
3116
}
3117
3118
expander arrow:dir(rtl) {
3119
-gtk-icon-transform: rotate(90deg);
3120
}
3121
3122
expander arrow:checked {
3123
-gtk-icon-transform: unset;
3124
}
3125
3126
expander arrow:hover, expander arrow:active {
3127
color: rgba(0, 0, 0, 0.87);
3128
}
3129
3130
expander arrow:disabled {
3131
color: rgba(0, 0, 0, 0.26);
3132
}
3133
3134
expander arrow:selected {
3135
color: rgba(255, 255, 255, 0.7);
3136
}
3137
3138
expander arrow:selected:hover, expander arrow:selected:active {
3139
color: #FFFFFF;
3140
}
3141
3142
expander arrow:selected:disabled {
3143
color: rgba(255, 255, 255, 0.3);
3144
}
3145
3146
/************
3147
* Calendar *
3148
************/
3149
calendar {
3150
padding: 1px;
3151
border: 1px solid rgba(0, 0, 0, 0.1);
3152
color: rgba(0, 0, 0, 0.87);
3153
}
3154
3155
calendar:disabled {
3156
color: rgba(0, 0, 0, 0.38);
3157
}
3158
3159
calendar:selected {
3160
border-radius: 3px;
3161
}
3162
3163
calendar.header {
3164
border-style: none none solid;
3165
border-radius: 0;
3166
}
3167
3168
calendar.highlight {
3169
color: rgba(0, 0, 0, 0.54);
3170
font-weight: 500;
3171
}
3172
3173
calendar:indeterminate {
3174
color: rgba(0, 0, 0, 0.26);
3175
}
3176
3177
/***********
3178
* Dialogs *
3179
***********/
3180
messagedialog.background {
3181
background-color: #FAFAFA;
3182
}
3183
3184
messagedialog .titlebar {
3185
min-height: 20px;
3186
border-style: none;
3187
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
3188
background-color: #FAFAFA;
3189
color: rgba(0, 0, 0, 0.87);
3190
}
3191
3192
messagedialog .titlebar:backdrop {
3193
color: rgba(0, 0, 0, 0.54);
3194
}
3195
3196
messagedialog.csd.background {
3197
border-bottom-left-radius: 2px;
3198
border-bottom-right-radius: 2px;
3199
}
3200
3201
messagedialog.csd .dialog-action-area button {
3202
padding: 8px 16px;
3203
border-top: 1px solid rgba(0, 0, 0, 0.1);
3204
border-radius: 0;
3205
}
3206
3207
messagedialog.csd .dialog-action-area button:first-child {
3208
border-bottom-left-radius: 2px;
3209
}
3210
3211
messagedialog.csd .dialog-action-area button:last-child {
3212
border-bottom-right-radius: 2px;
3213
}
3214
3215
filechooser .dialog-action-box {
3216
border-top: 1px solid rgba(0, 0, 0, 0.1);
3217
}
3218
3219
filechooser #pathbarbox {
3220
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3221
background-color: #F5F5F5;
3222
}
3223
3224
filechooserbutton:drop(active) {
3225
box-shadow: none;
3226
}
3227
3228
/***********
3229
* Sidebar *
3230
***********/
3231
.sidebar {
3232
border-style: none;
3233
background-color: #FAFAFA;
3234
}
3235
3236
stacksidebar.sidebar:dir(ltr) list, stacksidebar.sidebar.left list, stacksidebar.sidebar.left:dir(rtl) list, .sidebar:dir(ltr), .sidebar.left, .sidebar.left:dir(rtl) {
3237
border-right: 1px solid rgba(0, 0, 0, 0.1);
3238
border-left-style: none;
3239
}
3240
3241
stacksidebar.sidebar:dir(rtl) list, stacksidebar.sidebar.right list, .sidebar:dir(rtl), .sidebar.right {
3242
border-left: 1px solid rgba(0, 0, 0, 0.1);
3243
border-right-style: none;
3244
}
3245
3246
.sidebar list {
3247
background-color: transparent;
3248
}
3249
3250
paned .sidebar.left, paned .sidebar.right, paned .sidebar.left:dir(rtl), paned .sidebar:dir(rtl), paned .sidebar:dir(ltr), paned .sidebar {
3251
border-style: none;
3252
}
3253
3254
stacksidebar row {
3255
padding: 10px 4px;
3256
}
3257
3258
stacksidebar row > label {
3259
padding-left: 6px;
3260
padding-right: 6px;
3261
}
3262
3263
/****************
3264
* File chooser *
3265
****************/
3266
placessidebar > viewport.frame {
3267
border-style: none;
3268
}
3269
3270
placessidebar list {
3271
padding: 1px 0 4px;
3272
}
3273
3274
placessidebar row {
3275
min-height: 32px;
3276
margin: -1px 0;
3277
padding: 0;
3278
}
3279
3280
placessidebar row > revealer {
3281
padding: 0 12px;
3282
}
3283
3284
placessidebar row:selected {
3285
color: #FFFFFF;
3286
}
3287
3288
placessidebar row:disabled {
3289
color: rgba(0, 0, 0, 0.38);
3290
}
3291
3292
placessidebar row image.sidebar-icon {
3293
color: rgba(0, 0, 0, 0.54);
3294
}
3295
3296
placessidebar row image.sidebar-icon:dir(ltr) {
3297
padding-right: 8px;
3298
}
3299
3300
placessidebar row image.sidebar-icon:dir(rtl) {
3301
padding-left: 8px;
3302
}
3303
3304
placessidebar row:selected image.sidebar-icon {
3305
color: rgba(255, 255, 255, 0.7);
3306
}
3307
3308
placessidebar row label.sidebar-label:dir(ltr) {
3309
padding-right: 2px;
3310
}
3311
3312
placessidebar row label.sidebar-label:dir(rtl) {
3313
padding-left: 2px;
3314
}
3315
3316
placessidebar row.sidebar-placeholder-row {
3317
min-height: 2px;
3318
padding: 0 8px;
3319
background-image: image(#FF4081);
3320
background-clip: content-box;
3321
}
3322
3323
placessidebar row.sidebar-new-bookmark-row {
3324
color: #FF4081;
3325
}
3326
3327
placessidebar row:drop(active):not(:disabled) {
3328
box-shadow: inset 0 0 0 2px #FF4081;
3329
}
3330
3331
placesview .server-list-button > image {
3332
-gtk-icon-transform: rotate(0turn);
3333
}
3334
3335
placesview .server-list-button:checked > image {
3336
-gtk-icon-transform: rotate(-0.5turn);
3337
}
3338
3339
placesview > actionbar > revealer > box > label {
3340
padding-left: 8px;
3341
padding-right: 8px;
3342
}
3343
3344
/*********
3345
* Paned *
3346
*********/
3347
paned > separator {
3348
min-width: 1px;
3349
min-height: 1px;
3350
-gtk-icon-source: none;
3351
border-style: none;
3352
background-color: transparent;
3353
background-image: image(rgba(0, 0, 0, 0.1));
3354
background-size: 1px 1px;
3355
background-clip: content-box;
3356
}
3357
3358
paned > separator.wide {
3359
min-width: 6px;
3360
min-height: 6px;
3361
background-color: #F5F5F5;
3362
background-image: image(rgba(0, 0, 0, 0.1)), image(rgba(0, 0, 0, 0.1));
3363
background-size: 1px 1px, 1px 1px;
3364
}
3365
3366
paned.horizontal > separator {
3367
background-repeat: repeat-y;
3368
}
3369
3370
paned.horizontal > separator:dir(ltr) {
3371
margin: 0 -8px 0 0;
3372
padding: 0 8px 0 0;
3373
background-position: left;
3374
}
3375
3376
paned.horizontal > separator:dir(rtl) {
3377
margin: 0 0 0 -8px;
3378
padding: 0 0 0 8px;
3379
background-position: right;
3380
}
3381
3382
paned.horizontal > separator.wide {
3383
margin: 0;
3384
padding: 0;
3385
background-repeat: repeat-y, repeat-y;
3386
background-position: left, right;
3387
}
3388
3389
paned.vertical > separator {
3390
margin: 0 0 -8px 0;
3391
padding: 0 0 8px 0;
3392
background-repeat: repeat-x;
3393
background-position: top;
3394
}
3395
3396
paned.vertical > separator.wide {
3397
margin: 0;
3398
padding: 0;
3399
background-repeat: repeat-x, repeat-x;
3400
background-position: bottom, top;
3401
}
3402
3403
/**************
3404
* GtkInfoBar *
3405
**************/
3406
infobar {
3407
border-style: none;
3408
}
3409
3410
infobar.info {
3411
background-color: #66BB6A;
3412
}
3413
3414
infobar.question {
3415
background-color: #42A5F5;
3416
}
3417
3418
infobar.warning {
3419
background-color: #FFA726;
3420
}
3421
3422
infobar.error {
3423
background-color: #EF5350;
3424
}
3425
3426
infobar.info > label, infobar.info, infobar.question > label, infobar.question, infobar.warning > label, infobar.warning, infobar.error > label, infobar.error {
3427
color: #FFFFFF;
3428
}
3429
3430
/************
3431
* Tooltips *
3432
************/
3433
tooltip {
3434
border-radius: 2px;
3435
box-shadow: none;
3436
}
3437
3438
tooltip.background {
3439
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
3440
background-color: rgba(255, 255, 255, 0.9);
3441
}
3442
3443
tooltip:not(.csd):not(.unity-csd) {
3444
border: 1px solid rgba(0, 0, 0, 0.1);
3445
border-radius: 3px;
3446
background-clip: padding-box;
3447
}
3448
3449
tooltip decoration {
3450
background-color: transparent;
3451
}
3452
3453
tooltip label {
3454
min-height: 20px;
3455
padding: 0 2px;
3456
}
3457
3458
/*****************
3459
* Color Chooser *
3460
*****************/
3461
colorswatch.top {
3462
border-top-left-radius: 2.5px;
3463
border-top-right-radius: 2.5px;
3464
}
3465
3466
colorswatch.top overlay {
3467
border-top-left-radius: 2px;
3468
border-top-right-radius: 2px;
3469
}
3470
3471
colorswatch.bottom {
3472
border-bottom-left-radius: 2.5px;
3473
border-bottom-right-radius: 2.5px;
3474
}
3475
3476
colorswatch.bottom overlay {
3477
border-bottom-left-radius: 2px;
3478
border-bottom-right-radius: 2px;
3479
}
3480
3481
colorswatch.left, colorswatch:first-child:not(.top) {
3482
border-top-left-radius: 2.5px;
3483
border-bottom-left-radius: 2.5px;
3484
}
3485
3486
colorswatch.left overlay, colorswatch:first-child:not(.top) overlay {
3487
border-top-left-radius: 2px;
3488
border-bottom-left-radius: 2px;
3489
}
3490
3491
colorswatch.right, colorswatch:last-child:not(.bottom) {
3492
border-top-right-radius: 2.5px;
3493
border-bottom-right-radius: 2.5px;
3494
}
3495
3496
colorswatch.right overlay, colorswatch:last-child:not(.bottom) overlay {
3497
border-top-right-radius: 2px;
3498
border-bottom-right-radius: 2px;
3499
}
3500
3501
colorswatch.dark overlay {
3502
color: #FFFFFF;
3503
}
3504
3505
colorswatch.light overlay {
3506
color: rgba(0, 0, 0, 0.87);
3507
}
3508
3509
colorswatch.dark {
3510
color: #FFFFFF;
3511
}
3512
3513
colorswatch.light {
3514
color: rgba(0, 0, 0, 0.87);
3515
}
3516
3517
colorswatch:drop(active) {
3518
box-shadow: none;
3519
}
3520
3521
colorswatch:drop(active).light overlay {
3522
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;
3523
}
3524
3525
colorswatch:drop(active).dark overlay {
3526
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;
3527
}
3528
3529
colorswatch overlay {
3530
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3531
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3532
}
3533
3534
colorswatch overlay:hover {
3535
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3536
}
3537
3538
colorswatch#add-color-button {
3539
border-radius: 2px 2px 0 0;
3540
color: #FFFFFF;
3541
}
3542
3543
colorswatch#add-color-button:only-child {
3544
border-radius: 2px;
3545
}
3546
3547
colorswatch#add-color-button overlay {
3548
background-image: linear-gradient(to right, #EF5350 25%, #FFA726 25%, #FFA726 50%, #66BB6A 50%, #66BB6A 75%, #42A5F5 75%);
3549
color: #FFFFFF;
3550
}
3551
3552
colorswatch:disabled {
3553
opacity: 0.5;
3554
}
3555
3556
colorswatch:disabled overlay {
3557
box-shadow: none;
3558
}
3559
3560
colorswatch#editor-color-sample {
3561
border-radius: 2.5px;
3562
}
3563
3564
colorswatch#editor-color-sample overlay {
3565
border-radius: 2px;
3566
}
3567
3568
colorchooser .popover.osd {
3569
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3570
border-radius: 2px;
3571
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);
3572
background-color: #FFFFFF;
3573
}
3574
3575
colorchooser .popover.osd:backdrop {
3576
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);
3577
}
3578
3579
/********
3580
* Misc *
3581
********/
3582
.content-view {
3583
background-color: #F5F5F5;
3584
}
3585
3586
/**********************
3587
* Window Decorations *
3588
**********************/
3589
decoration {
3590
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
3591
border-radius: 2px 2px 0 0;
3592
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent;
3593
margin: 8px;
3594
}
3595
3596
decoration:backdrop {
3597
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent;
3598
}
3599
3600
.maximized decoration,
3601
.fullscreen decoration,
3602
.tiled decoration {
3603
border-radius: 0;
3604
}
3605
3606
.popup decoration {
3607
box-shadow: none;
3608
}
3609
3610
.ssd decoration {
3611
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16);
3612
}
3613
3614
.csd.popup decoration {
3615
border-radius: 2px;
3616
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3617
}
3618
3619
tooltip.csd decoration {
3620
border-radius: 2px;
3621
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
3622
}
3623
3624
messagedialog.csd decoration {
3625
border-radius: 2px;
3626
}
3627
3628
.solid-csd decoration {
3629
margin: 0;
3630
border-radius: 0;
3631
box-shadow: none;
3632
background-color: #455A64;
3633
}
3634
3635
.view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3636
entry selection, modelbutton.flat:selected,
3637
.menuitem.button.flat:selected, popover.background.menu button:checked,
3638
popover.background button.model:checked, row:selected, calendar:selected, text:selected, .budgie-menu button:checked {
3639
background-color: #42A5F5;
3640
}
3641
3642
row:selected label, label:selected, .view selection, .view:selected, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection,
3643
entry selection, modelbutton.flat:selected,
3644
.menuitem.button.flat:selected, popover.background.menu button:checked,
3645
popover.background button.model:checked, row:selected, calendar:selected, text:selected, .budgie-menu button:checked {
3646
color: #FFFFFF;
3647
}
3648
3649
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,
3650
entry selection:disabled, modelbutton.flat:disabled:selected,
3651
.menuitem.button.flat:disabled:selected, popover.background.menu button:disabled:checked,
3652
popover.background button.model:disabled:checked, row:disabled:selected, calendar:disabled:selected, text:disabled:selected, .budgie-menu button:disabled:checked {
3653
color: rgba(255, 255, 255, 0.5);
3654
}
3655
3656
.monospace {
3657
font-family: monospace;
3658
}
3659
3660
/**********************
3661
* Touch Copy & Paste *
3662
**********************/
3663
cursor-handle {
3664
border-radius: 9999px;
3665
background-color: #FF4081;
3666
background-image: none;
3667
}
3668
3669
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) {
3670
padding-left: 6px;
3671
border-top-right-radius: 0;
3672
}
3673
3674
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) {
3675
padding-right: 6px;
3676
border-top-left-radius: 0;
3677
}
3678
3679
cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) {
3680
-GtkWidget-text-handle-width: 24;
3681
-GtkWidget-text-handle-height: 30;
3682
-gtk-icon-source: -gtk-scaled(url("assets/scale-horz-marks-before-slider.png"), url("assets/scale-horz-marks-before-slider@2.png"));
3683
}
3684
3685
.context-menu {
3686
font: initial;
3687
}
3688
3689
.keycap {
3690
min-width: 12px;
3691
min-height: 26px;
3692
margin-top: 2px;
3693
padding-bottom: 2px;
3694
padding-left: 8px;
3695
padding-right: 8px;
3696
border: solid 1px rgba(0, 0, 0, 0.1);
3697
border-radius: 3px;
3698
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.1);
3699
background-color: #FFFFFF;
3700
color: rgba(0, 0, 0, 0.87);
3701
font-size: smaller;
3702
}
3703
3704
:not(decoration):not(window):drop(active) {
3705
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
3706
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;
3707
caret-color: #FF4081;
3708
}
3709
3710
stackswitcher button.text-button {
3711
min-width: 100px;
3712
}
3713
3714
stackswitcher button.circular,
3715
stackswitcher button.text-button.circular {
3716
min-width: 32px;
3717
min-height: 32px;
3718
padding: 0;
3719
}
3720
3721
/************
3722
* Nautilus *
3723
************/
3724
.nautilus-window,
3725
.nautilus-window notebook,
3726
.nautilus-window notebook > stack {
3727
background-color: #FFFFFF;
3728
}
3729
3730
.nautilus-desktop.nautilus-canvas-item:not(:selected), .caja-desktop.caja-canvas-item:not(:selected) {
3731
color: #FFFFFF;
3732
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
3733
}
3734
3735
@keyframes needs_attention_keyframes {
3736
to {
3737
background-color: alpha(currentColor, 0.3);
3738
}
3739
}
3740
3741
.nautilus-operations-button-needs-attention {
3742
animation: needs_attention_keyframes 0.3s cubic-bezier(0.4, 0, 0.2, 1) 2 alternate;
3743
}
3744
3745
.nautilus-operations-button-needs-attention-multiple {
3746
animation: needs_attention_keyframes 0.3s cubic-bezier(0.4, 0, 0.2, 1) 4 alternate;
3747
}
3748
3749
.nautilus-window .floating-bar {
3750
min-height: 32px;
3751
padding: 0;
3752
border-style: solid solid none;
3753
border-width: 1px;
3754
border-color: rgba(0, 0, 0, 0.1);
3755
border-radius: 3px 3px 0 0;
3756
background-color: #FFFFFF;
3757
background-clip: padding-box;
3758
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), border-width 0;
3759
}
3760
3761
.nautilus-window .floating-bar.bottom.left {
3762
margin-right: 7px;
3763
border-left-style: none;
3764
border-top-left-radius: 0;
3765
}
3766
3767
.nautilus-window .floating-bar.bottom.right {
3768
margin-left: 7px;
3769
border-right-style: none;
3770
border-top-right-radius: 0;
3771
}
3772
3773
.nautilus-window .floating-bar button {
3774
margin: 6px;
3775
}
3776
3777
.disk-space-display.unknown {
3778
background-color: #FF6D00;
3779
}
3780
3781
.disk-space-display.used {
3782
background-color: #42A5F5;
3783
}
3784
3785
.disk-space-display.free {
3786
background-color: rgba(0, 0, 0, 0.12);
3787
}
3788
3789
.nautilus-window searchbar {
3790
border-top: 1px solid rgba(0, 0, 0, 0.1);
3791
}
3792
3793
.nautilus-window .searchbar-container {
3794
margin-top: -1px;
3795
}
3796
3797
.nautilus-window paned > separator {
3798
background-color: #F5F5F5;
3799
}
3800
3801
/*********
3802
* gedit *
3803
*********/
3804
.open-document-selector-name-label {
3805
font-weight: bold;
3806
}
3807
3808
.open-document-selector-path-label {
3809
color: rgba(0, 0, 0, 0.54);
3810
font-size: smaller;
3811
}
3812
3813
.open-document-selector-path-label:selected {
3814
color: rgba(255, 255, 255, 0.7);
3815
}
3816
3817
.gedit-document-panel {
3818
background-color: #FAFAFA;
3819
}
3820
3821
.gedit-document-panel row button.flat {
3822
margin-top: 8px;
3823
margin-bottom: 8px;
3824
}
3825
3826
.gedit-document-panel-group-row:not(:first-child) {
3827
border-top: 1px solid rgba(0, 0, 0, 0.1);
3828
}
3829
3830
.gedit-side-panel-paned statusbar {
3831
border-top: 1px solid rgba(0, 0, 0, 0.1);
3832
}
3833
3834
.gedit-search-slider {
3835
margin: 4px 4px 8px;
3836
}
3837
3838
.gedit-search-slider entry:dir(ltr), .gedit-search-slider entry:dir(rtl) {
3839
border-radius: 2px;
3840
}
3841
3842
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag, .gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
3843
all: unset;
3844
color: rgba(0, 0, 0, 0.38);
3845
}
3846
3847
.gedit-search-slider entry:dir(ltr) {
3848
margin-right: -58px;
3849
padding-right: 58px;
3850
}
3851
3852
.gedit-search-slider entry:dir(ltr) .gedit-search-entry-occurrences-tag {
3853
margin-left: 6px;
3854
}
3855
3856
.gedit-search-slider entry:dir(ltr) image.right {
3857
margin-right: 0;
3858
}
3859
3860
.gedit-search-slider entry:dir(rtl) {
3861
margin-left: -58px;
3862
padding-left: 58px;
3863
}
3864
3865
.gedit-search-slider entry:dir(rtl) .gedit-search-entry-occurrences-tag {
3866
margin-right: 6px;
3867
}
3868
3869
.gedit-search-slider entry:dir(rtl) image.left {
3870
margin-left: 0;
3871
}
3872
3873
.gedit-search-slider entry.error ~ button {
3874
color: rgba(255, 255, 255, 0.7);
3875
}
3876
3877
.gedit-search-slider entry.error ~ button:hover, .gedit-search-slider entry.error ~ button:active {
3878
color: #FFFFFF;
3879
}
3880
3881
.gedit-search-slider entry.error ~ button:disabled {
3882
color: rgba(255, 255, 255, 0.3);
3883
}
3884
3885
.gedit-search-slider button {
3886
border: solid 6px transparent;
3887
}
3888
3889
.gedit-search-slider button:last-child:dir(ltr), .gedit-search-slider button:not(:first-child):dir(rtl) {
3890
margin-left: -3px;
3891
}
3892
3893
.gedit-search-slider button:first-child:dir(rtl), .gedit-search-slider button:not(:last-child):dir(ltr) {
3894
margin-right: -3px;
3895
}
3896
3897
frame.gedit-map-frame > border:dir(ltr) {
3898
border-style: none none none solid;
3899
}
3900
3901
frame.gedit-map-frame > border:dir(rtl) {
3902
border-style: none solid none none;
3903
}
3904
3905
/**************
3906
* Tweak Tool *
3907
**************/
3908
.tweak-categories {
3909
background-image: image(#FAFAFA);
3910
}
3911
3912
.tweak {
3913
padding: 3px;
3914
}
3915
3916
.tweak.title:hover {
3917
box-shadow: none;
3918
}
3919
3920
.tweak-group-white,
3921
.tweak-white,
3922
.tweak-white:hover {
3923
background-image: image(#FFFFFF);
3924
}
3925
3926
.tweak-startup,
3927
.tweak-startup:hover {
3928
background-image: image(#FFFFFF);
3929
}
3930
3931
.tweak-group-startup {
3932
background-image: image(#FFFFFF);
3933
border: 1px solid rgba(0, 0, 0, 0.1);
3934
}
3935
3936
/***********
3937
* Builder *
3938
***********/
3939
workbench stack.titlebar {
3940
padding: 0;
3941
}
3942
3943
workbench:not(.tiled):not(.maximized):not(.fullscreen) stack.titlebar headerbar {
3944
border-radius: 2px 2px 0 0;
3945
}
3946
3947
perspectiveswitcher {
3948
background-color: #F5F5F5;
3949
}
3950
3951
perspectiveswitcher button:checked {
3952
color: #42A5F5;
3953
}
3954
3955
layouttabbar {
3956
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
3957
background-color: #F5F5F5;
3958
}
3959
3960
layouttabbar > box > button {
3961
margin: 4px 0;
3962
}
3963
3964
layouttab {
3965
margin: 0 8px;
3966
border-style: none solid;
3967
border-width: 1px;
3968
border-color: rgba(0, 0, 0, 0.1);
3969
box-shadow: inset 0 -2px #42A5F5;
3970
background-color: #FFFFFF;
3971
}
3972
3973
layouttab separator.vertical {
3974
margin: 8px 4px;
3975
}
3976
3977
layouttab button.text-button, layouttab button.image-button, layouttab button {
3978
margin-top: 8px;
3979
margin-bottom: 8px;
3980
padding: 0 4px;
3981
}
3982
3983
layout {
3984
border: 1px solid rgba(0, 0, 0, 0.1);
3985
-PnlDockBin-handle-size: 1;
3986
}
3987
3988
entry.search-missing {
3989
background-color: #DD2C00;
3990
color: #FFFFFF;
3991
}
3992
3993
workbench treeview.image {
3994
color: rgba(0, 0, 0, 0.54);
3995
}
3996
3997
workbench treeview.image:selected {
3998
color: rgba(255, 255, 255, 0.7);
3999
}
4000
4001
dockbin {
4002
border: 1px solid rgba(0, 0, 0, 0.1);
4003
-PnlDockBin-handle-size: 1;
4004
}
4005
4006
dockpaned {
4007
border: 1px solid rgba(0, 0, 0, 0.1);
4008
}
4009
4010
eggsearchbar box.search-bar {
4011
padding: 0 8px;
4012
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4013
background-color: #F5F5F5;
4014
}
4015
4016
docktabstrip {
4017
padding: 0 8px;
4018
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4019
background-color: #F5F5F5;
4020
}
4021
4022
docktab {
4023
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-size 0, background-image 0;
4024
min-height: 20px;
4025
min-width: 20px;
4026
margin-bottom: -1px;
4027
padding: 6px 6px;
4028
outline-offset: -6px;
4029
border-width: 1px;
4030
border-color: transparent;
4031
background-image: radial-gradient(circle farthest-corner at center, #42A5F5 10%, transparent 0%);
4032
background-repeat: no-repeat;
4033
background-position: center;
4034
background-size: 0% 0%;
4035
color: rgba(0, 0, 0, 0.54);
4036
font-weight: 500;
4037
}
4038
4039
docktab:hover {
4040
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.26);
4041
color: rgba(0, 0, 0, 0.87);
4042
}
4043
4044
docktab:checked {
4045
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);
4046
box-shadow: inset 0 -2px #42A5F5;
4047
background-image: radial-gradient(circle farthest-corner at center, transparent 10%, transparent 0%);
4048
background-size: 1000% 1000%;
4049
color: rgba(0, 0, 0, 0.87);
4050
}
4051
4052
dockoverlayedge {
4053
background-color: #F5F5F5;
4054
}
4055
4056
dockoverlayedge docktabstrip {
4057
padding: 0;
4058
border: none;
4059
}
4060
4061
dockoverlayedge.left-edge docktab:hover {
4062
box-shadow: inset -2px 0 rgba(0, 0, 0, 0.26);
4063
}
4064
4065
dockoverlayedge.left-edge docktab:checked {
4066
box-shadow: inset -2px 0 #42A5F5;
4067
}
4068
4069
dockoverlayedge.right-edge docktab:hover {
4070
box-shadow: inset 2px 0 rgba(0, 0, 0, 0.26);
4071
}
4072
4073
dockoverlayedge.right-edge docktab:checked {
4074
box-shadow: inset 2px 0 #42A5F5;
4075
}
4076
4077
pillbox {
4078
background-color: #F5F5F5;
4079
border-radius: 2px;
4080
}
4081
4082
buildperspective row {
4083
padding: 10px;
4084
}
4085
4086
layoutpane entry.search {
4087
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.1);
4088
background-color: #FFFFFF;
4089
}
4090
4091
editortweak entry.search {
4092
margin-bottom: -1px;
4093
box-shadow: none;
4094
}
4095
4096
frame.gb-search-frame {
4097
border-bottom-right-radius: 5px;
4098
}
4099
4100
.gb-search-entry-occurrences-tag {
4101
box-shadow: none;
4102
background-color: transparent;
4103
}
4104
4105
docktabstrip {
4106
min-height: 39px;
4107
}
4108
4109
workbench preferences preferencesgroup list entry {
4110
padding-top: 8px;
4111
padding-bottom: 8px;
4112
}
4113
4114
/**********
4115
* Photos *
4116
**********/
4117
GdMainIconView.content-view {
4118
-GdMainIconView-icon-size: 48;
4119
}
4120
4121
.documents-counter {
4122
margin: 8px;
4123
border-radius: 9999px;
4124
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
4125
background-color: #FF4081;
4126
color: #FFFFFF;
4127
font-weight: bold;
4128
}
4129
4130
.documents-scrolledwin.frame {
4131
border-style: none;
4132
}
4133
4134
.photos-fade-in {
4135
opacity: 1;
4136
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
4137
}
4138
4139
.photos-fade-out {
4140
opacity: 0;
4141
transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1);
4142
}
4143
4144
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(ltr) {
4145
border-style: none none none solid;
4146
}
4147
4148
overlay grid.horizontal > revealer > scrolledwindow.frame:dir(rtl) {
4149
border-style: none solid none none;
4150
}
4151
4152
/*********
4153
* Music *
4154
*********/
4155
.side-panel:dir(ltr) {
4156
border-style: solid;
4157
border-color: rgba(0, 0, 0, 0.1);
4158
}
4159
4160
.side-panel:dir(rtl) {
4161
border-style: solid;
4162
border-color: rgba(0, 0, 0, 0.1);
4163
}
4164
4165
.side-panel .view {
4166
background-image: image(#FAFAFA);
4167
}
4168
4169
.side-panel .view:hover {
4170
background-image: image(rgba(240, 240, 240, 0.9935));
4171
}
4172
4173
.side-panel .view:selected {
4174
background-image: image(#42A5F5);
4175
}
4176
4177
.side-panel .view:selected:hover {
4178
background-image: image(#4baaf6);
4179
}
4180
4181
.songs-list:hover {
4182
background-image: image(alpha(currentColor, 0.05));
4183
}
4184
4185
frame.documents-dropdown {
4186
margin: 8px;
4187
}
4188
4189
frame.documents-dropdown > border {
4190
border: none;
4191
}
4192
4193
box.vertical:not(.titlebar) > revealer > toolbar.search-bar {
4194
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4195
}
4196
4197
box.vertical:not(.titlebar) > revealer > toolbar.search-bar button > widget {
4198
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4199
}
4200
4201
/*********
4202
* To Do *
4203
*********/
4204
task-row {
4205
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
4206
margin: 0 -4px;
4207
}
4208
4209
task-row:hover {
4210
transition: none;
4211
}
4212
4213
task-row label {
4214
margin: 0 8px;
4215
}
4216
4217
task-row image {
4218
margin: 0 4px;
4219
}
4220
4221
task-list-view > box > revealer > box > button {
4222
min-height: 32px;
4223
margin: -4px;
4224
padding: 0 12px;
4225
}
4226
4227
task-list-view > box > revealer > box > button label {
4228
margin: 0 8px;
4229
}
4230
4231
task-list-view > box > revealer > box > button image {
4232
margin: 0 4px;
4233
}
4234
4235
/*******
4236
* eog *
4237
*******/
4238
#eog-thumb-nav scrolledwindow {
4239
border-top: none;
4240
}
4241
4242
#eog-thumb-nav button {
4243
-gtk-outline-radius: 2px;
4244
}
4245
4246
/*************
4247
* Evolution *
4248
*************/
4249
frame.taskbar > border {
4250
border-style: solid none none;
4251
}
4252
4253
box.vertical > paned.horizontal notebook widget .frame {
4254
border-style: none;
4255
}
4256
4257
/********
4258
* gitg *
4259
********/
4260
frame.commit-frame > border {
4261
border-style: solid none none;
4262
}
4263
4264
/**************
4265
* Characters *
4266
**************/
4267
box.dialog-vbox scrolledwindow.related {
4268
border: 1px solid rgba(0, 0, 0, 0.1);
4269
}
4270
4271
list.categories {
4272
background-image: image(#FAFAFA);
4273
}
4274
4275
/*********
4276
* Boxes *
4277
*********/
4278
.transparent-bg + stack overlay > label {
4279
min-height: 24px;
4280
padding: 0 4px;
4281
border-radius: 2px;
4282
background-color: rgba(0, 0, 0, 0.3);
4283
color: #FFFFFF;
4284
}
4285
4286
/**************
4287
* Calculator *
4288
**************/
4289
button.title label {
4290
min-height: 32px;
4291
}
4292
4293
/*********
4294
* Tilix *
4295
*********/
4296
overlay > revealer.left > scrolledwindow.frame,
4297
overlay > revealer.right > scrolledwindow.frame {
4298
border-style: none;
4299
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22);
4300
}
4301
4302
overlay > revealer.left > scrolledwindow.frame {
4303
margin-right: 32px;
4304
}
4305
4306
overlay > revealer.right > scrolledwindow.frame {
4307
margin-left: 32px;
4308
}
4309
4310
.terminix-session-sidebar,
4311
.tilix-session-sidebar {
4312
background-image: image(#FAFAFA);
4313
}
4314
4315
button.image-button.session-new-button {
4316
min-width: 28px;
4317
}
4318
4319
/***********
4320
* Eclipse *
4321
***********/
4322
window.background > box.vertical > scrolledwindow > widget toolbar {
4323
padding: 2px;
4324
}
4325
4326
window.background > box.vertical > scrolledwindow > widget toolbar separator,
4327
window.background > box.vertical > scrolledwindow > widget toolbar button {
4328
margin: 2px;
4329
}
4330
4331
window.background > box.vertical > scrolledwindow > widget toolbar button {
4332
border-radius: 2px;
4333
}
4334
4335
/***********
4336
* Firefox *
4337
***********/
4338
window.background:not(.csd) > widget > separator {
4339
color: rgba(0, 0, 0, 0.2);
4340
}
4341
4342
window.background:not(.csd) > widget > scrollbar {
4343
background-clip: border-box;
4344
}
4345
4346
window.background:not(.csd) > widget > scrollbar,
4347
window.background:not(.csd) > widget > frame > border {
4348
border-color: rgba(0, 0, 0, 0.2);
4349
}
4350
4351
window.background:not(.csd) > widget > entry,
4352
window.background:not(.csd) > widget > button > button {
4353
border: 1px solid rgba(0, 0, 0, 0.2);
4354
border-radius: 3px;
4355
box-shadow: none;
4356
}
4357
4358
window.background:not(.csd) > widget > entry {
4359
min-height: 30px;
4360
}
4361
4362
window.background:not(.csd) > widget > entry:focus {
4363
border-color: #42A5F5;
4364
}
4365
4366
window.background:not(.csd) > widget > button > button {
4367
padding: 4px 8px;
4368
background-size: auto;
4369
}
4370
4371
window.background:not(.csd) > widget > button > button:hover {
4372
background-image: image(alpha(currentColor, 0.05));
4373
}
4374
4375
window.background:not(.csd) > widget > button > button:active {
4376
background-image: image(alpha(currentColor, 0.1));
4377
}
4378
4379
window.background:not(.csd) > window > menu,
4380
window.background:not(.csd) > menu > menu {
4381
border: none;
4382
}
4383
4384
window.background:not(.csd) > widget > menubar {
4385
color: rgba(255, 255, 255, 0.7);
4386
}
4387
4388
window.background:not(.csd) > widget > menubar:hover {
4389
color: #FFFFFF;
4390
}
4391
4392
window.background:not(.csd) > widget > menubar:disabled {
4393
color: rgba(255, 255, 255, 0.3);
4394
}
4395
4396
window.background:not(.csd) > widget > frame {
4397
color: rgba(0, 0, 0, 0.2);
4398
}
4399
4400
window.background:not(.csd) > widget > checkbutton > check,
4401
window.background:not(.csd) > widget > radiobutton > radio {
4402
margin: 0;
4403
padding: 0;
4404
}
4405
4406
window.background:not(.csd) > window.background > menu > separator {
4407
color: rgba(0, 0, 0, 0.1);
4408
}
4409
4410
/***********
4411
* Synapse *
4412
***********/
4413
box.vertical > widget > widget:selected {
4414
background-color: #42A5F5;
4415
}
4416
4417
/*********
4418
* Unity *
4419
*********/
4420
UnityDecoration {
4421
-UnityDecoration-extents: 28px 0 0 0;
4422
-UnityDecoration-input-extents: 8px;
4423
-UnityDecoration-shadow-offset-x: 0;
4424
-UnityDecoration-shadow-offset-y: 3px;
4425
-UnityDecoration-active-shadow-color: rgba(0, 0, 0, 0.48);
4426
-UnityDecoration-active-shadow-radius: 18px;
4427
-UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32);
4428
-UnityDecoration-inactive-shadow-radius: 6px;
4429
-UnityDecoration-glow-size: 8px;
4430
-UnityDecoration-glow-color: #42A5F5;
4431
-UnityDecoration-title-indent: 4px;
4432
-UnityDecoration-title-fade: 32px;
4433
-UnityDecoration-title-alignment: 0.0;
4434
}
4435
4436
UnityDecoration .top {
4437
padding: 0 2px;
4438
border-style: none;
4439
border-radius: 2px 2px 0 0;
4440
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
4441
background-color: #37474F;
4442
color: #FFFFFF;
4443
}
4444
4445
UnityDecoration .top:backdrop {
4446
color: rgba(255, 255, 255, 0.7);
4447
}
4448
4449
UnityDecoration .menuitem {
4450
color: rgba(255, 255, 255, 0.7);
4451
}
4452
4453
UnityDecoration .menuitem:hover {
4454
box-shadow: inset 0 -2px currentColor;
4455
background-color: transparent;
4456
color: #FFFFFF;
4457
}
4458
4459
.background:not(.csd) headerbar:not(.titlebar) {
4460
border-radius: 0;
4461
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
4462
}
4463
4464
.background:not(.csd) headerbar:not(.titlebar).inline-toolbar {
4465
border-style: none;
4466
}
4467
4468
UnityPanelWidget,
4469
.unity-panel {
4470
background-color: #263238;
4471
color: #FFFFFF;
4472
}
4473
4474
UnityPanelWidget:backdrop,
4475
.unity-panel:backdrop {
4476
color: rgba(255, 255, 255, 0.7);
4477
}
4478
4479
.unity-panel.menuitem,
4480
.unity-panel .menuitem {
4481
color: rgba(255, 255, 255, 0.7);
4482
}
4483
4484
.unity-panel.menubar.menuitem:hover,
4485
.unity-panel.menubar .menuitem *:hover {
4486
box-shadow: inset 0 -2px currentColor;
4487
background-color: transparent;
4488
color: #FFFFFF;
4489
}
4490
4491
.menu IdoPlaybackMenuItem.menuitem:active {
4492
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
4493
animation: spin 1s linear infinite;
4494
color: #42A5F5;
4495
}
4496
4497
/**************
4498
* Mate-Panel *
4499
**************/
4500
.mate-panel-menu-bar menubar,
4501
#PanelApplet-window-menu-applet-button {
4502
background-color: transparent;
4503
}
4504
4505
#PanelPlug,
4506
PanelToplevel.background {
4507
background-color: #263238;
4508
color: #FFFFFF;
4509
font-weight: 500;
4510
}
4511
4512
PanelToplevel > widget > button {
4513
padding: 0 4px;
4514
border-radius: 0;
4515
}
4516
4517
PanelSeparator {
4518
color: rgba(0, 0, 0, 0.1);
4519
}
4520
4521
MatePanelAppletFrameDBus {
4522
border-style: solid;
4523
border-width: 0 1px;
4524
border-color: rgba(0, 0, 0, 0.1);
4525
}
4526
4527
.mate-panel-menu-bar menubar menuitem {
4528
padding: 4px;
4529
}
4530
4531
.mate-panel-menu-bar menubar menu menuitem {
4532
padding: 6px;
4533
}
4534
4535
.mate-panel-menu-bar #PanelApplet button {
4536
-GtkWidget-window-dragging: true;
4537
padding: 4px;
4538
border-radius: 0;
4539
}
4540
4541
PanelApplet.wnck-applet .wnck-pager {
4542
background-color: transparent;
4543
color: #40C4FF;
4544
}
4545
4546
PanelApplet.wnck-applet .wnck-pager:hover {
4547
background-color: alpha(currentColor, 0.15);
4548
}
4549
4550
PanelApplet.wnck-applet .wnck-pager:active {
4551
background-color: alpha(currentColor, 0.3);
4552
}
4553
4554
PanelApplet.wnck-applet .wnck-pager:selected {
4555
background-color: #42A5F5;
4556
}
4557
4558
#MatePanelPopupWindow {
4559
border: 1px solid rgba(0, 0, 0, 0.1);
4560
border-radius: 3px;
4561
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
4562
}
4563
4564
#MatePanelPopupWindow frame > border {
4565
border-style: none;
4566
}
4567
4568
#MatePanelPopupWindow ClockMap {
4569
border: 1px solid rgba(0, 0, 0, 0.1);
4570
}
4571
4572
na-tray-applet {
4573
-NaTrayApplet-icon-padding: 3px;
4574
-NaTrayApplet-icon-size: 16;
4575
}
4576
4577
.mate-panel-menu-bar {
4578
-PanelMenuBar-icon-visible: true;
4579
}
4580
4581
.mate-panel-applet-slider {
4582
background-color: transparent;
4583
}
4584
4585
.mate-panel-applet-slider frame {
4586
border: 1px solid rgba(0, 0, 0, 0.1);
4587
border-radius: 3px;
4588
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
4589
background-color: #F5F5F5;
4590
}
4591
4592
.mate-panel-applet-slider frame frame {
4593
all: unset;
4594
}
4595
4596
.mate-panel-applet-slider frame > border {
4597
border-style: none;
4598
}
4599
4600
/*********************
4601
* CAJA File manager *
4602
*********************/
4603
.caja-navigation-window button.toggle.image-button {
4604
border-radius: 2px;
4605
}
4606
4607
.caja-pathbar button {
4608
margin: 0 -1px 0 -2px;
4609
}
4610
4611
.caja-pathbar button > widget {
4612
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4613
-GtkArrow-arrow-scaling: 1;
4614
}
4615
4616
.caja-side-pane notebook viewport.frame,
4617
.caja-side-pane notebook widget .vertical {
4618
background-color: #FFFFFF;
4619
}
4620
4621
.caja-side-pane notebook,
4622
.caja-notebook {
4623
border-top: 1px solid rgba(0, 0, 0, 0.1);
4624
}
4625
4626
.caja-side-pane notebook .frame,
4627
.caja-notebook .frame {
4628
border-style: none;
4629
}
4630
4631
.caja-navigation-window statusbar {
4632
margin: 0 -10px;
4633
padding: 0 4px;
4634
border-top: 1px solid rgba(0, 0, 0, 0.1);
4635
}
4636
4637
.caja-notebook frame > border {
4638
border-style: none;
4639
}
4640
4641
#caja-extra-view-widget {
4642
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4643
background-color: #F5F5F5;
4644
}
4645
4646
#caja-extra-view-widget > box > box > label {
4647
font-weight: bold;
4648
}
4649
4650
/*********
4651
* Pluma *
4652
*********/
4653
.pluma-window statusbar {
4654
margin: 0 -10px;
4655
padding: 0 4px;
4656
border-top: 1px solid rgba(0, 0, 0, 0.1);
4657
}
4658
4659
.pluma-window statusbar frame > border {
4660
border-style: none;
4661
}
4662
4663
.pluma-window statusbar frame button.flat {
4664
padding: 0 4px;
4665
border-radius: 0;
4666
}
4667
4668
.pluma-window statusbar frame button.flat widget {
4669
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
4670
-GtkArrow-arrow-scaling: 1;
4671
}
4672
4673
.pluma-print-preview toolbar {
4674
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4675
}
4676
4677
.pluma-window paned.horizontal box.vertical box.horizontal button.flat {
4678
margin: 1px;
4679
}
4680
4681
.pluma-window paned.horizontal box.vertical .frame {
4682
border-style: none;
4683
}
4684
4685
.pluma-window paned.horizontal box.vertical notebook.frame {
4686
margin-top: -1px;
4687
border-top: 1px solid rgba(0, 0, 0, 0.1);
4688
}
4689
4690
.pluma-window paned.horizontal box.vertical notebook.frame box.vertical toolbar.horizontal {
4691
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4692
}
4693
4694
/*********
4695
* Atril *
4696
*********/
4697
.atril-window paned.horizontal box.vertical .frame {
4698
border-style: none;
4699
}
4700
4701
.atril-window paned.horizontal box.vertical notebook .frame {
4702
border-top: 1px solid rgba(0, 0, 0, 0.1);
4703
}
4704
4705
/* mate-screensaver lock dialog */
4706
.lock-dialog {
4707
border-radius: 2px;
4708
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);
4709
}
4710
4711
.lock-dialog frame > border {
4712
border-style: none;
4713
}
4714
4715
/******************
4716
* Budgie Desktop *
4717
******************/
4718
.budgie-container {
4719
background-color: transparent;
4720
}
4721
4722
.budgie-menu.background {
4723
padding: 0;
4724
background-color: #FFFFFF;
4725
}
4726
4727
.budgie-menu scrollbar,
4728
.budgie-menu entry.search {
4729
background-color: transparent;
4730
}
4731
4732
.budgie-menu entry.search {
4733
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4734
border-radius: 0;
4735
box-shadow: none;
4736
font-size: 120%;
4737
}
4738
4739
.budgie-menu .categories:dir(ltr) {
4740
border-bottom-left-radius: 2px;
4741
}
4742
4743
.budgie-menu .categories:dir(rtl) {
4744
border-bottom-right-radius: 2px;
4745
}
4746
4747
.budgie-menu button {
4748
min-height: 32px;
4749
padding: 0 8px;
4750
border-radius: 0;
4751
color: rgba(0, 0, 0, 0.87);
4752
font-weight: normal;
4753
}
4754
4755
.budgie-menu button:disabled {
4756
color: rgba(0, 0, 0, 0.38);
4757
}
4758
4759
.budgie-menu row {
4760
all: unset;
4761
}
4762
4763
button.budgie-menu-launcher {
4764
padding: 0 2px;
4765
}
4766
4767
popover.background.user-menu {
4768
padding: 8px;
4769
}
4770
4771
popover.background.user-menu .content-box {
4772
background-color: transparent;
4773
}
4774
4775
popover.background.user-menu separator {
4776
margin: 4px 0;
4777
}
4778
4779
popover.background.user-menu row {
4780
padding: 0;
4781
box-shadow: none;
4782
background-image: none;
4783
}
4784
4785
button.raven-trigger {
4786
padding: 0 4px;
4787
}
4788
4789
popover.background.places-menu {
4790
padding: 8px;
4791
}
4792
4793
popover.background.places-menu .name-button.text-button {
4794
padding-left: 8px;
4795
padding-right: 8px;
4796
}
4797
4798
popover.background.places-menu .name-button.text-button image:dir(ltr) {
4799
margin-right: 3px;
4800
}
4801
4802
popover.background.places-menu .name-button.text-button image:dir(rtl) {
4803
margin-left: 3px;
4804
}
4805
4806
popover.background.places-menu .places-section-header > image:dir(ltr) {
4807
margin: 0 -2px 0 5px;
4808
}
4809
4810
popover.background.places-menu .places-section-header > image:dir(rtl) {
4811
margin: 0 5px 0 -2px;
4812
}
4813
4814
popover.background.places-menu .places-list {
4815
margin-top: 4px;
4816
padding-top: 4px;
4817
border-top: 1px solid rgba(0, 0, 0, 0.1);
4818
background-color: transparent;
4819
}
4820
4821
popover.background.places-menu row {
4822
padding: 0;
4823
box-shadow: none;
4824
background-image: none;
4825
}
4826
4827
.budgie-panel {
4828
background-color: #263238;
4829
color: #FFFFFF;
4830
font-weight: 500;
4831
}
4832
4833
.budgie-panel button {
4834
border-radius: 0;
4835
}
4836
4837
.budgie-panel separator {
4838
background-color: rgba(255, 255, 255, 0.3);
4839
}
4840
4841
.budgie-panel .alert {
4842
color: #FF5252;
4843
}
4844
4845
.budgie-panel #tasklist-button {
4846
padding: 0 4px;
4847
}
4848
4849
.budgie-panel button.flat.launcher {
4850
padding: 0;
4851
}
4852
4853
.top .budgie-panel #tasklist-button, .budgie-panel .top #tasklist-button, .top .budgie-panel button.flat.launcher, .budgie-panel .top button.flat.launcher {
4854
border-image: radial-gradient(circle closest-corner at center calc(1px), currentColor 0%, transparent 0%) 0 0 0 0/0 0 0 0;
4855
}
4856
4857
.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
4858
.budgie-panel .pinned button.flat.launcher.running,
4859
.budgie-panel .pinned .top button.flat.launcher.running {
4860
border-image: radial-gradient(circle closest-corner at center calc(1px), currentColor 100%, transparent 0%) 2 0 0 0/2px 0 0 0;
4861
}
4862
4863
.bottom .budgie-panel #tasklist-button, .budgie-panel .bottom #tasklist-button, .bottom .budgie-panel button.flat.launcher, .budgie-panel .bottom button.flat.launcher {
4864
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0 0/0 0 0 0;
4865
}
4866
4867
.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
4868
.budgie-panel .pinned button.flat.launcher.running,
4869
.budgie-panel .pinned .bottom button.flat.launcher.running {
4870
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2 0/0 0 2px 0;
4871
}
4872
4873
.left .budgie-panel #tasklist-button, .budgie-panel .left #tasklist-button, .left .budgie-panel button.flat.launcher, .budgie-panel .left button.flat.launcher {
4874
border-image: radial-gradient(circle closest-corner at calc(1px) center, currentColor 0%, transparent 0%) 0 0 0 0/0 0 0 0;
4875
}
4876
4877
.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
4878
.budgie-panel .pinned button.flat.launcher.running,
4879
.budgie-panel .pinned .left button.flat.launcher.running {
4880
border-image: radial-gradient(circle closest-corner at calc(1px) center, currentColor 100%, transparent 0%) 0 2 0 0/0 2px 0 0;
4881
}
4882
4883
.right .budgie-panel #tasklist-button, .budgie-panel .right #tasklist-button, .right .budgie-panel button.flat.launcher, .budgie-panel .right button.flat.launcher {
4884
border-image: radial-gradient(circle closest-corner at calc(100% - 1px) center, currentColor 0%, transparent 0%) 0 0 0 0/0 0 0 0;
4885
}
4886
4887
.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
4888
.budgie-panel .pinned button.flat.launcher.running,
4889
.budgie-panel .pinned .right button.flat.launcher.running {
4890
border-image: radial-gradient(circle closest-corner at calc(100% - 1px) center, currentColor 100%, transparent 0%) 0 0 0 2/0 0 0 2px;
4891
}
4892
4893
frame.raven-frame > border {
4894
border-style: none;
4895
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22);
4896
}
4897
4898
.top frame.raven-frame > border {
4899
margin-bottom: 32px;
4900
}
4901
4902
.bottom frame.raven-frame > border {
4903
margin-top: 32px;
4904
}
4905
4906
.left frame.raven-frame > border {
4907
margin-right: 32px;
4908
}
4909
4910
.right frame.raven-frame > border {
4911
margin-left: 32px;
4912
}
4913
4914
.raven {
4915
background-color: #FAFAFA;
4916
}
4917
4918
.raven > stack {
4919
margin-bottom: -10px;
4920
}
4921
4922
.raven stackswitcher.linked > button {
4923
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FFA726 0%, transparent 0%) 0 0 0/0 0 0px;
4924
border-radius: 0;
4925
}
4926
4927
.raven stackswitcher.linked > button:checked {
4928
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FFA726 100%, transparent 0%) 0 0 2/0 0 2px;
4929
background-color: transparent;
4930
}
4931
4932
.raven .raven-header {
4933
min-height: 32px;
4934
padding: 3px;
4935
}
4936
4937
.raven .raven-header:not(.top) {
4938
margin-top: -6px;
4939
}
4940
4941
.raven .raven-header.top {
4942
padding: 2px 0;
4943
background-color: #42A5F5;
4944
color: #FFFFFF;
4945
}
4946
4947
.raven .raven-header.top stackswitcher button {
4948
margin: -6px 0;
4949
min-height: 32px;
4950
}
4951
4952
.raven .raven-header.top button.image-button:dir(ltr) {
4953
margin-right: 2px;
4954
}
4955
4956
.raven .raven-header.top button.image-button:dir(rtl) {
4957
margin-left: 2px;
4958
}
4959
4960
.raven .raven-header.top > image {
4961
margin: 0 8px;
4962
}
4963
4964
.raven .raven-header.top > label {
4965
margin: 0 -8px;
4966
font-weight: bold;
4967
}
4968
4969
.raven .raven-header.bottom {
4970
border-top: 1px solid rgba(0, 0, 0, 0.1);
4971
}
4972
4973
.raven viewport.frame .raven-header {
4974
margin-top: -8px;
4975
}
4976
4977
.raven .raven-background {
4978
border-style: solid none;
4979
border-width: 1px;
4980
border-color: rgba(0, 0, 0, 0.1);
4981
background-color: #FFFFFF;
4982
}
4983
4984
.raven .raven-background.frame {
4985
border-style: solid none;
4986
}
4987
4988
.raven .raven-background > overlay > image {
4989
color: rgba(0, 0, 0, 0.26);
4990
}
4991
4992
.raven .raven-background grid > label:first-child {
4993
min-height: 32px;
4994
}
4995
4996
.raven scrolledwindow.raven-background {
4997
border-bottom-style: none;
4998
}
4999
5000
.raven .raven-header.top + .raven-background {
5001
border-style: none;
5002
background-color: #42A5F5;
5003
color: #FFFFFF;
5004
}
5005
5006
.raven .raven-header.top + .raven-background stackswitcher button {
5007
margin: -4px 0;
5008
}
5009
5010
.raven .powerstrip button {
5011
margin: 2px 0 1px;
5012
padding: 10px;
5013
}
5014
5015
.raven .option-subtitle {
5016
font-size: smaller;
5017
}
5018
5019
calendar.raven-calendar {
5020
border-style: none;
5021
background-color: transparent;
5022
}
5023
5024
calendar.raven-calendar:selected {
5025
border-radius: 2px;
5026
background-color: #42A5F5;
5027
}
5028
5029
.raven-mpris {
5030
background-color: rgba(0, 0, 0, 0.6);
5031
color: #FFFFFF;
5032
}
5033
5034
.raven-mpris label {
5035
min-height: 24px;
5036
}
5037
5038
.raven-mpris button.image-button {
5039
padding: 10px;
5040
}
5041
5042
.budgie-notification-window, .budgie-osd-window, .budgie-switcher-window {
5043
background-color: transparent;
5044
}
5045
5046
.budgie-notification .notification-title, .budgie-switcher .notification-title {
5047
font-size: 120%;
5048
}
5049
5050
.budgie-osd .budgie-osd-text {
5051
font-size: 120%;
5052
}
5053
5054
.drop-shadow {
5055
margin: 5px 9px;
5056
padding: 3px;
5057
border-radius: 2px;
5058
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);
5059
background-color: #FAFAFA;
5060
}
5061
5062
.drop-shadow .linked > button {
5063
border-radius: 2px;
5064
}
5065
5066
.budgie-session-dialog, .budgie-polkit-dialog, .budgie-run-dialog {
5067
border-radius: 2px;
5068
background-color: #FAFAFA;
5069
}
5070
5071
.budgie-session-dialog decoration, .budgie-polkit-dialog decoration, .budgie-run-dialog decoration {
5072
border-radius: 2px;
5073
}
5074
5075
.budgie-session-dialog label:not(:last-child),
5076
.budgie-session-dialog .dialog-title {
5077
font-size: 120%;
5078
}
5079
5080
.budgie-session-dialog .linked.horizontal > button {
5081
padding: 8px 16px;
5082
border-top: 1px solid rgba(0, 0, 0, 0.1);
5083
border-radius: 0;
5084
}
5085
5086
.budgie-session-dialog .linked.horizontal > button:first-child {
5087
border-bottom-left-radius: 2px;
5088
}
5089
5090
.budgie-session-dialog .linked.horizontal > button:last-child {
5091
border-bottom-right-radius: 2px;
5092
}
5093
5094
.budgie-polkit-dialog .message {
5095
color: rgba(0, 0, 0, 0.38);
5096
}
5097
5098
.budgie-polkit-dialog .failure {
5099
color: #FF5252;
5100
}
5101
5102
.budgie-run-dialog {
5103
background-color: #FFFFFF;
5104
}
5105
5106
.budgie-run-dialog entry.search {
5107
font-size: 120%;
5108
padding: 6px 14px;
5109
box-shadow: inset 0 1px rgba(255, 255, 255, 0.4);
5110
background-color: transparent;
5111
}
5112
5113
.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
5114
headerbar .subtitle,
5115
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 {
5116
opacity: 1;
5117
}
5118
5119
.budgie-run-dialog scrolledwindow {
5120
border-top: 1px solid rgba(0, 0, 0, 0.1);
5121
}
5122
5123
/************************
5124
* LightDM GTK+ Greeter *
5125
************************/
5126
#panel_window {
5127
background-color: rgba(0, 0, 0, 0.3);
5128
color: #FFFFFF;
5129
}
5130
5131
#panel_window menubar,
5132
#panel_window separator {
5133
background-color: transparent;
5134
}
5135
5136
#panel_window separator {
5137
padding: 0 4px;
5138
}
5139
5140
#panel_window separator:first-child {
5141
padding: 0 8px;
5142
}
5143
5144
#panel_window menubar > menuitem {
5145
color: rgba(255, 255, 255, 0.7);
5146
}
5147
5148
#panel_window menubar > menuitem:hover {
5149
color: #FFFFFF;
5150
}
5151
5152
#panel_window menubar > menuitem:disabled label {
5153
color: rgba(255, 255, 255, 0.3);
5154
}
5155
5156
#login_window,
5157
#shutdown_dialog,
5158
#restart_dialog {
5159
margin: 8px;
5160
border-radius: 2px;
5161
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);
5162
background-color: #FAFAFA;
5163
}
5164
5165
#content_frame {
5166
padding-bottom: 20px;
5167
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
5168
}
5169
5170
#buttonbox_frame {
5171
padding-top: 24px;
5172
}
5173
5174
#buttonbox_frame button {
5175
margin: -16px;
5176
}
5177
5178
#greeter_infobar {
5179
margin-top: -1px;
5180
}
5181
5182
/* GTK NAMED COLORS
5183
----------------
5184
use responsibly! */
5185
/*
5186
widget text/foreground color */
5187
@define-color theme_fg_color rgba(0, 0, 0, 0.87);
5188
/*
5189
text color for entries, views and content in general */
5190
@define-color theme_text_color rgba(0, 0, 0, 0.87);
5191
/*
5192
widget base background color */
5193
@define-color theme_bg_color #F5F5F5;
5194
/*
5195
text widgets and the like base background color */
5196
@define-color theme_base_color #FFFFFF;
5197
/*
5198
base background color of selections */
5199
@define-color theme_selected_bg_color #42A5F5;
5200
/*
5201
text/foreground color of selections */
5202
@define-color theme_selected_fg_color #FFFFFF;
5203
/*
5204
base background color of insensitive widgets */
5205
@define-color insensitive_bg_color #F5F5F5;
5206
/*
5207
text foreground color of insensitive widgets */
5208
@define-color insensitive_fg_color rgba(0, 0, 0, 0.38);
5209
/*
5210
insensitive text widgets and the like base background color */
5211
@define-color insensitive_base_color #FAFAFA;
5212
/*
5213
widget text/foreground color on backdrop windows */
5214
@define-color theme_unfocused_fg_color rgba(0, 0, 0, 0.87);
5215
/*
5216
text color for entries, views and content in general on backdrop windows */
5217
@define-color theme_unfocused_text_color rgba(0, 0, 0, 0.87);
5218
/*
5219
widget base background color on backdrop windows */
5220
@define-color theme_unfocused_bg_color #F5F5F5;
5221
/*
5222
text widgets and the like base background color on backdrop windows */
5223
@define-color theme_unfocused_base_color #FFFFFF;
5224
/*
5225
base background color of selections on backdrop windows */
5226
@define-color theme_unfocused_selected_bg_color #42A5F5;
5227
/*
5228
text/foreground color of selections on backdrop windows */
5229
@define-color theme_unfocused_selected_fg_color #FFFFFF;
5230
/*
5231
insensitive color on backdrop windows */
5232
@define-color unfocused_insensitive_color rgba(0, 0, 0, 0.38);
5233
/*
5234
widgets main borders color */
5235
@define-color borders rgba(0, 0, 0, 0.1);
5236
/*
5237
widgets main borders color on backdrop windows */
5238
@define-color unfocused_borders rgba(0, 0, 0, 0.1);
5239
/*
5240
these are pretty self explicative */
5241
@define-color warning_color #FF6D00;
5242
@define-color error_color #DD2C00;
5243
@define-color success_color #00C853;
5244
/*
5245
FIXME this is really an API */
5246
@define-color content_view_bg #FFFFFF;
5247
@define-color placeholder_text_color #757575;
5248