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

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