A fork of the Materia GTK theme.

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

 gtk-light.css

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