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