A fork of the Materia GTK theme.

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

 gtk-dark_light.css

View raw Download
text/plain • 95.69 kiB
ASCII text, with very long lines (469)
        
            
1
@keyframes ripple_effect {
2
from {
3
background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(alpha(currentColor, 0.15)), to(transparent)), linear-gradient(to bottom, alpha(currentColor, 0)); }
4
to {
5
background-image: -gtk-gradient(radial, center center, 0, center center, 0.4, to(alpha(currentColor, 0.15)), to(transparent)), linear-gradient(to bottom, alpha(currentColor, 0.15)); } }
6
@keyframes flat_ripple_effect {
7
from {
8
background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(alpha(currentColor, 0.15)), to(transparent)), linear-gradient(to bottom, alpha(currentColor, 0.15)); }
9
to {
10
background-image: -gtk-gradient(radial, center center, 0, center center, 0.4, to(alpha(currentColor, 0.15)), to(transparent)), linear-gradient(to bottom, alpha(currentColor, 0.15)); } }
11
@keyframes list_ripple_effect {
12
from {
13
background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(alpha(currentColor, 0.15)), to(transparent)), linear-gradient(to bottom, alpha(currentColor, 0)); }
14
to {
15
background-image: -gtk-gradient(radial, center center, 0, center center, 0.4, to(alpha(currentColor, 0.15)), to(transparent)), linear-gradient(to bottom, alpha(currentColor, 0)); } }
16
* {
17
padding: 0;
18
background-clip: padding-box;
19
-GtkToolButton-icon-spacing: 4;
20
-GtkTextView-error-underline-color: #DD2C00;
21
-GtkCheckButton-indicator-size: 20;
22
-GtkCheckMenuItem-indicator-size: 16;
23
-GtkScrolledWindow-scrollbar-spacing: 0;
24
-GtkScrolledWindow-scrollbars-within-bevel: 1;
25
-GtkToolItemGroup-expander-size: 11;
26
-GtkExpander-expander-size: 16;
27
-GtkTreeView-expander-size: 11;
28
-GtkTreeView-horizontal-separator: 4;
29
-GtkMenu-horizontal-padding: 0;
30
-GtkMenu-vertical-padding: 0;
31
-GtkWidget-link-color: #42A5F5;
32
-GtkWidget-visited-link-color: #E040FB;
33
-GtkWidget-focus-padding: 2;
34
-GtkWidget-focus-line-width: 1;
35
-GtkWidget-text-handle-width: 20;
36
-GtkWidget-text-handle-height: 20;
37
-GtkDialog-button-spacing: 4;
38
-GtkDialog-action-area-border: 0;
39
-GtkStatusbar-shadow-type: none;
40
outline-style: solid;
41
outline-width: 2px;
42
outline-color: alpha(currentColor, 0.3);
43
outline-offset: -4px;
44
outline-radius: 2px; }
45
46
/***************
47
* Base States *
48
***************/
49
.background {
50
background-color: #455A64;
51
color: #FFFFFF; }
52
53
/*
54
These wildcard seems unavoidable, need to investigate.
55
Wildcards are bad and troublesome, use them with care,
56
or better, just don't.
57
Everytime a wildcard is used a kitten dies, painfully.
58
*/
59
*:insensitive {
60
-gtk-image-effect: dim; }
61
62
.gtkstyle-fallback {
63
background-color: #455A64;
64
color: #FFFFFF; }
65
.gtkstyle-fallback:prelight {
66
background-color: #3b4c55;
67
color: #FFFFFF; }
68
.gtkstyle-fallback:active {
69
background-color: #303f46;
70
color: #FFFFFF; }
71
.gtkstyle-fallback:insensitive {
72
background-color: #455A64;
73
color: rgba(255, 255, 255, 0.4); }
74
.gtkstyle-fallback:selected {
75
background-color: #42A5F5;
76
color: #FFFFFF; }
77
78
.view {
79
background-color: #546E7A;
80
color: #FFFFFF; }
81
.view:hover, .view:active, .view:selected, GtkCalendar:selected {
82
border-radius: 2px; }
83
.view:insensitive {
84
color: rgba(255, 255, 255, 0.4); }
85
86
.rubberband, GtkTreeView.view.rubberband, .content-view.rubberband {
87
border: 1px solid #40C4FF;
88
background-color: rgba(64, 196, 255, 0.3); }
89
90
.label.separator {
91
color: #FFFFFF; }
92
.label:insensitive {
93
color: rgba(255, 255, 255, 0.4); }
94
95
.dim-label, .label.separator, .titlebar .subtitle,
96
.header-bar .subtitle {
97
opacity: 0.6; }
98
99
GtkAssistant .sidebar {
100
padding: 6px 0; }
101
GtkAssistant .sidebar:dir(ltr) {
102
border-right: 1px solid rgba(0, 0, 0, 0.2); }
103
GtkAssistant .sidebar:dir(rtl) {
104
border-left: 1px solid rgba(0, 0, 0, 0.2); }
105
GtkAssistant .sidebar .label {
106
opacity: 0.6;
107
padding: 5px 12px 6px;
108
font-weight: 500; }
109
GtkAssistant .sidebar .label.highlight {
110
opacity: 1; }
111
112
GtkTextView {
113
background-color: #4d646f; }
114
115
.grid-child {
116
padding: 4px;
117
border-radius: 2px; }
118
119
.popover.osd, .app-notification,
120
.app-notification.frame, .osd .scale-popup, .floating-bar, .osd {
121
opacity: 0.9; }
122
123
/*********************
124
* Spinner Animation *
125
*********************/
126
@keyframes spin {
127
to {
128
-gtk-icon-transform: rotate(1turn); } }
129
.spinner {
130
background-color: blue;
131
background-image: none;
132
opacity: 0;
133
-gtk-icon-source: -gtk-icontheme("process-working-symbolic"); }
134
.spinner:active {
135
opacity: 1;
136
animation: spin 1s linear infinite; }
137
.spinner:active:insensitive {
138
opacity: 0.4; }
139
140
/****************
141
* Text Entries *
142
****************/
143
.entry {
144
padding: 7px 8px 8px;
145
border-radius: 2px;
146
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
147
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
148
background-color: #546E7A;
149
color: #FFFFFF; }
150
.entry:focus {
151
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
152
.entry:insensitive {
153
color: rgba(255, 255, 255, 0.4);
154
background-color: #4d646f; }
155
.entry.flat, .notebook GtkGrid > .entry {
156
border-radius: 0;
157
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
158
border-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.001, to(#42A5F5), to(transparent)) 0 0 0/0 0 0px;
159
border-radius: 0;
160
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
161
background-color: transparent;
162
color: #FFFFFF; }
163
.entry.flat:focus, .notebook GtkGrid > .entry:focus {
164
border-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.5, to(#42A5F5), to(transparent)) 0 0 2/0 0 2px;
165
box-shadow: inset 0 -2px #42A5F5;
166
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0 0.3s; }
167
.entry.flat:insensitive, .notebook GtkGrid > .entry:insensitive {
168
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
169
background-color: transparent;
170
color: rgba(255, 255, 255, 0.4); }
171
.entry.image.left {
172
padding-left: 2px; }
173
.entry.image.right {
174
padding-right: 2px; }
175
.entry.progressbar, GtkTreeView.view.progressbar, GtkTreeView.view.trough {
176
margin: 2px;
177
border-style: none none solid;
178
border-width: 2px;
179
border-color: #42A5F5;
180
border-radius: 0;
181
box-shadow: none;
182
background-color: transparent;
183
background-image: none; }
184
.linked > .entry.flat, .notebook GtkGrid.linked > .entry, .linked.vertical > .entry.flat, .notebook GtkGrid.linked.vertical > .entry {
185
border-radius: 0; }
186
.entry.error {
187
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
188
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
189
background-color: #DD2C00;
190
color: #FFFFFF; }
191
.entry.error:focus {
192
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
193
.entry.error:insensitive {
194
color: rgba(255, 255, 255, 0.4);
195
background-color: #4d646f; }
196
.entry.error.flat, .notebook GtkGrid > .error.entry {
197
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
198
border-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.001, to(#DD2C00), to(transparent)) 0 0 0/0 0 0px;
199
border-radius: 0;
200
box-shadow: inset 0 -1px #DD2C00;
201
background-color: transparent;
202
color: #FFFFFF; }
203
.entry.error.flat:focus, .notebook GtkGrid > .error.entry:focus {
204
border-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.5, to(#DD2C00), to(transparent)) 0 0 2/0 0 2px;
205
box-shadow: inset 0 -2px #DD2C00;
206
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0 0.3s; }
207
.entry.error.flat:insensitive, .notebook GtkGrid > .error.entry:insensitive {
208
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
209
background-color: transparent;
210
color: rgba(255, 255, 255, 0.4); }
211
.entry.warning {
212
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
213
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
214
background-color: #FF6D00;
215
color: #FFFFFF; }
216
.entry.warning:focus {
217
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
218
.entry.warning:insensitive {
219
color: rgba(255, 255, 255, 0.4);
220
background-color: #4d646f; }
221
.entry.warning.flat, .notebook GtkGrid > .warning.entry {
222
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
223
border-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.001, to(#FF6D00), to(transparent)) 0 0 0/0 0 0px;
224
border-radius: 0;
225
box-shadow: inset 0 -1px #FF6D00;
226
background-color: transparent;
227
color: #FFFFFF; }
228
.entry.warning.flat:focus, .notebook GtkGrid > .warning.entry:focus {
229
border-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.5, to(#FF6D00), to(transparent)) 0 0 2/0 0 2px;
230
box-shadow: inset 0 -2px #FF6D00;
231
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0 0.3s; }
232
.entry.warning.flat:insensitive, .notebook GtkGrid > .warning.entry:insensitive {
233
box-shadow: inset 0 -1px alpha(currentColor, 0.3);
234
background-color: transparent;
235
color: rgba(255, 255, 255, 0.4); }
236
.entry.image:not(:hover):not(:active) {
237
color: alpha(currentColor, 0.75); }
238
.entry.image:insensitive {
239
color: alpha(currentColor, 0.6); }
240
GtkTreeView .entry:not(:selected), GtkTreeView .entry:not(:selected):focus {
241
padding: 2px;
242
border-image: none;
243
border-radius: 0;
244
box-shadow: none;
245
background-color: #546E7A; }
246
247
/***********
248
* Buttons *
249
***********/
250
@keyframes needs_attention {
251
from {
252
background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent)); }
253
to {
254
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#FF4081), to(transparent)); } }
255
.button {
256
padding: 7px 10px 8px;
257
border-radius: 2px;
258
background-repeat: no-repeat;
259
background-position: center, center;
260
background-size: 90px 90px, auto;
261
font-weight: 500;
262
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
263
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
264
background-color: #607D8B;
265
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0)), to(transparent)), linear-gradient(to bottom, alpha(currentColor, 0));
266
color: rgba(255, 255, 255, 0.75); }
267
.button:hover {
268
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
269
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0)), to(transparent)), linear-gradient(to bottom, alpha(currentColor, 0));
270
color: #FFFFFF; }
271
.button:active {
272
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1), background-image 0;
273
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
274
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
275
color: #FFFFFF; }
276
.button:insensitive {
277
box-shadow: none;
278
background-color: alpha(currentColor, 0.3);
279
color: rgba(255, 255, 255, 0.3); }
280
.button:insensitive > .label {
281
color: inherit; }
282
.button:checked {
283
background-color: #42A5F5;
284
color: #FFFFFF; }
285
.button:checked:insensitive {
286
background-color: alpha(currentColor, 0.3);
287
color: rgba(66, 165, 245, 0.4); }
288
.button:checked:insensitive > .label {
289
color: inherit; }
290
.spinbutton .button, .popover .linked > .button, .notebook tab .button, GtkCalendar.button, .message-dialog.csd .dialog-action-area .button, .sidebar-button.button, .toolbar:not(.search-bar) .button, .titlebar .button:not(.suggested-action):not(.destructive-action),
291
.header-bar .button:not(.suggested-action):not(.destructive-action), .frame.action-bar .button:not(.suggested-action):not(.destructive-action), .app-notification .button,
292
.app-notification.frame .button,
293
.button.flat {
294
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
295
box-shadow: none;
296
background-color: transparent;
297
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0)), to(transparent)), linear-gradient(to bottom, alpha(currentColor, 0));
298
color: alpha(currentColor, 0.75); }
299
.spinbutton .button:hover, .popover .linked > .button:hover, .notebook tab .button:hover, GtkCalendar.button:hover, .message-dialog.csd .dialog-action-area .button:hover, .sidebar-button.button:hover, .toolbar:not(.search-bar) .button:hover, .titlebar .button:hover:not(.suggested-action):not(.destructive-action),
300
.header-bar .button:hover:not(.suggested-action):not(.destructive-action), .frame.action-bar .button:hover:not(.suggested-action):not(.destructive-action), .app-notification .button:hover,
301
.button.flat:hover {
302
box-shadow: none;
303
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0)), to(transparent)), linear-gradient(to bottom, alpha(currentColor, 0.15));
304
color: currentColor; }
305
.spinbutton .button:active, .popover .linked > .button:active, .notebook tab .button:active, GtkCalendar.button:active, .message-dialog.csd .dialog-action-area .button:active, .sidebar-button.button:active, .toolbar:not(.search-bar) .button:active, .titlebar .button:active:not(.suggested-action):not(.destructive-action),
306
.header-bar .button:active:not(.suggested-action):not(.destructive-action), .frame.action-bar .button:active:not(.suggested-action):not(.destructive-action), .app-notification .button:active,
307
.button.flat:active {
308
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-image 0;
309
animation: flat_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
310
box-shadow: none;
311
color: currentColor; }
312
.spinbutton .button:insensitive, .popover .linked > .button:insensitive, .notebook tab .button:insensitive, GtkCalendar.button:insensitive, .message-dialog.csd .dialog-action-area .button:insensitive, .sidebar-button.button:insensitive, .toolbar:not(.search-bar) .button:insensitive, .titlebar .button:insensitive:not(.suggested-action):not(.destructive-action),
313
.header-bar .button:insensitive:not(.suggested-action):not(.destructive-action), .frame.action-bar .button:insensitive:not(.suggested-action):not(.destructive-action), .app-notification .button:insensitive,
314
.button.flat:insensitive {
315
box-shadow: none;
316
background-color: transparent;
317
color: alpha(currentColor, 0.3); }
318
.spinbutton .button:insensitive > .label, .popover .linked > .button:insensitive > .label, .notebook tab .button:insensitive > .label, GtkCalendar.button:insensitive > .label, .message-dialog.csd .dialog-action-area .button:insensitive > .label, .sidebar-button.button:insensitive > .label, .toolbar:not(.search-bar) .button:insensitive > .label, .titlebar .button:insensitive:not(.suggested-action):not(.destructive-action) > .label,
319
.header-bar .button:insensitive:not(.suggested-action):not(.destructive-action) > .label, .frame.action-bar .button:insensitive:not(.suggested-action):not(.destructive-action) > .label, .app-notification .button:insensitive > .label,
320
.button.flat:insensitive > .label {
321
color: inherit; }
322
.toolbar:not(.search-bar) .button:checked, .titlebar .button:checked:not(.suggested-action):not(.destructive-action),
323
.header-bar .button:checked:not(.suggested-action):not(.destructive-action), .frame.action-bar .button:checked:not(.suggested-action):not(.destructive-action), .app-notification .button:checked,
324
.button.flat:checked {
325
background-color: alpha(currentColor, 0.3);
326
color: currentColor; }
327
.toolbar:not(.search-bar) .button:checked:insensitive, .titlebar .button:checked:insensitive:not(.suggested-action):not(.destructive-action),
328
.header-bar .button:checked:insensitive:not(.suggested-action):not(.destructive-action), .frame.action-bar .button:checked:insensitive:not(.suggested-action):not(.destructive-action), .app-notification .button:checked:insensitive,
329
.button.flat:checked:insensitive {
330
background-color: alpha(currentColor, 0.3);
331
color: alpha(currentColor, 0.4); }
332
.toolbar:not(.search-bar) .button:checked:insensitive > .label, .titlebar .button:checked:insensitive:not(.suggested-action):not(.destructive-action) > .label,
333
.header-bar .button:checked:insensitive:not(.suggested-action):not(.destructive-action) > .label, .frame.action-bar .button:checked:insensitive:not(.suggested-action):not(.destructive-action) > .label, .app-notification .button:checked:insensitive > .label,
334
.button.flat:checked:insensitive > .label {
335
color: inherit; }
336
.button.osd.image-button {
337
padding: 16px;
338
background-size: 60px 60px, auto; }
339
.button.osd:insensitive {
340
opacity: 0; }
341
.button.suggested-action {
342
background-color: #FF4081;
343
color: #FFFFFF; }
344
.button.suggested-action:insensitive {
345
box-shadow: none;
346
background-color: alpha(currentColor, 0.3);
347
color: rgba(255, 255, 255, 0.3); }
348
.button.suggested-action:insensitive > .label {
349
color: inherit; }
350
.button.suggested-action:checked {
351
background-color: #ff79a7; }
352
.toolbar:not(.search-bar) .suggested-action.button, .titlebar .suggested-action.button:not(.suggested-action):not(.destructive-action),
353
.header-bar .suggested-action.button:not(.suggested-action):not(.destructive-action), .frame.action-bar .suggested-action.button:not(.suggested-action):not(.destructive-action), .app-notification .suggested-action.button,
354
.button.suggested-action.flat {
355
background-color: transparent;
356
color: #FF4081; }
357
.toolbar:not(.search-bar) .suggested-action.button:insensitive, .titlebar .suggested-action.button:insensitive:not(.suggested-action):not(.destructive-action),
358
.header-bar .suggested-action.button:insensitive:not(.suggested-action):not(.destructive-action), .frame.action-bar .suggested-action.button:insensitive:not(.suggested-action):not(.destructive-action), .app-notification .suggested-action.button:insensitive,
359
.button.suggested-action.flat:insensitive {
360
box-shadow: none;
361
background-color: transparent;
362
color: alpha(currentColor, 0.3); }
363
.toolbar:not(.search-bar) .suggested-action.button:insensitive > .label, .titlebar .suggested-action.button:insensitive:not(.suggested-action):not(.destructive-action) > .label,
364
.header-bar .suggested-action.button:insensitive:not(.suggested-action):not(.destructive-action) > .label, .frame.action-bar .suggested-action.button:insensitive:not(.suggested-action):not(.destructive-action) > .label, .app-notification .suggested-action.button:insensitive > .label,
365
.button.suggested-action.flat:insensitive > .label {
366
color: inherit; }
367
.button.destructive-action {
368
background-color: #FF5252;
369
color: #FFFFFF; }
370
.button.destructive-action:insensitive {
371
box-shadow: none;
372
background-color: alpha(currentColor, 0.3);
373
color: rgba(255, 255, 255, 0.3); }
374
.button.destructive-action:insensitive > .label {
375
color: inherit; }
376
.button.destructive-action:checked {
377
background-color: #ff8686; }
378
.toolbar:not(.search-bar) .destructive-action.button, .titlebar .destructive-action.button:not(.suggested-action):not(.destructive-action),
379
.header-bar .destructive-action.button:not(.suggested-action):not(.destructive-action), .frame.action-bar .destructive-action.button:not(.suggested-action):not(.destructive-action), .app-notification .destructive-action.button,
380
.button.destructive-action.flat {
381
background-color: transparent;
382
color: #FF5252; }
383
.toolbar:not(.search-bar) .destructive-action.button:insensitive, .titlebar .destructive-action.button:insensitive:not(.suggested-action):not(.destructive-action),
384
.header-bar .destructive-action.button:insensitive:not(.suggested-action):not(.destructive-action), .frame.action-bar .destructive-action.button:insensitive:not(.suggested-action):not(.destructive-action), .app-notification .destructive-action.button:insensitive,
385
.button.destructive-action.flat:insensitive {
386
box-shadow: none;
387
background-color: transparent;
388
color: alpha(currentColor, 0.3); }
389
.toolbar:not(.search-bar) .destructive-action.button:insensitive > .label, .titlebar .destructive-action.button:insensitive:not(.suggested-action):not(.destructive-action) > .label,
390
.header-bar .destructive-action.button:insensitive:not(.suggested-action):not(.destructive-action) > .label, .frame.action-bar .destructive-action.button:insensitive:not(.suggested-action):not(.destructive-action) > .label, .app-notification .destructive-action.button:insensitive > .label,
391
.button.destructive-action.flat:insensitive > .label {
392
color: inherit; }
393
.button.text-button,
394
GtkScaleButton.button.text-button,
395
GtkVolumeButton.button.text-button {
396
padding-left: 16px;
397
padding-right: 16px; }
398
.button.text-button.image-button {
399
padding: 7px 10px 8px;
400
outline-radius: 2px;
401
border-radius: 2px;
402
background-size: 90px 90px, auto; }
403
.button.text-button.image-button .label:first-child {
404
padding-left: 6px; }
405
.button.text-button.image-button .label:last-child {
406
padding-right: 6px; }
407
.stack-switcher >
408
.button {
409
outline-offset: -4px; }
410
.stack-switcher >
411
.button > .label {
412
padding-left: 6px;
413
padding-right: 6px; }
414
.stack-switcher >
415
.button > GtkImage {
416
padding-left: 6px;
417
padding-right: 6px;
418
padding-top: 3px;
419
padding-bottom: 3px; }
420
.stack-switcher >
421
.button.text-button {
422
padding: 7px 10px 8px; }
423
.stack-switcher >
424
.button.image-button {
425
padding: 7px 4px; }
426
.stack-switcher >
427
.button.needs-attention:checked > .label, .stack-switcher >
428
.button.needs-attention:checked > GtkImage {
429
animation: none;
430
background-image: none; }
431
.primary-toolbar
432
.button {
433
icon-shadow: none; }
434
.toolbar:not(.search-bar) .linked > .button, .titlebar .linked > .button:not(.suggested-action):not(.destructive-action),
435
.header-bar .linked > .button:not(.suggested-action):not(.destructive-action), .frame.action-bar .linked > .button:not(.suggested-action):not(.destructive-action), .app-notification .linked > .button, .toolbar:not(.search-bar) .linked.vertical > .button, .titlebar .linked.vertical > .button:not(.suggested-action):not(.destructive-action),
436
.header-bar .linked.vertical > .button:not(.suggested-action):not(.destructive-action), .frame.action-bar .linked.vertical > .button:not(.suggested-action):not(.destructive-action), .app-notification .linked.vertical > .button, .linked >
437
.button.flat, .linked.vertical >
438
.button.flat {
439
border-radius: 2px; }
440
.toolbar:not(.search-bar) .linked > .image-button.button, .titlebar .linked > .image-button.button:not(.suggested-action):not(.destructive-action),
441
.header-bar .linked > .image-button.button:not(.suggested-action):not(.destructive-action), .frame.action-bar .linked > .image-button.button:not(.suggested-action):not(.destructive-action), .app-notification .linked > .image-button.button, .toolbar:not(.search-bar) .linked.vertical > .image-button.button, .titlebar .linked.vertical > .image-button.button:not(.suggested-action):not(.destructive-action),
442
.header-bar .linked.vertical > .image-button.button:not(.suggested-action):not(.destructive-action), .frame.action-bar .linked.vertical > .image-button.button:not(.suggested-action):not(.destructive-action), .app-notification .linked.vertical > .image-button.button, .linked >
443
.button.flat.image-button, .linked.vertical >
444
.button.flat.image-button {
445
outline-radius: 100px;
446
border-radius: 100px; }
447
.toolbar:not(.search-bar) .linked > .text-button.image-button.button, .titlebar .linked > .text-button.image-button.button:not(.suggested-action):not(.destructive-action),
448
.header-bar .linked > .text-button.image-button.button:not(.suggested-action):not(.destructive-action), .frame.action-bar .linked > .text-button.image-button.button:not(.suggested-action):not(.destructive-action), .app-notification .linked > .text-button.image-button.button, .toolbar:not(.search-bar) .linked.vertical > .text-button.image-button.button, .titlebar .linked.vertical > .text-button.image-button.button:not(.suggested-action):not(.destructive-action),
449
.header-bar .linked.vertical > .text-button.image-button.button:not(.suggested-action):not(.destructive-action), .frame.action-bar .linked.vertical > .text-button.image-button.button:not(.suggested-action):not(.destructive-action), .app-notification .linked.vertical > .text-button.image-button.button, .linked >
450
.button.flat.text-button.image-button, .linked.vertical >
451
.button.flat.text-button.image-button {
452
outline-radius: 2px;
453
border-radius: 2px; }
454
455
.button.image-button, .inline-toolbar
456
.button, .spinbutton .button, .notebook tab .button, GtkScaleButton.button,
457
GtkVolumeButton.button, .header-bar .button.titlebutton,
458
.titlebar .button.titlebutton, .nautilus-circular-button {
459
padding: 10px;
460
outline-radius: 100px;
461
border-radius: 100px;
462
background-size: 45px 45px, auto; }
463
464
.stack-switcher >
465
.button.needs-attention > .label, .stack-switcher >
466
.button.needs-attention > GtkImage, .sidebar-item.needs-attention > .label {
467
animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
468
background-repeat: no-repeat;
469
background-position: right 3px;
470
background-size: 6px 6px; }
471
.stack-switcher >
472
.button.needs-attention > .label:dir(rtl), .stack-switcher >
473
.button.needs-attention > GtkImage:dir(rtl), .sidebar-item.needs-attention > .label:dir(rtl) {
474
background-position: left 3px; }
475
476
.linked > .entry, .linked >
477
.button, .linked > GtkComboBox > .the-button-in-the-combobox:dir(ltr), .linked > GtkComboBox > .the-button-in-the-combobox:dir(rtl),
478
.linked > GtkComboBoxText > .the-button-in-the-combobox:dir(ltr),
479
.linked > GtkComboBoxText > .the-button-in-the-combobox:dir(rtl) {
480
outline-radius: 2px;
481
border-radius: 0; }
482
483
.linked > .entry:first-child, .linked >
484
.button:first-child, .linked > GtkComboBox:first-child > .the-button-in-the-combobox,
485
.linked > GtkComboBoxText:first-child > .the-button-in-the-combobox {
486
border-top-left-radius: 2px;
487
border-bottom-left-radius: 2px; }
488
.linked > .entry:last-child, .linked >
489
.button:last-child, .linked > GtkComboBox:last-child > .the-button-in-the-combobox,
490
.linked > GtkComboBoxText:last-child > .the-button-in-the-combobox {
491
border-top-right-radius: 2px;
492
border-bottom-right-radius: 2px; }
493
.linked > .entry:only-child, .linked >
494
.button:only-child, .linked > GtkComboBox:only-child > .the-button-in-the-combobox,
495
.linked > GtkComboBoxText:only-child > .the-button-in-the-combobox {
496
border-radius: 2px; }
497
498
.linked.vertical > .entry, .linked.vertical >
499
.button, .linked.vertical > GtkComboBoxText > .the-button-in-the-combobox,
500
.linked.vertical > GtkComboBox > .the-button-in-the-combobox {
501
outline-radius: 2px;
502
border-radius: 0; }
503
504
.linked.vertical > .entry:first-child, .linked.vertical >
505
.button:first-child, .linked.vertical > GtkComboBoxText:first-child > .the-button-in-the-combobox,
506
.linked.vertical > GtkComboBox:first-child > .the-button-in-the-combobox {
507
border-top-left-radius: 2px;
508
border-top-right-radius: 2px; }
509
.linked.vertical > .entry:last-child, .linked.vertical >
510
.button:last-child, .linked.vertical > GtkComboBoxText:last-child > .the-button-in-the-combobox,
511
.linked.vertical > GtkComboBox:last-child > .the-button-in-the-combobox {
512
border-bottom-left-radius: 2px;
513
border-bottom-right-radius: 2px; }
514
.linked.vertical > .entry:only-child, .linked.vertical >
515
.button:only-child, .linked.vertical > GtkComboBoxText:only-child > .the-button-in-the-combobox,
516
.linked.vertical > GtkComboBox:only-child > .the-button-in-the-combobox {
517
border-radius: 2px; }
518
519
/* menu buttons */
520
GtkColorButton.button {
521
padding: 7px 8px 8px; }
522
GtkColorButton.button GtkColorSwatch:first-child:last-child {
523
border-radius: 2px;
524
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
525
526
/*********
527
* Links *
528
*********/
529
*:link, .button:link, .button:visited {
530
color: #42A5F5; }
531
*:link:hover, .button:hover:link, .button:hover:visited, *:link:active, .button:active:link, .button:active:visited {
532
color: #42A5F5; }
533
*:link:visited, .button:visited {
534
color: #E040FB; }
535
*:link:visited:hover, .button:visited:hover, *:link:visited:active, .button:visited:active {
536
color: #E040FB; }
537
*:selected *:link:visited, *:selected .button:visited {
538
color: #b3dbfb; }
539
*:link:selected, .button:selected:link, .button:selected:visited, .titlebar.selection-mode .subtitle:link,
540
.header-bar.selection-mode .subtitle:link, *:selected *:link, *:selected .button:link, *:selected .button:visited {
541
color: #d9edfd; }
542
543
.button:link > .label, .button:visited > .label {
544
text-decoration-line: underline; }
545
546
/*****************
547
* GtkSpinButton *
548
*****************/
549
.spinbutton .button {
550
padding: 4px;
551
border: solid 6px transparent;
552
color: rgba(255, 255, 255, 0.75); }
553
.spinbutton .button:hover, .spinbutton .button:active {
554
color: #FFFFFF; }
555
.spinbutton .button:insensitive {
556
color: rgba(255, 255, 255, 0.3); }
557
.spinbutton .button:active {
558
background-color: alpha(currentColor, 0.3); }
559
.spinbutton.vertical .button {
560
padding-top: 10px;
561
padding-bottom: 10px;
562
border: none; }
563
.spinbutton.vertical .button:first-child {
564
border-radius: 2px 2px 0 0; }
565
.spinbutton.vertical .button:last-child {
566
border-radius: 0 0 2px 2px; }
567
568
/**************
569
* ComboBoxes *
570
**************/
571
GtkComboBox {
572
-GtkComboBox-arrow-scaling: 0.5;
573
-GtkComboBox-shadow-type: none; }
574
GtkComboBox > .the-button-in-the-combobox {
575
padding: 5px 6px 6px; }
576
GtkComboBox .menu {
577
padding: 2px 0; }
578
GtkComboBox .menu .menuitem {
579
padding: 5px 6px 6px; }
580
GtkComboBox .separator.vertical {
581
-GtkWidget-wide-separators: true; }
582
GtkComboBox.combobox-entry .entry:dir(ltr) {
583
border-top-right-radius: 0;
584
border-bottom-right-radius: 0; }
585
GtkComboBox.combobox-entry .entry:dir(rtl) {
586
border-top-left-radius: 0;
587
border-bottom-left-radius: 0; }
588
GtkComboBox.combobox-entry .button {
589
padding: 10px; }
590
GtkComboBox.combobox-entry .button:dir(ltr) {
591
border-top-left-radius: 0;
592
border-bottom-left-radius: 0; }
593
GtkComboBox.combobox-entry .button:dir(rtl) {
594
border-top-right-radius: 0;
595
border-bottom-right-radius: 0; }
596
597
/************
598
* Toolbars *
599
************/
600
.toolbar {
601
-GtkWidget-window-dragging: true;
602
padding: 4px;
603
background-color: #455A64; }
604
.osd .toolbar, .toolbar.osd, .app-notification,
605
.app-notification.frame {
606
transition: border-image 0.2s cubic-bezier(0, 0, 0.2, 1);
607
padding: 6px;
608
border-style: solid;
609
border-width: 8px;
610
border-image: -gtk-scaled(url("assets/osd-shadow-dark.png"), url("assets/osd-shadow-dark@2.png")) 10/10px stretch;
611
border-radius: 2px;
612
background-color: #546E7A; }
613
.osd .toolbar:backdrop, .toolbar.osd:backdrop, .app-notification:backdrop {
614
border-image: -gtk-scaled(url("assets/osd-shadow-backdrop-dark.png"), url("assets/osd-shadow-backdrop-dark@2.png")) 10/10px stretch; }
615
616
.inline-toolbar {
617
padding: 6px;
618
border-style: solid;
619
border-width: 0 1px 1px;
620
border-color: rgba(0, 0, 0, 0.2);
621
background-color: #4d646f; }
622
623
.search-bar, .location-bar {
624
padding: 6px;
625
border-style: solid;
626
border-width: 0 0 1px;
627
border-color: rgba(0, 0, 0, 0.2);
628
background-color: #455A64;
629
background-clip: border-box; }
630
631
/***************
632
* Header bars *
633
***************/
634
.titlebar,
635
.header-bar {
636
transition: background-color 0.2s cubic-bezier(0, 0, 0.2, 1);
637
padding: 6px;
638
border-radius: 2px 2px 0 0;
639
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.1);
640
background-color: #37474F;
641
color: #FFFFFF; }
642
.titlebar:backdrop,
643
.header-bar:backdrop {
644
color: rgba(255, 255, 255, 0.75); }
645
.titlebar .title,
646
.header-bar .title {
647
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
648
padding-left: 12px;
649
padding-right: 12px;
650
font-weight: bold; }
651
.titlebar .subtitle,
652
.header-bar .subtitle {
653
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
654
padding-left: 12px;
655
padding-right: 12px;
656
font-size: smaller; }
657
.titlebar .header-bar-separator, .titlebar > GtkBox > .separator.vertical,
658
.header-bar .header-bar-separator,
659
.header-bar > GtkBox > .separator.vertical {
660
-GtkWidget-wide-separators: true;
661
-GtkWidget-separator-width: 1px;
662
border-style: solid;
663
border-width: 0 1px;
664
border-color: rgba(0, 0, 0, 0.2); }
665
.titlebar .button:not(.suggested-action):not(.destructive-action),
666
.header-bar .button:not(.suggested-action):not(.destructive-action) {
667
border-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.001, to(#42A5F5), to(transparent)) 0 0 0/0 0 0px; }
668
.titlebar .button:not(.suggested-action):not(.destructive-action):checked,
669
.header-bar .button:not(.suggested-action):not(.destructive-action):checked {
670
border-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.5, to(#42A5F5), to(transparent)) 0 0 2/0 0 2px; }
671
.titlebar .button:not(.suggested-action):not(.destructive-action):checked, .titlebar .button:not(.suggested-action):not(.destructive-action):checked:insensitive,
672
.header-bar .button:not(.suggested-action):not(.destructive-action):checked,
673
.header-bar .button:not(.suggested-action):not(.destructive-action):checked:insensitive {
674
background-color: transparent; }
675
.titlebar .button.suggested-action:insensitive, .titlebar .button.destructive-action:insensitive,
676
.header-bar .button.suggested-action:insensitive,
677
.header-bar .button.destructive-action:insensitive {
678
color: alpha(currentColor, 0.4); }
679
.titlebar .button.suggested-action:insensitive > .label, .titlebar .button.destructive-action:insensitive > .label,
680
.header-bar .button.suggested-action:insensitive > .label,
681
.header-bar .button.destructive-action:insensitive > .label {
682
color: inherit; }
683
.titlebar.selection-mode,
684
.header-bar.selection-mode {
685
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);
686
background-color: #42A5F5;
687
color: #FFFFFF; }
688
.titlebar.selection-mode:backdrop,
689
.header-bar.selection-mode:backdrop {
690
color: rgba(255, 255, 255, 0.75); }
691
.titlebar.selection-mode .button,
692
.header-bar.selection-mode .button {
693
border-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.001, to(#FFFFFF), to(transparent)) 0 0 0/0 0 0px;
694
color: rgba(255, 255, 255, 0.75); }
695
.titlebar.selection-mode .button:hover, .titlebar.selection-mode .button:active, .titlebar.selection-mode .button:checked,
696
.header-bar.selection-mode .button:hover,
697
.header-bar.selection-mode .button:active,
698
.header-bar.selection-mode .button:checked {
699
color: #FFFFFF; }
700
.titlebar.selection-mode .button:checked,
701
.header-bar.selection-mode .button:checked {
702
border-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.5, to(#FFFFFF), to(transparent)) 0 0 2/0 0 2px;
703
color: #FFFFFF; }
704
.titlebar.selection-mode .button:checked:insensitive,
705
.header-bar.selection-mode .button:checked:insensitive {
706
color: rgba(255, 255, 255, 0.4); }
707
.titlebar.selection-mode .button:checked:insensitive > .label,
708
.header-bar.selection-mode .button:checked:insensitive > .label {
709
color: inherit; }
710
.titlebar.selection-mode .button.suggested-action,
711
.header-bar.selection-mode .button.suggested-action {
712
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
713
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
714
background-color: #607D8B;
715
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0)), to(transparent)), linear-gradient(to bottom, alpha(currentColor, 0));
716
color: rgba(255, 255, 255, 0.75); }
717
.titlebar.selection-mode .button.suggested-action:hover,
718
.header-bar.selection-mode .button.suggested-action:hover {
719
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
720
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0)), to(transparent)), linear-gradient(to bottom, alpha(currentColor, 0));
721
color: #FFFFFF; }
722
.titlebar.selection-mode .button.suggested-action:active,
723
.header-bar.selection-mode .button.suggested-action:active {
724
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1), background-image 0;
725
animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
726
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23);
727
color: #FFFFFF; }
728
.titlebar.selection-mode .button.suggested-action:insensitive,
729
.header-bar.selection-mode .button.suggested-action:insensitive {
730
box-shadow: none;
731
background-color: alpha(currentColor, 0.3);
732
color: rgba(255, 255, 255, 0.3); }
733
.titlebar.selection-mode .button.suggested-action:insensitive > .label,
734
.header-bar.selection-mode .button.suggested-action:insensitive > .label {
735
color: inherit; }
736
.titlebar.selection-mode .selection-menu,
737
.header-bar.selection-mode .selection-menu {
738
padding-left: 16px;
739
padding-right: 16px; }
740
.titlebar.selection-mode .selection-menu GtkArrow,
741
.header-bar.selection-mode .selection-menu GtkArrow {
742
-GtkArrow-arrow-scaling: 1; }
743
.titlebar.selection-mode .selection-menu .arrow,
744
.header-bar.selection-mode .selection-menu .arrow {
745
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
746
.tiled .titlebar, .maximized .titlebar, .tiled
747
.header-bar, .maximized
748
.header-bar {
749
border-radius: 0;
750
box-shadow: none; }
751
.titlebar.default-decoration,
752
.header-bar.default-decoration {
753
padding: 6px;
754
border-width: 0; }
755
.titlebar.default-decoration .button,
756
.header-bar.default-decoration .button {
757
padding: 4px; }
758
759
/************
760
* Pathbars *
761
************/
762
.path-bar .button {
763
padding: 7px 6px 8px; }
764
.path-bar .button .label:last-child {
765
padding-left: 2px; }
766
.path-bar .button .label:first-child {
767
padding-right: 2px; }
768
.path-bar .button GtkImage {
769
padding-top: 1px; }
770
.path-bar .button GtkImage:only-child {
771
padding-right: 4px;
772
padding-left: 4px; }
773
774
/**************
775
* Tree Views *
776
**************/
777
GtkTreeView.view {
778
-GtkTreeView-grid-line-width: 1;
779
-GtkTreeView-grid-line-pattern: '';
780
-GtkTreeView-tree-line-width: 1;
781
-GtkTreeView-tree-line-pattern: '';
782
-GtkTreeView-expander-size: 16;
783
border-left-color: alpha(currentColor, 0.3);
784
border-top-color: rgba(0, 0, 0, 0.2);
785
border-radius: 0; }
786
GtkTreeView.view:hover, GtkTreeView.view:active, GtkTreeView.view:selected {
787
border-radius: 0; }
788
GtkTreeView.view.dnd {
789
border-style: solid none;
790
border-width: 1px;
791
border-color: #a1d2fa; }
792
GtkTreeView.view.expander {
793
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); }
794
GtkTreeView.view.expander:dir(rtl) {
795
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); }
796
GtkTreeView.view.expander:checked {
797
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
798
GtkTreeView.view.expander:selected {
799
color: rgba(255, 255, 255, 0.75); }
800
GtkTreeView.view.expander:selected:hover, GtkTreeView.view.expander:selected:active {
801
color: #FFFFFF; }
802
GtkTreeView.view.progressbar {
803
border-width: 4px; }
804
GtkTreeView.view.progressbar:selected {
805
border-color: currentColor; }
806
GtkTreeView.view.trough {
807
border-width: 4px;
808
border-color: rgba(66, 165, 245, 0.3); }
809
GtkTreeView.view.trough:selected {
810
border-color: alpha(currentColor, 0.3); }
811
812
column-header .button {
813
padding: 3px 6px 4px;
814
border-style: none solid solid none;
815
border-width: 1px;
816
border-color: rgba(0, 0, 0, 0.2);
817
border-radius: 0;
818
box-shadow: none;
819
background-color: #546E7A; }
820
column-header .button:hover, column-header .button:active {
821
box-shadow: none; }
822
column-header .button:insensitive {
823
background-color: #546E7A; }
824
column-header:last-child .button, column-header:last-child.button {
825
border-right-style: none; }
826
827
column-header.button.dnd, column-header .button.dnd {
828
border-left-style: solid;
829
background-clip: border-box;
830
color: #42A5F5; }
831
832
/*********
833
* Menus *
834
*********/
835
.menubar {
836
-GtkWidget-window-dragging: true;
837
padding: 0;
838
background-color: #37474F; }
839
.menubar > .menuitem {
840
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
841
padding: 4px 8px;
842
color: rgba(255, 255, 255, 0.75); }
843
.menubar > .menuitem:hover {
844
transition: none;
845
background-color: alpha(currentColor, 0.15);
846
color: #FFFFFF; }
847
.menubar > .menuitem:insensitive {
848
color: rgba(255, 255, 255, 0.3);
849
box-shadow: none; }
850
851
.menu {
852
margin: 4px 0;
853
padding: 4px 0;
854
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
855
background-color: #546E7A;
856
border: 1px solid rgba(0, 0, 0, 0.2); }
857
.csd .menu {
858
border: none;
859
border-radius: 2px; }
860
.menu .menuitem {
861
transition: all 0.2s cubic-bezier(0, 0, 0.2, 1);
862
padding: 3px 4px 4px;
863
font: initial;
864
text-shadow: none; }
865
.menu .menuitem:hover {
866
transition: none;
867
background-color: alpha(currentColor, 0.15); }
868
.menu .menuitem:insensitive {
869
color: rgba(255, 255, 255, 0.4); }
870
.menu .menuitem.arrow {
871
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); }
872
.menu .menuitem.arrow:dir(rtl) {
873
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); }
874
.menu.button {
875
border-style: none;
876
border-radius: 0;
877
box-shadow: none; }
878
.menu.button.top {
879
border-bottom: 1px solid rgba(0, 0, 0, 0.2); }
880
.menu.button.bottom {
881
border-top: 1px solid rgba(0, 0, 0, 0.2); }
882
.menu.button:hover {
883
background-color: alpha(currentColor, 0.15); }
884
.menu.button:insensitive {
885
background-color: transparent;
886
border-color: transparent; }
887
888
.menuitem .accelerator {
889
color: alpha(currentColor, 0.6); }
890
891
.csd.popup {
892
border-radius: 2px; }
893
894
/***************
895
* Popovers *
896
***************/
897
.popover {
898
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
899
padding: 2px;
900
border: 1px solid;
901
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3);
902
border-radius: 3px;
903
background-color: #607D8B;
904
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
905
.popover:backdrop {
906
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
907
.popover > .list,
908
.popover > .view,
909
.popover > .toolbar, .popover.osd > .toolbar {
910
border-style: none;
911
border-image: none;
912
background-color: transparent; }
913
.popover .button.flat {
914
padding: 5px 8px 6px;
915
background-color: transparent;
916
background-size: 160px 160px, auto;
917
color: #FFFFFF;
918
font: initial; }
919
.popover .linked > .button {
920
border-radius: 2px; }
921
.popover .linked > .button:checked {
922
background-color: #42A5F5;
923
color: #FFFFFF; }
924
.popover .linked > .button.image-button {
925
padding: 8px;
926
background-size: 90px 90px, auto; }
927
928
/*****************
929
* Notebooks and *
930
* Tabs *
931
*****************/
932
.notebook {
933
padding: 0;
934
background-color: #546E7A;
935
-GtkNotebook-initial-gap: 8;
936
-GtkNotebook-arrow-spacing: 5;
937
-GtkNotebook-tab-curvature: 0;
938
-GtkNotebook-tab-overlap: 1;
939
-GtkNotebook-has-tab-gap: false;
940
-GtkWidget-focus-padding: 0;
941
-GtkWidget-focus-line-width: 0; }
942
.notebook.frame {
943
border: 1px solid rgba(0, 0, 0, 0.2); }
944
.notebook.frame.top {
945
border-top-width: 0; }
946
.notebook.frame.bottom {
947
border-bottom-width: 0; }
948
.notebook.frame.right {
949
border-right-width: 0; }
950
.notebook.frame.left {
951
border-left-width: 0; }
952
.notebook.header {
953
background-color: #455A64; }
954
.notebook.header.frame {
955
border: 1px solid rgba(0, 0, 0, 0.2); }
956
.notebook.header.frame.top {
957
border-bottom-width: 0; }
958
.notebook.header.frame.bottom {
959
border-top-width: 0; }
960
.notebook.header.frame.right {
961
border-left-width: 0; }
962
.notebook.header.frame.left {
963
border-right-width: 0; }
964
.notebook.header.top {
965
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.2); }
966
.notebook.header.bottom {
967
box-shadow: inset 0 1px rgba(0, 0, 0, 0.2); }
968
.notebook.header.right {
969
box-shadow: inset 1px 0 rgba(0, 0, 0, 0.2); }
970
.notebook.header.left {
971
box-shadow: inset -1px 0 rgba(0, 0, 0, 0.2); }
972
.notebook tab {
973
border-width: 0;
974
border-style: solid;
975
border-color: transparent;
976
background-color: transparent;
977
outline-offset: 0;
978
/* works for testnotebookdnd, but there's a superfluous border
979
in gedit or web, commented out for now, needs gtk fixes
980
&.reorderable-page {
981
&.top {
982
padding-top: ($vt_vpadding - 1px);
983
border-top-width: 1px;
984
border-left-width: 1px;
985
border-right-width: 1px;
986
}
987
&.bottom {
988
padding-bottom: ($vt_vpadding - 1px);
989
border-bottom-width: 1px;
990
border-left-width: 1px;
991
border-right-width: 1px;
992
}
993
&.left {
994
padding-left: ($ht_hpadding - 1px);
995
border-left-width: 1px;
996
border-top-width: 1px;
997
border-bottom-width: 1px;
998
}
999
&.right {
1000
padding-right: ($ht_hpadding - 1px);
1001
border-right-width: 1px;
1002
border-top-width: 1px;
1003
border-bottom-width: 1px;
1004
}
1005
}
1006
*/ }
1007
.notebook tab.top, .notebook tab.bottom {
1008
padding: 8px 12px; }
1009
.notebook tab.left, .notebook tab.right {
1010
padding: 8px 12px; }
1011
.notebook tab.reorderable-page {
1012
-GtkNotebook-tab-overlap: 1; }
1013
.notebook tab.reorderable-page.top, .notebook tab.reorderable-page.bottom {
1014
padding-left: 12px;
1015
padding-right: 12px;
1016
border-left-width: 1px;
1017
border-right-width: 1px; }
1018
.notebook tab.reorderable-page.left, .notebook tab.reorderable-page.right {
1019
border-bottom-width: 1px;
1020
border-top-width: 1px; }
1021
.notebook tab.top:hover, .notebook tab.top.prelight-page {
1022
box-shadow: inset 0 -2px alpha(currentColor, 0.3); }
1023
.notebook tab.top:active, .notebook tab.top.active-page {
1024
box-shadow: inset 0 -2px #42A5F5; }
1025
.notebook tab.bottom:hover, .notebook tab.bottom.prelight-page {
1026
box-shadow: inset 0 2px alpha(currentColor, 0.3); }
1027
.notebook tab.bottom:active, .notebook tab.bottom.active-page {
1028
box-shadow: inset 0 2px #42A5F5; }
1029
.notebook tab.left:hover, .notebook tab.left.prelight-page {
1030
box-shadow: inset -2px 0 alpha(currentColor, 0.3); }
1031
.notebook tab.left:active, .notebook tab.left.active-page {
1032
box-shadow: inset -2px 0 #42A5F5; }
1033
.notebook tab.right:hover, .notebook tab.right.prelight-page {
1034
box-shadow: inset 2px 0 alpha(currentColor, 0.3); }
1035
.notebook tab.right:active, .notebook tab.right.active-page {
1036
box-shadow: inset 2px 0 #42A5F5; }
1037
.notebook tab.reorderable-page.top {
1038
border-color: transparent; }
1039
.notebook tab.reorderable-page.top:hover, .notebook tab.reorderable-page.top.prelight-page {
1040
border-color: rgba(0, 0, 0, 0.2);
1041
border-bottom-width: 0;
1042
border-bottom-color: transparent;
1043
background-color: #4d646f; }
1044
.notebook tab.reorderable-page.top:active, .notebook tab.reorderable-page.top.active-page {
1045
border-color: rgba(0, 0, 0, 0.2);
1046
border-bottom-width: 0;
1047
border-bottom-color: transparent;
1048
background-color: #546E7A; }
1049
.notebook tab.reorderable-page.bottom {
1050
border-color: transparent; }
1051
.notebook tab.reorderable-page.bottom:hover, .notebook tab.reorderable-page.bottom.prelight-page {
1052
border-color: rgba(0, 0, 0, 0.2);
1053
border-top-width: 0;
1054
border-top-color: transparent;
1055
background-color: #4d646f; }
1056
.notebook tab.reorderable-page.bottom:active, .notebook tab.reorderable-page.bottom.active-page {
1057
border-color: rgba(0, 0, 0, 0.2);
1058
border-top-width: 0;
1059
border-top-color: transparent;
1060
background-color: #546E7A; }
1061
.notebook tab.reorderable-page.left {
1062
border-color: transparent; }
1063
.notebook tab.reorderable-page.left:hover, .notebook tab.reorderable-page.left.prelight-page {
1064
border-color: rgba(0, 0, 0, 0.2);
1065
border-right-width: 0;
1066
border-right-color: transparent;
1067
background-color: #4d646f; }
1068
.notebook tab.reorderable-page.left:active, .notebook tab.reorderable-page.left.active-page {
1069
border-color: rgba(0, 0, 0, 0.2);
1070
border-right-width: 0;
1071
border-right-color: transparent;
1072
background-color: #546E7A; }
1073
.notebook tab.reorderable-page.right {
1074
border-color: transparent; }
1075
.notebook tab.reorderable-page.right:hover, .notebook tab.reorderable-page.right.prelight-page {
1076
border-color: rgba(0, 0, 0, 0.2);
1077
border-left-width: 0;
1078
border-left-color: transparent;
1079
background-color: #4d646f; }
1080
.notebook tab.reorderable-page.right:active, .notebook tab.reorderable-page.right.active-page {
1081
border-color: rgba(0, 0, 0, 0.2);
1082
border-left-width: 0;
1083
border-left-color: transparent;
1084
background-color: #546E7A; }
1085
.notebook tab .label {
1086
padding: 0 2px;
1087
font-weight: 500;
1088
color: rgba(255, 255, 255, 0.75); }
1089
.notebook tab .prelight-page .label, .notebook tab .label.prelight-page {
1090
color: #FFFFFF; }
1091
.notebook tab .active-page .label, .notebook tab .label.active-page {
1092
color: #FFFFFF; }
1093
.notebook tab .button {
1094
padding: 0;
1095
background-size: 30px 30px, auto; }
1096
.notebook tab .button > GtkImage {
1097
padding: 4px; }
1098
.notebook.arrow:not(:hover):not(:active) {
1099
color: alpha(currentColor, 0.75); }
1100
.notebook.arrow:insensitive {
1101
color: rgba(255, 255, 255, 0.4); }
1102
1103
/**************
1104
* Scrollbars *
1105
**************/
1106
.scrollbar {
1107
-GtkRange-slider-width: 17px;
1108
-GtkRange-trough-border: 0;
1109
-GtkScrollbar-has-backward-stepper: false;
1110
-GtkScrollbar-has-forward-stepper: false;
1111
-GtkScrollbar-min-slider-length: 32px;
1112
-GtkRange-stepper-spacing: 0;
1113
-GtkRange-trough-under-steppers: 1; }
1114
.scrollbar .button {
1115
border: none; }
1116
.scrollbar.overlay-indicator:not(.dragging):not(.hovering) {
1117
-GtkRange-slider-width: 12px; }
1118
.scrollbar.overlay-indicator:not(.dragging):not(.hovering) .slider {
1119
margin: 3px;
1120
border: 1px solid rgba(84, 110, 122, 0.3); }
1121
.scrollbar.overlay-indicator:not(.dragging):not(.hovering) .trough {
1122
border-style: none;
1123
background-color: transparent; }
1124
.scrollbar.overlay-indicator.dragging .trough, .scrollbar.overlay-indicator.hovering .trough {
1125
background-color: rgba(84, 110, 122, 0.9); }
1126
.scrollbar .trough {
1127
border: 1px none rgba(0, 0, 0, 0.2);
1128
background-color: #546E7A;
1129
background-clip: border-box; }
1130
.scrollbar .slider {
1131
background-color: rgba(255, 255, 255, 0.6); }
1132
.scrollbar .slider:hover {
1133
background-color: rgba(255, 255, 255, 0.75); }
1134
.scrollbar .slider:active {
1135
background-color: #FFFFFF; }
1136
.scrollbar .slider:insensitive {
1137
opacity: 0.4; }
1138
.scrollbar .slider {
1139
border-radius: 100px;
1140
margin: 4px; }
1141
.scrollbar.fine-tune .slider {
1142
margin: 6px; }
1143
.scrollbar.vertical .slider {
1144
margin-left: 5px; }
1145
.scrollbar.vertical .slider:dir(rtl) {
1146
margin-left: 4px;
1147
margin-right: 5px; }
1148
.scrollbar.vertical.fine-tune .slider {
1149
margin-left: 7px; }
1150
.scrollbar.vertical.fine-tune .slider:dir(rtl) {
1151
margin-left: 6px;
1152
margin-right: 7px; }
1153
.scrollbar.vertical .trough {
1154
border-left-style: solid; }
1155
.scrollbar.vertical .trough:dir(rtl) {
1156
border-left-style: none;
1157
border-right-style: solid; }
1158
.scrollbar.horizontal .slider {
1159
margin-top: 5px; }
1160
.scrollbar.horizontal.fine-tune .slider {
1161
margin-top: 7px; }
1162
.scrollbar.horizontal .trough {
1163
border-top-style: solid; }
1164
1165
.scrollbars-junction,
1166
.scrollbars-junction.frame {
1167
border-style: solid none none solid;
1168
background-color: #546E7A; }
1169
.scrollbars-junction:dir(rtl),
1170
.scrollbars-junction.frame:dir(rtl) {
1171
border-style: solid solid none none; }
1172
1173
/**********
1174
* Switch *
1175
**********/
1176
GtkSwitch {
1177
-GtkSwitch-slider-width: 24px;
1178
-GtkSwitch-slider-height: 24px;
1179
outline-offset: -4px;
1180
outline-radius: 100px;
1181
font-size: 0; }
1182
GtkSwitch.trough {
1183
border: 8px solid transparent;
1184
border-radius: 100px;
1185
background-color: alpha(currentColor, 0.3); }
1186
GtkSwitch.trough:insensitive {
1187
color: alpha(currentColor, 0.4); }
1188
GtkSwitch.trough:active {
1189
background-color: rgba(255, 64, 129, 0.5); }
1190
GtkSwitch.trough:active:insensitive {
1191
background-color: rgba(255, 64, 129, 0.2); }
1192
GtkSwitch.slider {
1193
padding: 4px;
1194
border-radius: 100px;
1195
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1196
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1197
background-color: #546E7A;
1198
color: #FFFFFF; }
1199
GtkSwitch.slider:hover {
1200
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1201
GtkSwitch.slider:active {
1202
background-color: #FF4081; }
1203
GtkSwitch.slider:insensitive {
1204
color: rgba(255, 255, 255, 0.4);
1205
background-color: #4d646f; }
1206
1207
/*************************
1208
* Check and Radio items *
1209
*************************/
1210
.check {
1211
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-unchecked-dark.png"), url("assets/checkbox-unchecked-dark@2.png"));
1212
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1213
.check:hover, .check:active {
1214
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1215
.check:insensitive {
1216
icon-shadow: none; }
1217
1218
.check:active {
1219
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-unchecked-active-dark.png"), url("assets/checkbox-unchecked-active-dark@2.png"));
1220
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1221
.check:active:hover, .check:active:active {
1222
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1223
.check:active:insensitive {
1224
icon-shadow: none; }
1225
1226
.check:insensitive {
1227
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-unchecked-insensitive-dark.png"), url("assets/checkbox-unchecked-insensitive-dark@2.png"));
1228
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1229
.check:insensitive:hover, .check:insensitive:active {
1230
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1231
.check:insensitive:insensitive {
1232
icon-shadow: none; }
1233
1234
.check:inconsistent {
1235
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-mixed-dark.png"), url("assets/checkbox-mixed-dark@2.png"));
1236
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1237
.check:inconsistent:hover, .check:inconsistent:active {
1238
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1239
.check:inconsistent:insensitive {
1240
icon-shadow: none; }
1241
1242
.check:inconsistent:active {
1243
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-mixed-active-dark.png"), url("assets/checkbox-mixed-active-dark@2.png"));
1244
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1245
.check:inconsistent:active:hover, .check:inconsistent:active:active {
1246
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1247
.check:inconsistent:active:insensitive {
1248
icon-shadow: none; }
1249
1250
.check:inconsistent:insensitive {
1251
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-mixed-insensitive-dark.png"), url("assets/checkbox-mixed-insensitive-dark@2.png"));
1252
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1253
.check:inconsistent:insensitive:hover, .check:inconsistent:insensitive:active {
1254
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1255
.check:inconsistent:insensitive:insensitive {
1256
icon-shadow: none; }
1257
1258
.check:checked {
1259
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-dark.png"), url("assets/checkbox-checked-dark@2.png"));
1260
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1261
.check:checked:hover, .check:checked:active {
1262
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1263
.check:checked:insensitive {
1264
icon-shadow: none; }
1265
1266
.check:checked:active {
1267
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-active-dark.png"), url("assets/checkbox-checked-active-dark@2.png"));
1268
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1269
.check:checked:active:hover, .check:checked:active:active {
1270
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1271
.check:checked:active:insensitive {
1272
icon-shadow: none; }
1273
1274
.check:checked:insensitive {
1275
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-insensitive-dark.png"), url("assets/checkbox-checked-insensitive-dark@2.png"));
1276
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1277
.check:checked:insensitive:hover, .check:checked:insensitive:active {
1278
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1279
.check:checked:insensitive:insensitive {
1280
icon-shadow: none; }
1281
1282
.menu .menuitem.check {
1283
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-symbolic-dark.png"), url("assets/checkbox-symbolic-dark@2.png"));
1284
icon-shadow: none; }
1285
1286
.menu .menuitem.check:insensitive {
1287
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-insensitive-symbolic-dark.png"), url("assets/checkbox-insensitive-symbolic-dark@2.png"));
1288
icon-shadow: none; }
1289
1290
.menu .menuitem.check:inconsistent {
1291
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-mixed-symbolic-dark.png"), url("assets/checkbox-mixed-symbolic-dark@2.png"));
1292
icon-shadow: none; }
1293
1294
.menu .menuitem.check:inconsistent:insensitive {
1295
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-mixed-insensitive-symbolic-dark.png"), url("assets/checkbox-mixed-insensitive-symbolic-dark@2.png"));
1296
icon-shadow: none; }
1297
1298
.menu .menuitem.check:checked {
1299
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-symbolic-dark.png"), url("assets/checkbox-checked-symbolic-dark@2.png"));
1300
icon-shadow: none; }
1301
1302
.menu .menuitem.check:checked:insensitive {
1303
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-insensitive-symbolic-dark.png"), url("assets/checkbox-checked-insensitive-symbolic-dark@2.png"));
1304
icon-shadow: none; }
1305
1306
.radio {
1307
-gtk-icon-source: -gtk-scaled(url("assets/radio-unchecked-dark.png"), url("assets/radio-unchecked-dark@2.png"));
1308
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1309
.radio:hover, .radio:active {
1310
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1311
.radio:insensitive {
1312
icon-shadow: none; }
1313
1314
.radio:active {
1315
-gtk-icon-source: -gtk-scaled(url("assets/radio-unchecked-active-dark.png"), url("assets/radio-unchecked-active-dark@2.png"));
1316
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1317
.radio:active:hover, .radio:active:active {
1318
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1319
.radio:active:insensitive {
1320
icon-shadow: none; }
1321
1322
.radio:insensitive {
1323
-gtk-icon-source: -gtk-scaled(url("assets/radio-unchecked-insensitive-dark.png"), url("assets/radio-unchecked-insensitive-dark@2.png"));
1324
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1325
.radio:insensitive:hover, .radio:insensitive:active {
1326
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1327
.radio:insensitive:insensitive {
1328
icon-shadow: none; }
1329
1330
.radio:inconsistent {
1331
-gtk-icon-source: -gtk-scaled(url("assets/radio-mixed-dark.png"), url("assets/radio-mixed-dark@2.png"));
1332
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1333
.radio:inconsistent:hover, .radio:inconsistent:active {
1334
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1335
.radio:inconsistent:insensitive {
1336
icon-shadow: none; }
1337
1338
.radio:inconsistent:active {
1339
-gtk-icon-source: -gtk-scaled(url("assets/radio-mixed-active-dark.png"), url("assets/radio-mixed-active-dark@2.png"));
1340
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1341
.radio:inconsistent:active:hover, .radio:inconsistent:active:active {
1342
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1343
.radio:inconsistent:active:insensitive {
1344
icon-shadow: none; }
1345
1346
.radio:inconsistent:insensitive {
1347
-gtk-icon-source: -gtk-scaled(url("assets/radio-mixed-insensitive-dark.png"), url("assets/radio-mixed-insensitive-dark@2.png"));
1348
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1349
.radio:inconsistent:insensitive:hover, .radio:inconsistent:insensitive:active {
1350
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1351
.radio:inconsistent:insensitive:insensitive {
1352
icon-shadow: none; }
1353
1354
.radio:checked {
1355
-gtk-icon-source: -gtk-scaled(url("assets/radio-checked-dark.png"), url("assets/radio-checked-dark@2.png"));
1356
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1357
.radio:checked:hover, .radio:checked:active {
1358
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1359
.radio:checked:insensitive {
1360
icon-shadow: none; }
1361
1362
.radio:checked:active {
1363
-gtk-icon-source: -gtk-scaled(url("assets/radio-checked-active-dark.png"), url("assets/radio-checked-active-dark@2.png"));
1364
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1365
.radio:checked:active:hover, .radio:checked:active:active {
1366
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1367
.radio:checked:active:insensitive {
1368
icon-shadow: none; }
1369
1370
.radio:checked:insensitive {
1371
-gtk-icon-source: -gtk-scaled(url("assets/radio-checked-insensitive-dark.png"), url("assets/radio-checked-insensitive-dark@2.png"));
1372
icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1373
.radio:checked:insensitive:hover, .radio:checked:insensitive:active {
1374
icon-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1375
.radio:checked:insensitive:insensitive {
1376
icon-shadow: none; }
1377
1378
.menu .menuitem.radio {
1379
-gtk-icon-source: -gtk-scaled(url("assets/radio-symbolic-dark.png"), url("assets/radio-symbolic-dark@2.png"));
1380
icon-shadow: none; }
1381
1382
.menu .menuitem.radio:insensitive {
1383
-gtk-icon-source: -gtk-scaled(url("assets/radio-insensitive-symbolic-dark.png"), url("assets/radio-insensitive-symbolic-dark@2.png"));
1384
icon-shadow: none; }
1385
1386
.menu .menuitem.radio:inconsistent {
1387
-gtk-icon-source: -gtk-scaled(url("assets/radio-mixed-symbolic-dark.png"), url("assets/radio-mixed-symbolic-dark@2.png"));
1388
icon-shadow: none; }
1389
1390
.menu .menuitem.radio:inconsistent:insensitive {
1391
-gtk-icon-source: -gtk-scaled(url("assets/radio-mixed-insensitive-symbolic-dark.png"), url("assets/radio-mixed-insensitive-symbolic-dark@2.png"));
1392
icon-shadow: none; }
1393
1394
.menu .menuitem.radio:checked {
1395
-gtk-icon-source: -gtk-scaled(url("assets/radio-checked-symbolic-dark.png"), url("assets/radio-checked-symbolic-dark@2.png"));
1396
icon-shadow: none; }
1397
1398
.menu .menuitem.radio:checked:insensitive {
1399
-gtk-icon-source: -gtk-scaled(url("assets/radio-checked-insensitive-symbolic-dark.png"), url("assets/radio-checked-insensitive-symbolic-dark@2.png"));
1400
icon-shadow: none; }
1401
1402
.view.content-view.check:not(.list) {
1403
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-selectionmode.png"), url("assets/checkbox-selectionmode@2.png"));
1404
background-color: transparent; }
1405
1406
.view.content-view.check:active:not(.list) {
1407
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-active-selectionmode.png"), url("assets/checkbox-active-selectionmode@2.png"));
1408
background-color: transparent; }
1409
1410
.view.content-view.check:insensitive:not(.list) {
1411
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-insensitive-selectionmode.png"), url("assets/checkbox-insensitive-selectionmode@2.png"));
1412
background-color: transparent; }
1413
1414
.view.content-view.check:checked:not(.list) {
1415
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-selectionmode.png"), url("assets/checkbox-checked-selectionmode@2.png"));
1416
background-color: transparent; }
1417
1418
.view.content-view.check:checked:active:not(.list) {
1419
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-active-selectionmode.png"), url("assets/checkbox-checked-active-selectionmode@2.png"));
1420
background-color: transparent; }
1421
1422
.view.content-view.check:insensitive:checked:not(.list) {
1423
-gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-insensitive-selectionmode.png"), url("assets/checkbox-checked-insensitive-selectionmode@2.png"));
1424
background-color: transparent; }
1425
1426
GtkCheckButton.text-button, GtkRadioButton.text-button {
1427
padding: 2px 4px;
1428
outline-offset: 0; }
1429
1430
/************
1431
* GtkScale *
1432
************/
1433
.scale,
1434
.scale.scale-has-marks-above.scale-has-marks-below,
1435
.scale.vertical.scale-has-marks-above.scale-has-marks-below {
1436
-GtkScale-slider-length: 20;
1437
-GtkRange-slider-width: 20;
1438
-GtkRange-trough-border: 2;
1439
outline-offset: -8px;
1440
outline-radius: 100px; }
1441
.scale.fine-tune.slider,
1442
.scale.scale-has-marks-above.scale-has-marks-below.fine-tune.slider,
1443
.scale.vertical.scale-has-marks-above.scale-has-marks-below.fine-tune.slider {
1444
background-size: 80%; }
1445
.scale.slider:not(:hover):not(:active),
1446
.scale.scale-has-marks-above.scale-has-marks-below.slider:not(:hover):not(:active),
1447
.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider:not(:hover):not(:active) {
1448
background-size: 80%; }
1449
.scale.slider.slider,
1450
.scale.scale-has-marks-above.scale-has-marks-below.slider.slider,
1451
.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider.slider {
1452
border-style: none;
1453
border-radius: 0;
1454
background-color: transparent;
1455
background-image: -gtk-scaled(url("assets/slider-dark.png"), url("assets/slider-dark@2.png"));
1456
background-repeat: no-repeat;
1457
background-position: center;
1458
box-shadow: none; }
1459
.scale.slider.slider:insensitive,
1460
.scale.scale-has-marks-above.scale-has-marks-below.slider.slider:insensitive,
1461
.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider.slider:insensitive {
1462
border-style: none;
1463
border-radius: 0;
1464
background-color: transparent;
1465
background-image: -gtk-scaled(url("assets/slider-insensitive-dark.png"), url("assets/slider-insensitive-dark@2.png"));
1466
background-repeat: no-repeat;
1467
background-position: center;
1468
box-shadow: none; }
1469
.scale.trough,
1470
.scale.scale-has-marks-above.scale-has-marks-below.trough,
1471
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough {
1472
margin: 10px 12px;
1473
background-color: alpha(currentColor, 0.3); }
1474
.scale.trough.highlight,
1475
.scale.scale-has-marks-above.scale-has-marks-below.trough.highlight,
1476
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough.highlight {
1477
background-color: #FF4081; }
1478
.scale.trough.highlight:insensitive,
1479
.scale.scale-has-marks-above.scale-has-marks-below.trough.highlight:insensitive,
1480
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough.highlight:insensitive {
1481
background-color: alpha(currentColor, 0.3); }
1482
.scale.trough:insensitive,
1483
.scale.scale-has-marks-above.scale-has-marks-below.trough:insensitive,
1484
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough:insensitive {
1485
color: rgba(255, 255, 255, 0.4); }
1486
.scale.trough.vertical,
1487
.scale.scale-has-marks-above.scale-has-marks-below.trough.vertical,
1488
.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough.vertical {
1489
margin: 12px 10px; }
1490
.scale.separator,
1491
.scale.scale-has-marks-above.scale-has-marks-below.separator,
1492
.scale.vertical.scale-has-marks-above.scale-has-marks-below.separator {
1493
color: alpha(currentColor, 0.3); }
1494
1495
.scale.scale-has-marks-below {
1496
-GtkScale-slider-length: 20;
1497
-GtkRange-slider-width: 25;
1498
-GtkRange-trough-border: 2; }
1499
.scale.scale-has-marks-below.slider {
1500
border-style: none;
1501
border-radius: 0;
1502
background-color: transparent;
1503
background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below-dark.png"), url("assets/slider-horz-scale-has-marks-below-dark@2.png"));
1504
background-repeat: no-repeat;
1505
background-position: center;
1506
box-shadow: none; }
1507
.scale.scale-has-marks-below.slider:insensitive {
1508
border-style: none;
1509
border-radius: 0;
1510
background-color: transparent;
1511
background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below-insensitive-dark.png"), url("assets/slider-horz-scale-has-marks-below-insensitive-dark@2.png"));
1512
background-repeat: no-repeat;
1513
background-position: center;
1514
box-shadow: none; }
1515
1516
.scale.scale-has-marks-above {
1517
-GtkScale-slider-length: 20;
1518
-GtkRange-slider-width: 25;
1519
-GtkRange-trough-border: 2; }
1520
.scale.scale-has-marks-above.slider {
1521
border-style: none;
1522
border-radius: 0;
1523
background-color: transparent;
1524
background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-dark.png"), url("assets/slider-horz-scale-has-marks-above-dark@2.png"));
1525
background-repeat: no-repeat;
1526
background-position: center;
1527
box-shadow: none; }
1528
.scale.scale-has-marks-above.slider:insensitive {
1529
border-style: none;
1530
border-radius: 0;
1531
background-color: transparent;
1532
background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-insensitive-dark.png"), url("assets/slider-horz-scale-has-marks-above-insensitive-dark@2.png"));
1533
background-repeat: no-repeat;
1534
background-position: center;
1535
box-shadow: none; }
1536
1537
.scale.vertical.scale-has-marks-below {
1538
-GtkScale-slider-length: 20;
1539
-GtkRange-slider-width: 25;
1540
-GtkRange-trough-border: 2; }
1541
.scale.vertical.scale-has-marks-below.slider {
1542
border-style: none;
1543
border-radius: 0;
1544
background-color: transparent;
1545
background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below-dark.png"), url("assets/slider-vert-scale-has-marks-below-dark@2.png"));
1546
background-repeat: no-repeat;
1547
background-position: center;
1548
box-shadow: none; }
1549
.scale.vertical.scale-has-marks-below.slider:insensitive {
1550
border-style: none;
1551
border-radius: 0;
1552
background-color: transparent;
1553
background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below-insensitive-dark.png"), url("assets/slider-vert-scale-has-marks-below-insensitive-dark@2.png"));
1554
background-repeat: no-repeat;
1555
background-position: center;
1556
box-shadow: none; }
1557
1558
.scale.vertical.scale-has-marks-above {
1559
-GtkScale-slider-length: 20;
1560
-GtkRange-slider-width: 25;
1561
-GtkRange-trough-border: 2; }
1562
.scale.vertical.scale-has-marks-above.slider {
1563
border-style: none;
1564
border-radius: 0;
1565
background-color: transparent;
1566
background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above-dark.png"), url("assets/slider-vert-scale-has-marks-above-dark@2.png"));
1567
background-repeat: no-repeat;
1568
background-position: center;
1569
box-shadow: none; }
1570
.scale.vertical.scale-has-marks-above.slider:insensitive {
1571
border-style: none;
1572
border-radius: 0;
1573
background-color: transparent;
1574
background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above-insensitive-dark.png"), url("assets/slider-vert-scale-has-marks-above-insensitive-dark@2.png"));
1575
background-repeat: no-repeat;
1576
background-position: center;
1577
box-shadow: none; }
1578
1579
.scale.scale-has-marks-above .trough {
1580
margin: 15px 12px 10px; }
1581
1582
.scale.scale-has-marks-below .trough {
1583
margin: 10px 12px 15px; }
1584
1585
.scale.vertical.scale-has-marks-above .trough {
1586
margin: 12px 10px 12px 15px; }
1587
1588
.scale.vertical.scale-has-marks-below .trough {
1589
margin: 12px 15px 12px 10px; }
1590
1591
/*****************
1592
* Progress bars *
1593
*****************/
1594
GtkProgressBar {
1595
-GtkProgressBar-min-horizontal-bar-height: 4;
1596
-GtkProgressBar-min-vertical-bar-width: 4;
1597
padding: 0;
1598
font-size: smaller;
1599
color: rgba(255, 255, 255, 0.6); }
1600
GtkProgressBar.osd {
1601
-GtkProgressBar-xspacing: 0;
1602
-GtkProgressBar-yspacing: 0;
1603
-GtkProgressBar-min-horizontal-bar-height: 4; }
1604
GtkProgressBar.trough {
1605
border-radius: 0;
1606
background-color: rgba(66, 165, 245, 0.3); }
1607
GtkProgressBar.trough.osd {
1608
border-style: none;
1609
box-shadow: none; }
1610
1611
.progressbar {
1612
border-radius: 0;
1613
background-color: #42A5F5; }
1614
.progressbar.left {
1615
border-top-left-radius: 0;
1616
border-bottom-left-radius: 0; }
1617
.progressbar.right {
1618
border-top-right-radius: 0;
1619
border-bottom-right-radius: 0; }
1620
.progressbar.left.right {
1621
box-shadow: none; }
1622
.progressbar.vertical.bottom {
1623
border-bottom-left-radius: 0;
1624
border-bottom-right-radius: 0;
1625
box-shadow: none; }
1626
.progressbar.vertical.top {
1627
border-top-left-radius: 0;
1628
border-top-right-radius: 0; }
1629
.progressbar.osd {
1630
background-image: none;
1631
background-color: #42A5F5;
1632
border-style: none;
1633
border-radius: 0; }
1634
1635
/*************
1636
* Level Bar *
1637
*************/
1638
.level-bar {
1639
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1640
color: rgba(255, 255, 255, 0.4);
1641
-GtkLevelBar-min-block-width: 36;
1642
-GtkLevelBar-min-block-height: 4; }
1643
.level-bar.vertical {
1644
-GtkLevelBar-min-block-width: 4;
1645
-GtkLevelBar-min-block-height: 36; }
1646
.level-bar.trough {
1647
padding: 2px;
1648
border-radius: 2px;
1649
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1650
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1651
background-color: #546E7A;
1652
color: #FFFFFF; }
1653
.level-bar.trough:insensitive {
1654
color: rgba(255, 255, 255, 0.4);
1655
background-color: #4d646f; }
1656
.level-bar.trough.indicator-discrete.horizontal {
1657
padding: 2px 1px; }
1658
.level-bar.trough.indicator-discrete.vertical {
1659
padding: 1px 2px; }
1660
.level-bar.fill-block {
1661
background-color: #42A5F5;
1662
border-radius: 0;
1663
box-shadow: none; }
1664
.level-bar.fill-block.indicator-discrete.horizontal {
1665
margin: 0 1px; }
1666
.level-bar.fill-block.indicator-discrete.vertical {
1667
margin: 1px 0; }
1668
.level-bar.fill-block.level-high {
1669
background-color: #00C853; }
1670
.level-bar.fill-block.level-low {
1671
background-color: #FF6D00; }
1672
.level-bar.fill-block.empty-fill-block {
1673
background-color: alpha(currentColor, 0.3); }
1674
1675
/**********
1676
* Frames *
1677
**********/
1678
.frame {
1679
border: 1px solid rgba(0, 0, 0, 0.2);
1680
padding: 0; }
1681
.frame.flat {
1682
border-style: none; }
1683
.frame.action-bar {
1684
padding: 6px;
1685
border-width: 1px 0 0; }
1686
1687
GtkScrolledWindow GtkViewport.frame {
1688
border-style: none; }
1689
1690
.separator {
1691
color: rgba(0, 0, 0, 0.2); }
1692
GtkFileChooserButton .separator.vertical, GtkFontButton .separator.vertical {
1693
-GtkWidget-wide-separators: true; }
1694
1695
/*********
1696
* Lists *
1697
*********/
1698
.list {
1699
border-color: rgba(0, 0, 0, 0.2);
1700
background-color: #546E7A; }
1701
1702
.list-row,
1703
.grid-child {
1704
padding: 2px; }
1705
1706
.list-row.activatable, .view, column-header .button {
1707
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0;
1708
box-shadow: inset 0 0 0 10000px alpha(currentColor, 0);
1709
background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0)), to(transparent)), linear-gradient(to bottom, alpha(currentColor, 0));
1710
background-repeat: no-repeat;
1711
background-position: center, center;
1712
background-size: 240px 240px, auto; }
1713
.list-row.activatable:hover, .view:hover, column-header .button:hover {
1714
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, box-shadow 0;
1715
box-shadow: inset 0 0 0 10000px alpha(currentColor, 0.05); }
1716
.list-row.activatable:active, .view:active, column-header .button:active, GtkPlacesSidebar.sidebar .has-open-popup {
1717
transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), background-color 0, color 0, background-image 0;
1718
animation: list_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
1719
box-shadow: inset 0 0 0 10000px alpha(currentColor, 0.15); }
1720
1721
.list-row:selected .button:insensitive {
1722
color: rgba(255, 255, 255, 0.3); }
1723
.list-row:selected .button.flat {
1724
color: rgba(255, 255, 255, 0.75); }
1725
.list-row:selected .button.flat:hover, .list-row:selected .button.flat:active {
1726
color: #FFFFFF; }
1727
.list-row:selected .button.flat:insensitive {
1728
color: rgba(255, 255, 255, 0.3); }
1729
1730
/*********************
1731
* App Notifications *
1732
*********************/
1733
/*************
1734
* Expanders *
1735
*************/
1736
.expander {
1737
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); }
1738
.expander:dir(rtl) {
1739
-gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); }
1740
.expander:checked {
1741
-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
1742
.expander:not(:hover):not(:active) {
1743
color: alpha(currentColor, 0.75); }
1744
.expander:selected {
1745
color: #FFFFFF; }
1746
1747
/************
1748
* Calendar *
1749
***********/
1750
GtkCalendar {
1751
padding: 1px;
1752
border: 1px solid rgba(0, 0, 0, 0.2);
1753
color: #FFFFFF; }
1754
GtkCalendar:insensitive {
1755
color: rgba(255, 255, 255, 0.4); }
1756
GtkCalendar:selected {
1757
border-radius: 3px; }
1758
GtkCalendar.header {
1759
border-style: none none solid;
1760
border-radius: 0; }
1761
GtkCalendar:inconsistent {
1762
color: alpha(currentColor, 0.4); }
1763
GtkCalendar.highlight {
1764
font-size: smaller;
1765
color: alpha(currentColor, 0.6); }
1766
1767
/***********
1768
* Dialogs *
1769
***********/
1770
.message-dialog .dialog-action-area .button {
1771
padding: 8px; }
1772
1773
.message-dialog.background {
1774
background-color: #607D8B; }
1775
.message-dialog .titlebar {
1776
border-style: none;
1777
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
1778
background-color: #607D8B; }
1779
.message-dialog.csd.background {
1780
border-bottom-left-radius: 2px;
1781
border-bottom-right-radius: 2px; }
1782
.message-dialog.csd .dialog-action-area .button {
1783
padding: 9px 16px 10px;
1784
border-top: 1px solid rgba(0, 0, 0, 0.2);
1785
border-radius: 0;
1786
background-size: 240px 240px, auto; }
1787
.message-dialog.csd .dialog-action-area .button:first-child {
1788
border-radius: 0 0 0 2px; }
1789
.message-dialog.csd .dialog-action-area .button:last-child {
1790
border-radius: 0 0 2px 0; }
1791
1792
GtkFileChooserDialog .dialog-action-box {
1793
border-top: 1px solid rgba(0, 0, 0, 0.2); }
1794
1795
/***********
1796
* Sidebar *
1797
***********/
1798
.sidebar {
1799
border: none;
1800
background-color: #607D8B; }
1801
1802
GtkSidebarRow.list-row {
1803
padding: 0px; }
1804
GtkSidebarRow .sidebar-revealer {
1805
padding: 4px 14px 4px 12px; }
1806
GtkSidebarRow .sidebar-icon {
1807
opacity: 0.6; }
1808
GtkSidebarRow .sidebar-icon:dir(ltr) {
1809
padding-right: 8px; }
1810
GtkSidebarRow .sidebar-icon:dir(rtl) {
1811
padding-left: 8px; }
1812
GtkSidebarRow .sidebar-label:dir(ltr) {
1813
padding-right: 2px; }
1814
GtkSidebarRow .sidebar-label:dir(rtl) {
1815
padding-left: 2px; }
1816
1817
GtkPlacesSidebar.sidebar .sidebar-placeholder-row {
1818
border: solid 1px #42A5F5; }
1819
GtkPlacesSidebar.sidebar .sidebar-new-bookmark-row {
1820
color: #FF4081; }
1821
.sidebar-button.button.image-button {
1822
padding: 4px; }
1823
1824
.sidebar-item {
1825
padding: 10px 4px; }
1826
.sidebar-item > .label {
1827
padding-left: 6px;
1828
padding-right: 6px; }
1829
1830
/*********
1831
* Paned *
1832
*********/
1833
GtkPaned {
1834
-GtkPaned-handle-size: 1;
1835
-gtk-icon-source: none;
1836
margin: 0 8px 8px 0; }
1837
GtkPaned:dir(rtl) {
1838
margin-right: 0;
1839
margin-left: 8px; }
1840
GtkPaned .pane-separator {
1841
background-color: rgba(0, 0, 0, 0.2); }
1842
1843
GtkPaned.wide {
1844
-GtkPaned-handle-size: 6;
1845
margin: 0; }
1846
GtkPaned.wide .pane-separator {
1847
background-color: transparent;
1848
border-style: none solid;
1849
border-color: rgba(0, 0, 0, 0.2);
1850
border-width: 1px; }
1851
GtkPaned.wide.vertical .pane-separator {
1852
border-style: solid none; }
1853
1854
/**************
1855
* GtkInfoBar *
1856
**************/
1857
GtkInfoBar {
1858
border-style: none; }
1859
1860
.info {
1861
background-color: #66BB6A; }
1862
1863
.question {
1864
background-color: #42A5F5; }
1865
1866
.warning {
1867
background-color: #FFA726; }
1868
1869
.error {
1870
background-color: #EF5350; }
1871
1872
.info,
1873
.question,
1874
.warning,
1875
.error {
1876
color: #FFFFFF; }
1877
.info .button:insensitive,
1878
.question .button:insensitive,
1879
.warning .button:insensitive,
1880
.error .button:insensitive {
1881
color: rgba(255, 255, 255, 0.3); }
1882
1883
/************
1884
* Tooltips *
1885
************/
1886
.tooltip {
1887
color: #FFFFFF;
1888
padding: 4px;
1889
/* not working */
1890
border-radius: 2px;
1891
box-shadow: none; }
1892
.tooltip.background {
1893
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
1894
background-color: rgba(84, 110, 122, 0.9); }
1895
.tooltip.window-frame.csd {
1896
background-color: transparent; }
1897
1898
.tooltip * {
1899
padding: 4px;
1900
background-color: transparent;
1901
color: inherit; }
1902
1903
/*****************
1904
* Color Chooser *
1905
*****************/
1906
GtkColorSwatch {
1907
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1908
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1909
GtkColorSwatch.top {
1910
border-top-left-radius: 2px;
1911
border-top-right-radius: 2px; }
1912
GtkColorSwatch.bottom {
1913
border-bottom-left-radius: 2px;
1914
border-bottom-right-radius: 2px; }
1915
GtkColorSwatch.left, GtkColorSwatch:first-child:not(.overlay):not(.top) {
1916
border-top-left-radius: 2px;
1917
border-bottom-left-radius: 2px; }
1918
GtkColorSwatch.right, GtkColorSwatch:last-child:not(.overlay):not(.bottom) {
1919
border-top-right-radius: 2px;
1920
border-bottom-right-radius: 2px; }
1921
GtkColorSwatch:only-child:not(.overlay) {
1922
border-radius: 2px; }
1923
GtkColorSwatch.top > .overlay {
1924
border-top-left-radius: 2px;
1925
border-top-right-radius: 2px; }
1926
GtkColorSwatch.bottom > .overlay {
1927
border-bottom-left-radius: 2px;
1928
border-bottom-right-radius: 2px; }
1929
GtkColorSwatch:first-child:not(.top) > .overlay {
1930
border-top-left-radius: 2px;
1931
border-bottom-left-radius: 2px; }
1932
GtkColorSwatch:last-child:not(.bottom) > .overlay {
1933
border-top-right-radius: 2px;
1934
border-bottom-right-radius: 2px; }
1935
GtkColorSwatch:only-child > .overlay {
1936
border-radius: 2px; }
1937
GtkColorSwatch:hover {
1938
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1939
GtkColorEditor GtkColorSwatch {
1940
border-radius: 2px; }
1941
GtkColorEditor GtkColorSwatch:hover {
1942
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1943
GtkColorSwatch.color-dark {
1944
color: white; }
1945
GtkColorSwatch.color-light {
1946
color: rgba(0, 0, 0, 0.8); }
1947
GtkColorSwatch#add-color-button {
1948
background-image: linear-gradient(to right, #EF5350 25%, #FFA726 25%, #FFA726 50%, #66BB6A 50%, #66BB6A 75%, #42A5F5 75%);
1949
color: white; }
1950
1951
/********
1952
* Misc *
1953
********/
1954
.content-view {
1955
background-color: #455A64; }
1956
1957
.scale-popup .button {
1958
padding: 10px; }
1959
1960
/**********************
1961
* Window Decorations *
1962
*********************/
1963
.window-frame {
1964
transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);
1965
border-radius: 2px 2px 0 0;
1966
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22);
1967
/* this is used for the resize cursor area */
1968
margin: 8px; }
1969
.window-frame:backdrop {
1970
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1971
.window-frame.tiled {
1972
border-radius: 0; }
1973
.window-frame.popup {
1974
box-shadow: none; }
1975
.window-frame.ssd {
1976
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16); }
1977
.window-frame.csd.popup {
1978
border-radius: 2px;
1979
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1980
.window-frame.csd.tooltip {
1981
border-radius: 2px;
1982
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1983
.window-frame.csd.message-dialog {
1984
border-radius: 2px;
1985
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22); }
1986
.window-frame.csd.message-dialog:backdrop {
1987
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
1988
.window-frame.solid-csd {
1989
border-radius: 0;
1990
margin: 4px;
1991
background-color: #FF6D00;
1992
box-shadow: none; }
1993
1994
.header-bar .button.titlebutton:active,
1995
.titlebar .button.titlebutton:active {
1996
background-image: -gtk-gradient(radial, center center, 0, center center, 0.4, to(alpha(currentColor, 0.15)), to(transparent)), linear-gradient(to bottom, alpha(currentColor, 0.15)); }
1997
1998
.view:selected, GtkCalendar:selected, .label:selected, .grid-child:selected, .entry:selected, .menuitem.button.flat:selected, .list-row:selected, .sidebar:selected {
1999
background-color: #42A5F5;
2000
color: #FFFFFF; }
2001
.view:insensitive:selected, GtkCalendar:insensitive:selected, .label:insensitive:selected, .grid-child:insensitive:selected, .entry:insensitive:selected, .menuitem.button.flat:insensitive:selected, .list-row:insensitive:selected, .sidebar:insensitive:selected, GtkPlacesSidebar.sidebar .list-row:selected:insensitive .label {
2002
color: rgba(255, 255, 255, 0.4); }
2003
2004
.monospace {
2005
font: Monospace; }
2006
2007
/**********************
2008
* Touch Copy & Paste *
2009
*********************/
2010
.entry.cursor-handle,
2011
.cursor-handle {
2012
background-color: #FF4081;
2013
background-image: none;
2014
box-shadow: none;
2015
border-style: none; }
2016
.entry.cursor-handle.top:dir(ltr), .entry.cursor-handle.bottom:dir(rtl),
2017
.cursor-handle.top:dir(ltr),
2018
.cursor-handle.bottom:dir(rtl) {
2019
-gtk-icon-source: -gtk-scaled(url("assets/text-select-start-dark.png"), url("assets/text-select-start-dark@2.png"));
2020
padding-left: 10px; }
2021
.entry.cursor-handle.bottom:dir(ltr), .entry.cursor-handle.top:dir(rtl),
2022
.cursor-handle.bottom:dir(ltr),
2023
.cursor-handle.top:dir(rtl) {
2024
-gtk-icon-source: -gtk-scaled(url("assets/text-select-end-dark.png"), url("assets/text-select-end-dark@2.png"));
2025
padding-right: 10px; }
2026
.entry.cursor-handle.insertion-cursor:dir(ltr), .entry.cursor-handle.insertion-cursor:dir(rtl),
2027
.cursor-handle.insertion-cursor:dir(ltr),
2028
.cursor-handle.insertion-cursor:dir(rtl) {
2029
-gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-dark.png"), url("assets/slider-horz-scale-has-marks-above-dark@2.png")); }
2030
.entry.cursor-handle.top:hover:dir(ltr), .entry.cursor-handle.bottom:hover:dir(rtl),
2031
.cursor-handle.top:hover:dir(ltr),
2032
.cursor-handle.bottom:hover:dir(rtl) {
2033
-gtk-icon-source: -gtk-scaled(url("assets/text-select-start-hover-dark.png"), url("assets/text-select-start-hover-dark@2.png"));
2034
padding-left: 10px; }
2035
.entry.cursor-handle.bottom:hover:dir(ltr), .entry.cursor-handle.top:hover:dir(rtl),
2036
.cursor-handle.bottom:hover:dir(ltr),
2037
.cursor-handle.top:hover:dir(rtl) {
2038
-gtk-icon-source: -gtk-scaled(url("assets/text-select-end-hover-dark.png"), url("assets/text-select-end-hover-dark@2.png"));
2039
padding-right: 10px; }
2040
.entry.cursor-handle.insertion-cursor:hover:dir(ltr), .entry.cursor-handle.insertion-cursor:hover:dir(rtl),
2041
.cursor-handle.insertion-cursor:hover:dir(ltr),
2042
.cursor-handle.insertion-cursor:hover:dir(rtl) {
2043
-gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-hover-dark.png"), url("assets/slider-horz-scale-has-marks-above-hover-dark@2.png")); }
2044
.entry.cursor-handle.top:active:dir(ltr), .entry.cursor-handle.bottom:active:dir(rtl),
2045
.cursor-handle.top:active:dir(ltr),
2046
.cursor-handle.bottom:active:dir(rtl) {
2047
-gtk-icon-source: -gtk-scaled(url("assets/text-select-start-active-dark.png"), url("assets/text-select-start-active-dark@2.png"));
2048
padding-left: 10px; }
2049
.entry.cursor-handle.bottom:active:dir(ltr), .entry.cursor-handle.top:active:dir(rtl),
2050
.cursor-handle.bottom:active:dir(ltr),
2051
.cursor-handle.top:active:dir(rtl) {
2052
-gtk-icon-source: -gtk-scaled(url("assets/text-select-end-active-dark.png"), url("assets/text-select-end-active-dark@2.png"));
2053
padding-right: 10px; }
2054
.entry.cursor-handle.insertion-cursor:active:dir(ltr), .entry.cursor-handle.insertion-cursor:active:dir(rtl),
2055
.cursor-handle.insertion-cursor:active:dir(ltr),
2056
.cursor-handle.insertion-cursor:active:dir(rtl) {
2057
-gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-active-dark.png"), url("assets/slider-horz-scale-has-marks-above-active-dark@2.png")); }
2058
2059
/* Decouple the font of context menus from their entry/textview */
2060
.context-menu {
2061
font: initial; }
2062
2063
.touch-selection {
2064
font: initial;
2065
color: #FFFFFF;
2066
background-color: #546E7A;
2067
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); }
2068
.touch-selection:backdrop {
2069
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
2070
2071
.overshoot.top {
2072
background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2073
background-repeat: no-repeat;
2074
background-position: center top;
2075
background-color: transparent;
2076
border: none;
2077
box-shadow: none; }
2078
.overshoot.bottom {
2079
background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2080
background-repeat: no-repeat;
2081
background-position: center bottom;
2082
background-color: transparent;
2083
border: none;
2084
box-shadow: none; }
2085
.overshoot.left {
2086
background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2087
background-repeat: no-repeat;
2088
background-position: left center;
2089
background-color: transparent;
2090
border: none;
2091
box-shadow: none; }
2092
.overshoot.right {
2093
background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent));
2094
background-repeat: no-repeat;
2095
background-position: right center;
2096
background-color: transparent;
2097
border: none;
2098
box-shadow: none; }
2099
2100
.undershoot.top {
2101
background-color: transparent;
2102
background-image: linear-gradient(to left, rgba(84, 110, 122, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
2103
padding-top: 1px;
2104
background-size: 12px 1px;
2105
background-repeat: repeat-x;
2106
background-origin: content-box;
2107
background-position: left top; }
2108
.undershoot.bottom {
2109
background-color: transparent;
2110
background-image: linear-gradient(to left, rgba(84, 110, 122, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
2111
padding-bottom: 1px;
2112
background-size: 12px 1px;
2113
background-repeat: repeat-x;
2114
background-origin: content-box;
2115
background-position: left bottom; }
2116
.undershoot.left {
2117
background-color: transparent;
2118
background-image: linear-gradient(to top, rgba(84, 110, 122, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
2119
padding-left: 1px;
2120
background-size: 1px 12px;
2121
background-repeat: repeat-y;
2122
background-origin: content-box;
2123
background-position: left top; }
2124
.undershoot.right {
2125
background-color: transparent;
2126
background-image: linear-gradient(to top, rgba(84, 110, 122, 0.3) 50%, rgba(255, 255, 255, 0.3) 50%);
2127
padding-right: 1px;
2128
background-size: 1px 12px;
2129
background-repeat: repeat-y;
2130
background-origin: content-box;
2131
background-position: right top; }
2132
2133
.floating-bar {
2134
padding: 3px 0 4px;
2135
border-width: 1px;
2136
border-style: solid solid none;
2137
border-color: rgba(0, 0, 0, 0.2);
2138
border-radius: 3px 3px 0 0;
2139
background-color: #546E7A;
2140
background-clip: border-box; }
2141
.floating-bar.left {
2142
border-left-style: none;
2143
border-top-left-radius: 0; }
2144
.floating-bar.right {
2145
border-right-style: none;
2146
border-top-right-radius: 0; }
2147
.floating-bar .button {
2148
padding: 4px; }
2149
2150
/************
2151
* Nautilus *
2152
************/
2153
EelEditableLabel.entry {
2154
transition: none; }
2155
2156
.nautilus-desktop.nautilus-canvas-item {
2157
color: #FFFFFF;
2158
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
2159
2160
.nautilus-desktop.nautilus-canvas-item:selected {
2161
text-shadow: none; }
2162
2163
/* Toolbar */
2164
@keyframes needs_attention_keyframes {
2165
0% {
2166
background-color: transparent; }
2167
50% {
2168
background-color: alpha(currentColor, 0.3); }
2169
100% {
2170
background-color: transparent; } }
2171
.nautilus-operations-button-needs-attention {
2172
color: #FF4081;
2173
animation: needs_attention_keyframes 2s cubic-bezier(0.4, 0, 0.2, 1); }
2174
2175
.nautilus-operations-button-needs-attention-multiple {
2176
color: #FF4081;
2177
animation: needs_attention_keyframes 2s cubic-bezier(0.4, 0, 0.2, 1);
2178
animation-iteration-count: 2; }
2179
2180
.disk-space-display.unknown {
2181
background-color: #FF6D00; }
2182
2183
.disk-space-display.used {
2184
background-color: #42A5F5; }
2185
2186
.disk-space-display.free {
2187
background-color: alpha(currentColor, 0.3);
2188
color: rgba(255, 255, 255, 0.4); }
2189
2190
/* View */
2191
/**************
2192
* Tweak Tool *
2193
**************/
2194
.tweak-categories {
2195
background-color: #607D8B;
2196
background-image: linear-gradient(to bottom, #607D8B); }
2197
.tweak-categories .separator {
2198
-GtkWidget-wide-separators: true;
2199
color: transparent; }
2200
2201
/************
2202
* Software *
2203
************/
2204
.button.install-progress:insensitive {
2205
background-color: alpha(currentColor, 0.3); }
2206
2207
/***********
2208
* Builder *
2209
***********/
2210
GbTerminalView {
2211
background-color: #546E7A; }
2212
2213
/***********
2214
* Firefox *
2215
***********/
2216
.menubar {
2217
color: rgba(255, 255, 255, 0.75); }
2218
.menubar:hover {
2219
color: #FFFFFF; }
2220
2221
/*********
2222
* Unity *
2223
*********/
2224
UnityDecoration {
2225
-UnityDecoration-extents: 28px 0 0 0;
2226
-UnityDecoration-input-extents: 8px;
2227
-UnityDecoration-shadow-offset-x: 0;
2228
-UnityDecoration-shadow-offset-y: 3px;
2229
-UnityDecoration-active-shadow-color: rgba(0, 0, 0, 0.48);
2230
-UnityDecoration-active-shadow-radius: 18px;
2231
-UnityDecoration-inactive-shadow-color: rgba(0, 0, 0, 0.32);
2232
-UnityDecoration-inactive-shadow-radius: 6px;
2233
-UnityDecoration-glow-size: 8px;
2234
-UnityDecoration-glow-color: #42A5F5;
2235
-UnityDecoration-title-indent: 4px;
2236
-UnityDecoration-title-fade: 32px;
2237
-UnityDecoration-title-alignment: 0.0; }
2238
2239
UnityDecoration.top {
2240
padding: 0 2px;
2241
border-style: none;
2242
border-radius: 2px 2px 0 0;
2243
box-shadow: inset 0 1px rgba(255, 255, 255, 0.2);
2244
background-color: #BDBDBD;
2245
color: #FFFFFF; }
2246
2247
UnityDecoration.top:backdrop {
2248
color: rgba(255, 255, 255, 0.75); }
2249
2250
UnityDecoration.menuitem,
2251
UnityDecoration .menuitem {
2252
color: alpha(currentColor, 0.75); }
2253
2254
UnityDecoration.menubar.menuitem:hover,
2255
UnityDecoration.menubar .menuitem *:hover {
2256
box-shadow: inset 0 -2px currentColor;
2257
background-color: transparent;
2258
color: currentColor; }
2259
2260
.background:not(.csd) :not(.titlebar) .header-bar {
2261
border-radius: 0;
2262
box-shadow: none; }
2263
.background:not(.csd) :not(.titlebar) .header-bar.inline-toolbar {
2264
border-style: none; }
2265
2266
UnityPanelWidget,
2267
.unity-panel {
2268
background-color: #BDBDBD;
2269
background-image: linear-gradient(to bottom, #BDBDBD);
2270
color: #FFFFFF; }
2271
2272
UnityPanelWidget:backdrop,
2273
.unity-panel:backdrop {
2274
color: rgba(255, 255, 255, 0.75); }
2275
2276
.unity-panel.menuitem,
2277
.unity-panel .menuitem {
2278
color: alpha(currentColor, 0.75); }
2279
2280
.unity-panel.menubar.menuitem:hover,
2281
.unity-panel.menubar .menuitem *:hover {
2282
box-shadow: inset 0 -2px currentColor;
2283
background-color: transparent;
2284
color: currentColor; }
2285
2286
@keyframes playbackmenuitem_spinner {
2287
to {
2288
-gtk-icon-transform: rotate(1turn); } }
2289
.menu IdoPlaybackMenuItem.menuitem:active {
2290
-gtk-icon-source: -gtk-icontheme("process-working-symbolic");
2291
animation: playbackmenuitem_spinner 1s infinite linear;
2292
color: #42A5F5; }
2293
2294
/* GTK NAMED COLORS
2295
----------------
2296
use responsibly! */
2297
/*
2298
widget text/foreground color */
2299
@define-color theme_fg_color #FFFFFF;
2300
/*
2301
text color for entries, views and content in general */
2302
@define-color theme_text_color #FFFFFF;
2303
/*
2304
widget base background color */
2305
@define-color theme_bg_color #455A64;
2306
/*
2307
text widgets and the like base background color */
2308
@define-color theme_base_color #546E7A;
2309
/*
2310
base background color of selections */
2311
@define-color theme_selected_bg_color #42A5F5;
2312
/*
2313
text/foreground color of selections */
2314
@define-color theme_selected_fg_color #FFFFFF;
2315
/*
2316
base background color of insensitive widgets */
2317
@define-color insensitive_bg_color #455A64;
2318
/*
2319
text foreground color of insensitive widgets */
2320
@define-color insensitive_fg_color rgba(255, 255, 255, 0.4);
2321
/*
2322
insensitive text widgets and the like base background color */
2323
@define-color insensitive_base_color #4d646f;
2324
/*
2325
widget text/foreground color on backdrop windows */
2326
@define-color theme_unfocused_fg_color #FFFFFF;
2327
/*
2328
text color for entries, views and content in general on backdrop windows */
2329
@define-color theme_unfocused_text_color #FFFFFF;
2330
/*
2331
widget base background color on backdrop windows */
2332
@define-color theme_unfocused_bg_color #455A64;
2333
/*
2334
text widgets and the like base background color on backdrop windows */
2335
@define-color theme_unfocused_base_color #546E7A;
2336
/*
2337
base background color of selections on backdrop windows */
2338
@define-color theme_unfocused_selected_bg_color #42A5F5;
2339
/*
2340
text/foreground color of selections on backdrop windows */
2341
@define-color theme_unfocused_selected_fg_color #FFFFFF;
2342
/*
2343
widgets main borders color */
2344
@define-color borders rgba(0, 0, 0, 0.2);
2345
/*
2346
widgets main borders color on backdrop windows */
2347
@define-color unfocused_borders rgba(0, 0, 0, 0.2);
2348
/*
2349
these are pretty self explicative */
2350
@define-color warning_color #FF6D00;
2351
@define-color error_color #DD2C00;
2352
@define-color success_color #00C853;
2353
@define-color content_view_bg #546E7A;
2354
@define-color placeholder_text_color #bbc5ca;
2355