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

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