A fork of the Materia GTK theme.

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

 gtk-light.css

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