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