A fork of the Materia GTK theme.

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

 gtk.css

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