A fork of the Materia GTK theme.

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

 gtk.css

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