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

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