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.

 gnome-shell.css

View raw Download
text/plain • 51.33 kiB
ASCII text, with very long lines (387)
        
            
1
/* This stylesheet is generated, DO NOT EDIT */
2
/* Copyright 2009, 2015 Red Hat, Inc.
3
*
4
* Portions adapted from Mx's data/style/default.css
5
* Copyright 2009 Intel Corporation
6
*
7
* This program is free software; you can redistribute it and/or modify it
8
* under the terms and conditions of the GNU Lesser General Public License,
9
* version 2.1, as published by the Free Software Foundation.
10
*
11
* This program is distributed in the hope it will be useful, but WITHOUT ANY
12
* WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
13
* FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for
14
* more details.
15
*
16
* You should have received a copy of the GNU Lesser General Public License
17
* along with this program; if not, write to the Free Software Foundation,
18
* Inc., 51 Franklin St - Fifth Floor, Boston, MA 02110-1301 USA.
19
*/
20
* {
21
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
22
transition-duration: 0.2s; }
23
24
/* GLOBALS */
25
stage {
26
font-family: "M+ 1c", Cantarell, Sans-Serif;
27
font-size: 11pt;
28
color: rgba(0, 0, 0, 0.8); }
29
30
/* WIDGETS */
31
/* Buttons */
32
.button {
33
border-radius: 2px;
34
border-width: 0;
35
padding: 7px 16px 8px;
36
font-weight: 500;
37
color: rgba(0, 0, 0, 0.64);
38
background-color: transparent;
39
border-color: transparent;
40
box-shadow: 0 0 transparent;
41
text-shadow: none;
42
icon-shadow: none; }
43
.button:hover {
44
color: rgba(0, 0, 0, 0.8);
45
background-color: rgba(0, 0, 0, 0.08);
46
border-color: transparent;
47
box-shadow: 0 0 transparent;
48
text-shadow: none;
49
icon-shadow: none; }
50
.button:active {
51
color: rgba(0, 0, 0, 0.8);
52
background-color: rgba(0, 0, 0, 0.16);
53
border-color: transparent;
54
box-shadow: 0 0 transparent;
55
text-shadow: none;
56
icon-shadow: none; }
57
.button:insensitive {
58
color: rgba(0, 0, 0, 0.256);
59
background-color: transparent;
60
border-color: transparent;
61
box-shadow: 0 0 transparent;
62
text-shadow: none;
63
icon-shadow: none; }
64
.button:focus {
65
color: rgba(0, 0, 0, 0.8);
66
text-shadow: none;
67
icon-shadow: none;
68
box-shadow: 0 0 transparent; }
69
70
/* Entries */
71
StEntry {
72
border-radius: 0;
73
padding: 7px 8px 8px;
74
border-width: 0;
75
color: rgba(0, 0, 0, 0.8);
76
selection-background-color: #3498db;
77
selected-color: white;
78
background-color: rgba(0, 0, 0, 0.01);
79
border-color: transparent;
80
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.16); }
81
StEntry:focus {
82
border-color: transparent;
83
box-shadow: inset 0 -2px #3498db; }
84
StEntry:insensitive {
85
color: rgba(0, 0, 0, 0.32);
86
border-color: transparent;
87
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.064); }
88
StEntry StIcon.capslock-warning {
89
icon-size: 16px;
90
warning-color: #e67e22;
91
padding: 0 2px; }
92
93
/* Scrollbars */
94
StScrollView.vfade {
95
-st-vfade-offset: 32px; }
96
StScrollView.hfade {
97
-st-hfade-offset: 32px; }
98
99
StScrollBar {
100
padding: 0; }
101
StScrollView StScrollBar {
102
min-width: 16px;
103
min-height: 16px; }
104
StScrollBar StBin#trough {
105
margin: 4px;
106
border-radius: 100px;
107
background-color: rgba(0, 0, 0, 0.16); }
108
StScrollBar StButton#vhandle, StScrollBar StButton#hhandle {
109
border-radius: 100px;
110
background-color: rgba(0, 0, 0, 0.48);
111
margin: 4px; }
112
StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover {
113
background-color: rgba(0, 0, 0, 0.64); }
114
StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
115
background-color: rgba(0, 0, 0, 0.8); }
116
117
/* Slider */
118
.slider {
119
height: 20px;
120
color: #3498db;
121
-slider-height: 4px;
122
-slider-background-color: rgba(0, 0, 0, 0.16);
123
-slider-border-color: transparent;
124
-slider-active-background-color: #3498db;
125
-slider-active-border-color: transparent;
126
-slider-border-width: 0;
127
-slider-handle-radius: 8px; }
128
129
/* Check Boxes */
130
.check-box StBoxLayout {
131
spacing: .8em; }
132
.check-box StBin {
133
width: 20px;
134
height: 20px;
135
background-image: url("checkbox-off.svg");
136
color: rgba(0, 0, 0, 0.64); }
137
.check-box:focus StBin {
138
background-image: url("checkbox-off.svg"); }
139
.check-box:checked StBin {
140
background-image: url("checkbox.svg"); }
141
.check-box:focus:checked StBin {
142
background-image: url("checkbox.svg"); }
143
144
/* Switches */
145
.toggle-switch {
146
width: 40px;
147
height: 20px;
148
background-size: contain; }
149
150
.toggle-switch-us {
151
background-image: url("toggle-off.svg"); }
152
.toggle-switch-us:checked {
153
background-image: url("toggle-on.svg"); }
154
155
.toggle-switch-intl {
156
background-image: url("toggle-off.svg"); }
157
.toggle-switch-intl:checked {
158
background-image: url("toggle-on.svg"); }
159
160
/* links */
161
.shell-link {
162
border-radius: 2px;
163
color: #3498db; }
164
.shell-link:hover {
165
color: #3498db;
166
background-color: rgba(52, 152, 219, 0.1); }
167
.shell-link:active {
168
color: #3498db;
169
background-color: rgba(52, 152, 219, 0.2); }
170
171
/* Modal Dialogs */
172
.headline {
173
font-size: 110%; }
174
175
.lightbox {
176
background-color: black; }
177
178
.flashspot {
179
background-color: white; }
180
181
.modal-dialog {
182
border-radius: 2px;
183
color: rgba(0, 0, 0, 0.8);
184
background-color: rgba(255, 255, 255, 0.95);
185
border: none;
186
box-shadow: 0 14px 28px rgba(0, 0, 0, 0.375), 0 10px 10px rgba(0, 0, 0, 0.33);
187
padding: 24px; }
188
.modal-dialog .run-dialog-entry {
189
width: 20em;
190
margin-bottom: 6px; }
191
.modal-dialog .run-dialog-error-box {
192
padding-top: 16px;
193
spacing: 6px; }
194
.modal-dialog .run-dialog-button-box {
195
padding-top: 1em; }
196
.modal-dialog .run-dialog-label {
197
font-size: 11pt;
198
font-weight: normal;
199
color: rgba(0, 0, 0, 0.4);
200
padding-bottom: .4em; }
201
202
.button-dialog-button-box {
203
spacing: 18px;
204
padding-top: 48px; }
205
206
.show-processes-dialog-subject,
207
.mount-question-dialog-subject,
208
.end-session-dialog-subject {
209
font-size: 14pt; }
210
211
/* End Session Dialog */
212
.end-session-dialog {
213
spacing: 42px;
214
border: none; }
215
216
.end-session-dialog-list {
217
padding-top: 20px; }
218
219
.end-session-dialog-layout {
220
padding-left: 17px; }
221
.end-session-dialog-layout:rtl {
222
padding-right: 17px; }
223
224
.end-session-dialog-description {
225
width: 28em;
226
padding-bottom: 10px; }
227
.end-session-dialog-description:rtl {
228
text-align: right; }
229
230
.end-session-dialog-warning {
231
width: 28em;
232
color: #e67e22;
233
padding-top: 6px; }
234
.end-session-dialog-warning:rtl {
235
text-align: right; }
236
237
.end-session-dialog-logout-icon {
238
border-radius: 5px;
239
width: 48px;
240
height: 48px;
241
background-size: contain; }
242
243
.end-session-dialog-shutdown-icon {
244
color: rgba(0, 0, 0, 0.4);
245
width: 48px;
246
height: 48px; }
247
248
.end-session-dialog-inhibitor-layout {
249
spacing: 16px;
250
max-height: 200px;
251
padding-right: 65px;
252
padding-left: 65px; }
253
254
.end-session-dialog-session-list,
255
.end-session-dialog-app-list {
256
spacing: 1em; }
257
258
.end-session-dialog-list-header {
259
font-weight: bold; }
260
.end-session-dialog-list-header:rtl {
261
text-align: right; }
262
263
.end-session-dialog-app-list-item,
264
.end-session-dialog-session-list-item {
265
spacing: 1em; }
266
267
.end-session-dialog-app-list-item-name,
268
.end-session-dialog-session-list-item-name {
269
font-weight: bold; }
270
271
.end-session-dialog-app-list-item-description {
272
color: rgba(0, 0, 0, 0.4);
273
font-size: 10pt; }
274
275
/* ShellMountOperation Dialogs */
276
.shell-mount-operation-icon {
277
icon-size: 48px; }
278
279
.show-processes-dialog,
280
.mount-question-dialog {
281
spacing: 24px; }
282
283
.show-processes-dialog-subject,
284
.mount-question-dialog-subject {
285
padding-top: 10px;
286
padding-left: 17px;
287
padding-bottom: 6px; }
288
289
.mount-question-dialog-subject {
290
max-width: 500px; }
291
292
.show-processes-dialog-subject:rtl,
293
.mount-question-dialog-subject:rtl {
294
padding-left: 0px;
295
padding-right: 17px; }
296
297
.show-processes-dialog-description,
298
.mount-question-dialog-description {
299
padding-left: 17px;
300
width: 28em; }
301
302
.show-processes-dialog-description:rtl,
303
.mount-question-dialog-description:rtl {
304
padding-right: 17px; }
305
306
.show-processes-dialog-app-list {
307
max-height: 200px;
308
padding-top: 24px;
309
padding-left: 49px;
310
padding-right: 32px; }
311
312
.show-processes-dialog-app-list:rtl {
313
padding-right: 49px;
314
padding-left: 32px; }
315
316
.show-processes-dialog-app-list-item {
317
color: rgba(0, 0, 0, 0.8); }
318
.show-processes-dialog-app-list-item:hover {
319
color: rgba(0, 0, 0, 0.8); }
320
.show-processes-dialog-app-list-item:ltr {
321
padding-right: 1em; }
322
.show-processes-dialog-app-list-item:rtl {
323
padding-left: 1em; }
324
325
.show-processes-dialog-app-list-item-icon:ltr {
326
padding-right: 17px; }
327
.show-processes-dialog-app-list-item-icon:rtl {
328
padding-left: 17px; }
329
330
.show-processes-dialog-app-list-item-name {
331
font-size: 10pt; }
332
333
/* Password or Authentication Dialog */
334
.prompt-dialog {
335
width: 500px;
336
border: none; }
337
338
.prompt-dialog-main-layout {
339
spacing: 24px;
340
padding: 10px; }
341
342
.prompt-dialog-message-layout {
343
spacing: 16px; }
344
345
.prompt-dialog-headline {
346
font-size: 14pt;
347
font-weight: normal;
348
color: rgba(0, 0, 0, 0.8); }
349
350
.prompt-dialog-description:rtl {
351
text-align: right; }
352
353
.prompt-dialog-password-box {
354
spacing: 1em;
355
padding-bottom: 1em; }
356
357
.prompt-dialog-error-label {
358
font-size: 10pt;
359
color: #e74c3c;
360
padding-bottom: 8px; }
361
362
.prompt-dialog-info-label {
363
font-size: 10pt;
364
padding-bottom: 8px; }
365
366
.hidden {
367
color: transparent; }
368
369
.prompt-dialog-null-label {
370
font-size: 10pt;
371
padding-bottom: 8px; }
372
373
/* Polkit Dialog */
374
.polkit-dialog-user-layout {
375
padding-left: 10px;
376
spacing: 10px; }
377
.polkit-dialog-user-layout:rtl {
378
padding-left: 0px;
379
padding-right: 10px; }
380
381
.polkit-dialog-user-root-label {
382
color: #e67e22; }
383
384
.polkit-dialog-user-icon {
385
border-radius: 5px;
386
background-size: contain;
387
width: 48px;
388
height: 48px; }
389
390
/* Network Agent Dialog */
391
.network-dialog-secret-table {
392
spacing-rows: 15px;
393
spacing-columns: 1em; }
394
395
.keyring-dialog-control-table {
396
spacing-rows: 15px;
397
spacing-columns: 1em; }
398
399
/* Popovers/Menus */
400
.popup-menu {
401
min-width: 200px; }
402
.popup-menu .popup-sub-menu {
403
background-color: rgba(0, 0, 0, 0.04);
404
box-shadow: 0 0 transparent; }
405
.popup-menu .popup-menu-content {
406
padding: 8px 0; }
407
.popup-menu .popup-menu-item {
408
spacing: 12px; }
409
.popup-menu .popup-menu-item:ltr {
410
padding: .4em 1.75em .4em 0em; }
411
.popup-menu .popup-menu-item:rtl {
412
padding: .4em 0em .4em 1.75em; }
413
.popup-menu .popup-menu-item:checked {
414
background-color: #3498db;
415
color: white;
416
box-shadow: 0 0 transparent;
417
font-weight: normal; }
418
.popup-menu .popup-menu-item:checked.selected {
419
background-color: #48a2df;
420
color: white; }
421
.popup-menu .popup-menu-item:checked:active {
422
background-color: #5dade2;
423
color: white; }
424
.popup-menu .popup-menu-item:checked:insensitive {
425
color: rgba(255, 255, 255, 0.5); }
426
.popup-menu .popup-menu-item.selected {
427
background-color: rgba(0, 0, 0, 0.08);
428
color: rgba(0, 0, 0, 0.8);
429
transition-duration: 0s; }
430
.popup-menu .popup-menu-item:active {
431
background-color: rgba(0, 0, 0, 0.16);
432
color: rgba(0, 0, 0, 0.8);
433
transition-duration: 0.2s; }
434
.popup-menu .popup-menu-item.selected:active {
435
color: rgba(0, 0, 0, 0.8); }
436
.popup-menu .popup-menu-item:insensitive {
437
color: rgba(0, 0, 0, 0.4); }
438
.popup-menu .popup-inactive-menu-item {
439
color: rgba(0, 0, 0, 0.8); }
440
.popup-menu .popup-inactive-menu-item:insensitive {
441
color: rgba(0, 0, 0, 0.4); }
442
.popup-menu.panel-menu {
443
-boxpointer-gap: 4px;
444
margin-bottom: 1.75em; }
445
446
.popup-menu-ornament {
447
text-align: right;
448
width: 1.2em;
449
height: 1.2em; }
450
451
.popup-menu-boxpointer,
452
.candidate-popup-boxpointer {
453
-arrow-border-radius: 0;
454
-arrow-background-color: transparent;
455
-arrow-border-width: 0;
456
-arrow-border-color: transparent;
457
-arrow-base: 0;
458
-arrow-rise: 0;
459
-arrow-box-shadow: none;
460
margin: 5px 8px 8px;
461
background-color: rgba(255, 255, 255, 0.95);
462
border-radius: 2px;
463
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.24), 0 3px 6px rgba(0, 0, 0, 0.345); }
464
465
.popup-separator-menu-item {
466
height: 1px;
467
margin: 6px 64px;
468
background-color: transparent;
469
border-color: rgba(0, 0, 0, 0.1);
470
border-bottom-width: 1px;
471
border-bottom-style: solid; }
472
473
.background-menu {
474
-boxpointer-gap: 4px;
475
-arrow-rise: 0px; }
476
477
/* fallback menu
478
- odd thing for styling App menu when apparently not running under shell. Light Adwaita styled
479
app menu inside the main app window itself rather than the top bar
480
*/
481
/* OSD */
482
.osd-window {
483
text-align: center;
484
font-weight: bold;
485
spacing: 1em;
486
margin: 32px;
487
min-width: 64px;
488
min-height: 64px; }
489
.osd-window .osd-monitor-label {
490
font-size: 3em; }
491
.osd-window .level {
492
height: 0.6em;
493
border-radius: 4px;
494
background-color: rgba(0, 0, 0, 0.16);
495
color: rgba(0, 0, 0, 0.8); }
496
497
/* App Switcher */
498
.switcher-popup {
499
padding: 8px;
500
spacing: 16px; }
501
502
.switcher-list-item-container {
503
spacing: 8px; }
504
505
.switcher-list .item-box {
506
padding: 8px;
507
border-radius: 2px; }
508
509
.switcher-list .item-box:outlined {
510
padding: 6px;
511
border: 2px solid rgba(0, 0, 0, 0.16); }
512
513
.switcher-list .item-box:selected {
514
background-color: #3498db;
515
color: white; }
516
517
.switcher-list .thumbnail-box {
518
padding: 2px;
519
spacing: 4px; }
520
521
.switcher-list .thumbnail {
522
width: 256px; }
523
524
.switcher-list .separator {
525
width: 1px;
526
background: rgba(0, 0, 0, 0.1); }
527
528
.switcher-arrow {
529
border-color: transparent;
530
color: rgba(0, 0, 0, 0.4); }
531
.switcher-arrow:highlighted {
532
color: rgba(0, 0, 0, 0.8); }
533
534
.input-source-switcher-symbol {
535
font-size: 34pt;
536
width: 96px;
537
height: 96px; }
538
539
/* Workspace Switcher */
540
.workspace-switcher-group {
541
padding: 12px; }
542
543
.workspace-switcher {
544
background: transparent;
545
border: 0px;
546
border-radius: 0px;
547
padding: 0px;
548
spacing: 8px; }
549
550
.ws-switcher-active-up, .ws-switcher-active-down {
551
height: 50px;
552
background-color: #3498db;
553
color: white;
554
background-size: 32px;
555
border-radius: 2px; }
556
557
.ws-switcher-box {
558
height: 50px;
559
border: 2px solid rgba(0, 0, 0, 0.16);
560
background: transparent;
561
border-radius: 2px; }
562
563
.osd-window,
564
.resize-popup,
565
.switcher-list, .workspace-switcher-container {
566
color: rgba(0, 0, 0, 0.8);
567
background-color: rgba(255, 255, 255, 0.95);
568
border: none;
569
box-shadow: 0 14px 28px rgba(0, 0, 0, 0.375), 0 10px 10px rgba(0, 0, 0, 0.33);
570
border-radius: 2px;
571
padding: 12px; }
572
573
/* Tiled window previews */
574
.tile-preview {
575
background-color: rgba(52, 152, 219, 0.2);
576
border: 1px solid #3498db; }
577
578
.tile-preview-left.on-primary {
579
border-radius: 0 0 0 0; }
580
581
.tile-preview-right.on-primary {
582
border-radius: 0 0 0 0; }
583
584
.tile-preview-left.tile-preview-right.on-primary {
585
border-radius: 0 0 0 0; }
586
587
/* TOP BAR */
588
#panel {
589
background-color: rgba(0, 0, 0, 0.5);
590
font-weight: bold;
591
height: 32px; }
592
#panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen {
593
background-color: transparent; }
594
#panel #panelLeft, #panel #panelCenter {
595
spacing: 0; }
596
#panel .panel-corner {
597
-panel-corner-radius: 0;
598
-panel-corner-background-color: rgba(0, 0, 0, 0.5);
599
-panel-corner-border-width: 2px;
600
-panel-corner-border-color: transparent; }
601
#panel .panel-corner:active, #panel .panel-corner:overview, #panel .panel-corner:focus {
602
-panel-corner-border-color: rgba(255, 255, 255, 0.8); }
603
#panel .panel-corner.lock-screen, #panel .panel-corner.login-screen, #panel .panel-corner.unlock-screen {
604
-panel-corner-radius: 0;
605
-panel-corner-background-color: transparent;
606
-panel-corner-border-color: transparent; }
607
#panel .panel-button {
608
-natural-hpadding: 12px;
609
-minimum-hpadding: 6px;
610
font-weight: bold;
611
color: rgba(255, 255, 255, 0.8);
612
transition-duration: 0.2s; }
613
#panel .panel-button .app-menu-icon {
614
-st-icon-style: symbolic;
615
margin-left: 4px;
616
margin-right: 4px; }
617
#panel .panel-button:hover {
618
color: white; }
619
#panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked {
620
background-color: rgba(0, 0, 0, 0.01);
621
box-shadow: inset 0 -2px 0px rgba(255, 255, 255, 0.8);
622
color: white; }
623
#panel .panel-button:active > .system-status-icon, #panel .panel-button:overview > .system-status-icon, #panel .panel-button:focus > .system-status-icon, #panel .panel-button:checked > .system-status-icon {
624
icon-shadow: none; }
625
#panel .panel-button .system-status-icon {
626
icon-size: 1.09em;
627
padding: 0 5px; }
628
.unlock-screen #panel .panel-button, .login-screen #panel .panel-button, .lock-screen #panel .panel-button {
629
color: rgba(255, 255, 255, 0.8); }
630
.unlock-screen #panel .panel-button:focus, .unlock-screen #panel .panel-button:hover, .unlock-screen #panel .panel-button:active, .login-screen #panel .panel-button:focus, .login-screen #panel .panel-button:hover, .login-screen #panel .panel-button:active, .lock-screen #panel .panel-button:focus, .lock-screen #panel .panel-button:hover, .lock-screen #panel .panel-button:active {
631
color: white; }
632
#panel .panel-status-indicators-box,
633
#panel .panel-status-menu-box {
634
spacing: 2px; }
635
#panel .screencast-indicator {
636
color: #e67e22; }
637
638
#calendarArea {
639
padding: 0.75em 1.0em; }
640
641
.calendar {
642
margin-bottom: 1em; }
643
644
.calendar,
645
.datemenu-today-button,
646
.datemenu-displays-box,
647
.message-list-sections {
648
margin: 0 1.5em; }
649
650
.datemenu-calendar-column {
651
spacing: 0.5em; }
652
653
.datemenu-displays-section {
654
padding-bottom: 3em; }
655
656
.datemenu-today-button,
657
.world-clocks-button,
658
.message-list-section-title {
659
border-radius: 2px;
660
padding: .4em; }
661
662
.message-list-section-list:ltr {
663
padding-left: .4em; }
664
665
.message-list-section-list:rtl {
666
padding-right: .4em; }
667
668
.datemenu-today-button:hover, .datemenu-today-button:focus,
669
.world-clocks-button:hover,
670
.world-clocks-button:focus,
671
.message-list-section-title:hover,
672
.message-list-section-title:focus {
673
color: rgba(0, 0, 0, 0.8);
674
background-color: rgba(0, 0, 0, 0.08); }
675
.datemenu-today-button:active,
676
.world-clocks-button:active,
677
.message-list-section-title:active {
678
color: rgba(0, 0, 0, 0.8);
679
background-color: rgba(0, 0, 0, 0.16); }
680
681
.datemenu-today-button .date-label {
682
font-size: 1.5em; }
683
684
.world-clocks-header,
685
.message-list-section-title {
686
color: rgba(0, 0, 0, 0.64);
687
font-weight: bold; }
688
689
.world-clocks-grid {
690
spacing-rows: 0.4em; }
691
692
.calendar-month-label {
693
color: rgba(0, 0, 0, 0.8);
694
font-weight: bold;
695
padding: 4px 0; }
696
697
.pager-button {
698
color: rgba(0, 0, 0, 0.8);
699
background-color: transparent;
700
width: 32px;
701
height: 32px;
702
border-radius: 32px; }
703
.pager-button:hover, .pager-button:focus {
704
background-color: rgba(0, 0, 0, 0.08); }
705
.pager-button:active {
706
background-color: rgba(0, 0, 0, 0.16); }
707
708
.calendar-change-month-back {
709
background-image: url("calendar-arrow-left.svg"); }
710
.calendar-change-month-back:rtl {
711
background-image: url("calendar-arrow-right.svg"); }
712
713
.calendar-change-month-forward {
714
background-image: url("calendar-arrow-right.svg"); }
715
.calendar-change-month-forward:rtl {
716
background-image: url("calendar-arrow-left.svg"); }
717
718
.calendar-day-base {
719
font-size: smaller;
720
text-align: center;
721
width: 32px;
722
height: 32px;
723
padding: 0;
724
margin: 2px;
725
border-radius: 32px; }
726
.calendar-day-base:hover, .calendar-day-base:focus {
727
background-color: rgba(0, 0, 0, 0.08); }
728
.calendar-day-base:active {
729
color: white;
730
background-color: #3498db;
731
border-color: transparent; }
732
.calendar-day-base.calendar-day-heading {
733
font-weight: bold;
734
color: rgba(0, 0, 0, 0.4);
735
margin-top: 1em;
736
font-size: smaller; }
737
.calendar-day-base.calendar-week-number {
738
font-weight: bold;
739
color: rgba(0, 0, 0, 0.4); }
740
741
.calendar-day {
742
border-width: 0; }
743
744
.calendar-day-top {
745
border-top-width: 0; }
746
747
.calendar-day-left {
748
border-left-width: 0; }
749
750
.calendar-nonwork-day {
751
color: rgba(0, 0, 0, 0.8); }
752
753
.calendar-today {
754
font-weight: bold !important;
755
border: none; }
756
757
.calendar-day-with-events {
758
color: #3498db;
759
font-weight: normal;
760
text-decoration: underline;
761
background-image: none; }
762
763
.calendar-other-month-day {
764
color: rgba(0, 0, 0, 0.4);
765
opacity: 0.5; }
766
767
/* Message list */
768
.message-list {
769
width: 420px; }
770
771
.message-list-sections {
772
spacing: 1.5em; }
773
774
.message-list-section,
775
.message-list-section-list {
776
spacing: 0.7em; }
777
778
.message-list-section-title-box {
779
spacing: 0.4em; }
780
781
.message-list-section-close > StIcon {
782
icon-size: 16px;
783
border-radius: 16px;
784
padding: 8px;
785
color: rgba(0, 0, 0, 0.64);
786
background-color: transparent; }
787
788
/* FIXME: how do you do this in sass? */
789
.message-list-section-close:hover > StIcon,
790
.message-list-section-close:focus > StIcon {
791
color: rgba(0, 0, 0, 0.8);
792
background-color: rgba(0, 0, 0, 0.08); }
793
794
.message-list-section-close:active > StIcon {
795
color: rgba(0, 0, 0, 0.8);
796
background-color: rgba(0, 0, 0, 0.16); }
797
798
.message {
799
background-color: transparent;
800
border-radius: 2px; }
801
.message:hover, .message:focus {
802
background-color: rgba(0, 0, 0, 0.08); }
803
.message:active {
804
background-color: rgba(0, 0, 0, 0.16); }
805
806
.message-icon-bin {
807
padding: 8px 0px 8px 8px; }
808
.message-icon-bin:rtl {
809
padding: 8px 8px 8px 0px; }
810
811
.message-icon-bin > StIcon {
812
icon-size: 32px; }
813
814
.message-secondary-bin {
815
color: rgba(0, 0, 0, 0.4); }
816
817
.message-secondary-bin > StIcon {
818
icon-size: 16px; }
819
820
.message-title {
821
font-weight: bold;
822
font-size: 1.1em; }
823
824
.message-content {
825
padding: 8px;
826
font-size: .9em; }
827
828
.message-content * > StIcon {
829
icon-size: 16px;
830
border-radius: 16px;
831
padding: 2px;
832
color: rgba(0, 0, 0, 0.64); }
833
834
/* FIXME: how do you do this in sass? */
835
.message-content *:hover > StIcon,
836
.message-content *:focus > StIcon {
837
color: rgba(0, 0, 0, 0.8);
838
background-color: rgba(0, 0, 0, 0.08); }
839
840
.message-content *:active > StIcon {
841
color: rgba(0, 0, 0, 0.8);
842
background-color: rgba(0, 0, 0, 0.16); }
843
844
.system-switch-user-submenu-icon {
845
icon-size: 20px;
846
border: none; }
847
848
#appMenu {
849
spinner-image: url("process-working.svg");
850
spacing: 4px; }
851
#appMenu .label-shadow {
852
color: transparent; }
853
854
.aggregate-menu {
855
min-width: 280px; }
856
.aggregate-menu .popup-menu-icon {
857
padding: 0 4px; }
858
859
.system-menu-action {
860
color: rgba(0, 0, 0, 0.64);
861
border-radius: 32px;
862
/* wish we could do 50% */
863
padding: 16px;
864
border: none; }
865
.system-menu-action:hover, .system-menu-action:focus {
866
background-color: rgba(0, 0, 0, 0.08);
867
color: rgba(0, 0, 0, 0.8);
868
border: none;
869
padding: 16px; }
870
.system-menu-action:active {
871
background-color: rgba(0, 0, 0, 0.16);
872
color: rgba(0, 0, 0, 0.8); }
873
.system-menu-action > StIcon {
874
icon-size: 16px; }
875
876
.ripple-box {
877
width: 52px;
878
height: 52px;
879
background-image: url("corner-ripple-ltr.svg");
880
background-size: contain; }
881
882
.ripple-box:rtl {
883
background-image: url("corner-ripple-rtl.svg"); }
884
885
.popup-menu-arrow {
886
width: 16px;
887
height: 16px; }
888
889
.popup-menu-icon {
890
icon-size: 1.09em; }
891
892
.window-close {
893
height: 32px;
894
width: 32px;
895
-st-background-image-shadow: 0 1px 3px rgba(0, 0, 0, 0.24), 0 1px 2px rgba(0, 0, 0, 0.48);
896
background-image: url("window-close.svg");
897
background-size: 32px; }
898
.window-close:hover {
899
-st-background-image-shadow: 0 3px 6px rgba(0, 0, 0, 0.32), 0 3px 6px rgba(0, 0, 0, 0.46); }
900
.window-close:active {
901
background-image: url("window-close-active.svg"); }
902
903
.window-close {
904
-shell-close-overlap: 16px; }
905
.window-close:rtl {
906
-st-background-image-shadow: 0 1px 3px rgba(0, 0, 0, 0.24), 0 1px 2px rgba(0, 0, 0, 0.48); }
907
.window-close:rtl:hover {
908
-st-background-image-shadow: 0 3px 6px rgba(0, 0, 0, 0.32), 0 3px 6px rgba(0, 0, 0, 0.46); }
909
910
/* NETWORK DIALOGS */
911
.nm-dialog {
912
max-height: 500px;
913
min-height: 450px;
914
min-width: 470px; }
915
916
.nm-dialog-content {
917
spacing: 20px; }
918
919
.nm-dialog-header-hbox {
920
spacing: 10px; }
921
922
.nm-dialog-airplane-box {
923
spacing: 12px; }
924
925
.nm-dialog-airplane-headline {
926
font-weight: bold;
927
text-align: center; }
928
929
.nm-dialog-airplane-text {
930
color: rgba(0, 0, 0, 0.8); }
931
932
.nm-dialog-header-icon {
933
icon-size: 32px; }
934
935
.nm-dialog-scroll-view {
936
border: 2px solid rgba(0, 0, 0, 0.1); }
937
938
.nm-dialog-header {
939
font-weight: bold; }
940
941
.nm-dialog-item {
942
font-size: 110%;
943
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
944
padding: 12px;
945
spacing: 20px; }
946
947
.nm-dialog-item:selected {
948
background-color: #3498db;
949
color: white; }
950
951
.nm-dialog-icons {
952
spacing: .5em; }
953
954
.nm-dialog-icon {
955
icon-size: 16px; }
956
957
.no-networks-label {
958
color: rgba(0, 0, 0, 0.4); }
959
960
.no-networks-box {
961
spacing: 12px; }
962
963
/* OVERVIEW */
964
#overview {
965
spacing: 24px; }
966
967
.overview-controls {
968
padding-bottom: 32px; }
969
970
.window-picker {
971
-horizontal-spacing: 32px;
972
-vertical-spacing: 32px;
973
padding-left: 32px;
974
padding-right: 32px;
975
padding-bottom: 48px; }
976
.window-picker.external-monitor {
977
padding: 32px; }
978
979
.window-clone-border {
980
border: 4px solid rgba(255, 255, 255, 0.4);
981
border-radius: 2px;
982
box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.4); }
983
984
.window-caption {
985
spacing: 25px;
986
color: white;
987
background-color: transparent;
988
border-radius: 2px;
989
padding: 4px 8px;
990
-shell-caption-spacing: 12px; }
991
.window-caption:hover {
992
background-color: rgba(255, 255, 255, 0.4);
993
color: white; }
994
995
.search-entry {
996
width: 320px;
997
padding: 7px 8px 8px;
998
border-radius: 0;
999
color: rgba(255, 255, 255, 0.5);
1000
selection-background-color: rgba(255, 255, 255, 0.4);
1001
selected-color: white;
1002
background-color: rgba(0, 0, 0, 0.01);
1003
border-color: transparent;
1004
box-shadow: inset 0 -1px rgba(255, 255, 255, 0.2); }
1005
.search-entry:focus {
1006
border-color: transparent;
1007
box-shadow: inset 0 -2px rgba(255, 255, 255, 0.8);
1008
padding: 7px 8px 8px;
1009
border-width: 0;
1010
color: white; }
1011
.search-entry .search-entry-icon {
1012
icon-size: 1.09em;
1013
padding: 0 2px;
1014
color: rgba(255, 255, 255, 0.5); }
1015
.search-entry:hover .search-entry-icon, .search-entry:focus .search-entry-icon {
1016
color: white; }
1017
1018
#searchResultsBin {
1019
max-width: 1000px; }
1020
1021
#searchResultsContent {
1022
padding-left: 20px;
1023
padding-right: 20px;
1024
spacing: 16px; }
1025
1026
.search-section {
1027
spacing: 16px; }
1028
1029
.search-section-content {
1030
spacing: 32px; }
1031
1032
.list-search-results {
1033
spacing: 3px; }
1034
1035
.search-section-separator {
1036
-gradient-height: 1px;
1037
-gradient-start: rgba(255, 255, 255, 0);
1038
-gradient-end: rgba(255, 255, 255, 0.4);
1039
-margin-horizontal: 1.5em;
1040
height: 1px; }
1041
1042
.list-search-result-content {
1043
spacing: 12px;
1044
padding: 12px; }
1045
1046
.list-search-result-title {
1047
font-size: 1.5em;
1048
color: white; }
1049
1050
.list-search-result-description {
1051
color: rgba(255, 255, 255, 0.8); }
1052
1053
.search-provider-icon {
1054
padding: 15px; }
1055
1056
.search-provider-icon-more {
1057
width: 16px;
1058
height: 16px;
1059
background-image: url("more-results.svg"); }
1060
1061
/* DASHBOARD */
1062
#dash {
1063
font-size: 9pt;
1064
color: white;
1065
background-color: rgba(255, 255, 255, 0.1);
1066
padding: 4px 0;
1067
border: none;
1068
border-left: 0px;
1069
border-radius: 0px 2px 2px 0px; }
1070
#dash:rtl {
1071
border-radius: 2px 0 0 2px; }
1072
#dash .placeholder {
1073
background-image: url("dash-placeholder.svg");
1074
background-size: contain;
1075
height: 24px; }
1076
#dash .empty-dash-drop-target {
1077
width: 24px;
1078
height: 24px; }
1079
1080
.dash-item-container > StWidget {
1081
padding: 4px 8px; }
1082
1083
.dash-label {
1084
border-radius: 2px;
1085
padding: 4px 12px;
1086
color: rgba(0, 0, 0, 0.8);
1087
background-color: rgba(255, 255, 255, 0.95);
1088
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.24), 0 3px 6px rgba(0, 0, 0, 0.345);
1089
text-align: center;
1090
-x-offset: 8px; }
1091
1092
/* Add Dash to Dock Support */
1093
#dashtodockContainer #dash {
1094
background-color: rgba(0, 0, 0, 0.5); }
1095
1096
#dashtodockContainer:overview #dash {
1097
background-color: rgba(255, 255, 255, 0.1); }
1098
1099
#dashtodockContainer.extended #dash {
1100
padding: 0;
1101
border-radius: 0; }
1102
1103
#dashtodockContainer.extended:overview #dash {
1104
background-color: transparent; }
1105
1106
#dashtodockContainer.extended .dash-item-container > StWidget {
1107
padding: 8px; }
1108
1109
#dashtodockContainer .app-well-app-running-dot {
1110
background-color: transparent; }
1111
1112
#dashtodockContainer .app-well-app .overview-icon {
1113
background-size: contain; }
1114
1115
#dashtodockContainer .app-well-app.running1 .overview-icon {
1116
background-image: url("running1.svg"); }
1117
1118
#dashtodockContainer .app-well-app.running1.focused .overview-icon {
1119
background-image: url("running1-focused.svg"); }
1120
1121
#dashtodockContainer .app-well-app.running2 .overview-icon {
1122
background-image: url("running2.svg"); }
1123
1124
#dashtodockContainer .app-well-app.running2.focused .overview-icon {
1125
background-image: url("running2-focused.svg"); }
1126
1127
#dashtodockContainer .app-well-app.running3 .overview-icon {
1128
background-image: url("running3.svg"); }
1129
1130
#dashtodockContainer .app-well-app.running3.focused .overview-icon {
1131
background-image: url("running3-focused.svg"); }
1132
1133
#dashtodockContainer .app-well-app.running4 .overview-icon {
1134
background-image: url("running4.svg"); }
1135
1136
#dashtodockContainer .app-well-app.running4.focused .overview-icon {
1137
background-image: url("running4-focused.svg"); }
1138
1139
/* Add Simple Dock Support */
1140
#dash:desktop {
1141
background-color: rgba(0, 0, 0, 0.5); }
1142
1143
/* App Vault/Grid */
1144
.icon-grid {
1145
spacing: 30px;
1146
-shell-grid-horizontal-item-size: 136px;
1147
-shell-grid-vertical-item-size: 136px; }
1148
.icon-grid .overview-icon {
1149
icon-size: 96px; }
1150
1151
.app-view-controls {
1152
width: 320px;
1153
padding-bottom: 32px; }
1154
1155
.app-view-control {
1156
padding: 7px 32px 8px;
1157
font-weight: bold;
1158
color: rgba(255, 255, 255, 0.8); }
1159
.app-view-control:hover {
1160
color: white;
1161
background-color: rgba(255, 255, 255, 0.2) !important; }
1162
.app-view-control:active {
1163
color: white;
1164
background-color: rgba(255, 255, 255, 0.4) !important; }
1165
.app-view-control:checked {
1166
color: white;
1167
background-color: rgba(0, 0, 0, 0.01) !important;
1168
box-shadow: inset 0 2px 0px rgba(255, 255, 255, 0.8); }
1169
.app-view-control:first-child {
1170
border-right-width: 0;
1171
border-radius: 2px; }
1172
.app-view-control:first-child:checked {
1173
border-radius: 0; }
1174
.app-view-control:last-child {
1175
border-radius: 2px; }
1176
.app-view-control:last-child:checked {
1177
border-radius: 0; }
1178
1179
.search-provider-icon:focus, .search-provider-icon:selected, .search-provider-icon:hover,
1180
.list-search-result:focus,
1181
.list-search-result:selected,
1182
.list-search-result:hover {
1183
background-color: rgba(255, 255, 255, 0.2);
1184
transition-duration: 0s; }
1185
.search-provider-icon:active, .search-provider-icon:checked,
1186
.list-search-result:active,
1187
.list-search-result:checked {
1188
background-color: rgba(255, 255, 255, 0.4);
1189
transition-duration: 0.2s; }
1190
1191
.app-well-app:hover .overview-icon, .app-well-app:focus .overview-icon, .app-well-app:selected .overview-icon,
1192
.app-well-app.app-folder:hover .overview-icon,
1193
.app-well-app.app-folder:focus .overview-icon,
1194
.app-well-app.app-folder:selected .overview-icon,
1195
.show-apps:hover .overview-icon,
1196
.show-apps:focus .overview-icon,
1197
.show-apps:selected .overview-icon,
1198
.grid-search-result:hover .overview-icon,
1199
.grid-search-result:focus .overview-icon,
1200
.grid-search-result:selected .overview-icon {
1201
background-color: rgba(255, 255, 255, 0.2);
1202
transition-duration: 0s;
1203
border-image: none;
1204
background-image: none; }
1205
.app-well-app:active .overview-icon, .app-well-app:checked .overview-icon,
1206
.app-well-app.app-folder:active .overview-icon,
1207
.app-well-app.app-folder:checked .overview-icon,
1208
.show-apps:active .overview-icon,
1209
.show-apps:checked .overview-icon,
1210
.grid-search-result:active .overview-icon,
1211
.grid-search-result:checked .overview-icon {
1212
background-color: rgba(255, 255, 255, 0.4);
1213
box-shadow: 0 0 transparent;
1214
transition-duration: 0.2s; }
1215
1216
.app-well-app-running-dot {
1217
width: 32px;
1218
height: 2px;
1219
background-color: rgba(255, 255, 255, 0.8);
1220
margin-bottom: 0; }
1221
1222
.search-provider-icon,
1223
.list-search-result, .app-well-app .overview-icon,
1224
.app-well-app.app-folder .overview-icon,
1225
.show-apps .overview-icon,
1226
.grid-search-result .overview-icon {
1227
color: white;
1228
border-radius: 2px;
1229
padding: 6px;
1230
border: none;
1231
transition-duration: 0.2s;
1232
text-align: center; }
1233
1234
.app-well-app.app-folder > .overview-icon {
1235
background-color: rgba(255, 255, 255, 0.1); }
1236
1237
.show-apps .show-apps-icon {
1238
color: rgba(255, 255, 255, 0.8); }
1239
1240
.show-apps:hover .show-apps-icon,
1241
.show-apps:active .show-apps-icon,
1242
.show-apps:checked .show-apps-icon,
1243
.show-apps:focus .show-apps-icon {
1244
color: white;
1245
transition-duration: 0.2s; }
1246
1247
.app-folder-popup {
1248
-arrow-border-radius: 2px;
1249
-arrow-background-color: rgba(255, 255, 255, 0.1);
1250
-arrow-base: 24px;
1251
-arrow-rise: 12px; }
1252
1253
.app-folder-popup-bin {
1254
padding: 5px; }
1255
1256
.app-folder-icon {
1257
padding: 5px;
1258
spacing-rows: 5px;
1259
spacing-columns: 5px; }
1260
1261
.page-indicator {
1262
padding: 15px 20px; }
1263
.page-indicator .page-indicator-icon {
1264
width: 12px;
1265
height: 12px;
1266
border-radius: 12px;
1267
background-image: none;
1268
background-color: rgba(255, 255, 255, 0.3); }
1269
.page-indicator:hover .page-indicator-icon {
1270
background-image: none;
1271
background-color: rgba(255, 255, 255, 0.4); }
1272
.page-indicator:active .page-indicator-icon {
1273
background-image: none;
1274
background-color: rgba(255, 255, 255, 0.5); }
1275
.page-indicator:checked .page-indicator-icon, .page-indicator:checked:active {
1276
background-image: none;
1277
background-color: white; }
1278
1279
.app-well-app > .overview-icon.overview-icon-with-label,
1280
.grid-search-result .overview-icon.overview-icon-with-label {
1281
padding: 10px 8px 5px 8px;
1282
spacing: 4px; }
1283
1284
.workspace-thumbnails {
1285
visible-width: 32px;
1286
spacing: 12px;
1287
padding: 12px;
1288
border-radius: 2px 0 0 2px; }
1289
.workspace-thumbnails:rtl {
1290
border-radius: 0 2px 2px 0; }
1291
1292
.workspace-thumbnail-indicator {
1293
border: 0 solid rgba(255, 255, 255, 0.8);
1294
border-left-width: 2px;
1295
padding: 6px;
1296
border-radius: 0; }
1297
1298
.search-display > StBoxLayout,
1299
.all-apps,
1300
.frequent-apps > StBoxLayout {
1301
padding: 0px 88px 10px 88px; }
1302
1303
.workspace-thumbnails {
1304
color: white;
1305
background-color: rgba(255, 255, 255, 0.1);
1306
border: none; }
1307
1308
.search-statustext, .no-frequent-applications-label {
1309
font-size: 2em;
1310
font-weight: bold;
1311
color: rgba(255, 255, 255, 0.5); }
1312
1313
/* Add Dash to Dock Support */
1314
#workspacestodockContainer .workspace-thumbnails {
1315
background-color: rgba(0, 0, 0, 0.5); }
1316
1317
#workspacestodockContainer:overview .workspace-thumbnails {
1318
background-color: rgba(255, 255, 255, 0.1); }
1319
1320
#workspacestodockContainer.fullheight:overview .workspace-thumbnails {
1321
background-color: transparent; }
1322
1323
#workspacestodockContainer.right .workspace-thumbnails {
1324
border-radius: 2px 0 0 2px; }
1325
1326
#workspacestodockContainer.left .workspace-thumbnails {
1327
border-radius: 0 2px 2px 0; }
1328
1329
/* NOTIFICATIONS & MESSAGE TRAY */
1330
.url-highlighter {
1331
link-color: #3498db; }
1332
1333
.notification-banner {
1334
font-size: 11pt;
1335
width: 34em;
1336
margin: 5px;
1337
border-radius: 2px;
1338
color: rgba(0, 0, 0, 0.8);
1339
background-color: rgba(255, 255, 255, 0.95);
1340
border: none;
1341
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.24), 0 3px 6px rgba(0, 0, 0, 0.345); }
1342
.notification-banner:hover {
1343
background-color: rgba(255, 255, 255, 0.95); }
1344
.notification-banner:focus {
1345
background-color: rgba(255, 255, 255, 0.95); }
1346
.notification-banner .notification-icon {
1347
padding: 5px; }
1348
.notification-banner .notification-content {
1349
padding: 5px;
1350
spacing: 5px; }
1351
.notification-banner .secondary-icon {
1352
icon-size: 1.09em; }
1353
.notification-banner .notification-actions {
1354
background-color: transparent;
1355
padding-top: 0;
1356
border-top: 1px solid rgba(0, 0, 0, 0.16);
1357
spacing: 1px; }
1358
.notification-banner .notification-button {
1359
padding: 9px 4px 10px;
1360
background-color: transparent;
1361
color: rgba(0, 0, 0, 0.64);
1362
font-weight: 500; }
1363
.notification-banner .notification-button:first-child {
1364
border-radius: 0 0 0 2px; }
1365
.notification-banner .notification-button:last-child {
1366
border-radius: 0 0 2px 0; }
1367
.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus {
1368
background-color: rgba(0, 0, 0, 0.08);
1369
color: rgba(0, 0, 0, 0.8); }
1370
.notification-banner .notification-button:active {
1371
background-color: rgba(0, 0, 0, 0.16);
1372
color: rgba(0, 0, 0, 0.8); }
1373
1374
.summary-source-counter {
1375
font-size: 10pt;
1376
font-weight: bold;
1377
height: 1.6em;
1378
width: 1.6em;
1379
-shell-counter-overlap-x: 3px;
1380
-shell-counter-overlap-y: 3px;
1381
background-color: #3498db;
1382
color: white;
1383
border: 2px solid white;
1384
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5);
1385
border-radius: 0.9em; }
1386
1387
.secondary-icon {
1388
icon-size: 1.09em; }
1389
1390
.chat-body {
1391
spacing: 5px; }
1392
1393
.chat-response {
1394
margin: 5px; }
1395
1396
.chat-log-message {
1397
color: rgba(0, 0, 0, 0.8); }
1398
1399
.chat-new-group {
1400
padding-top: 1em; }
1401
1402
.chat-received {
1403
padding-left: 4px; }
1404
.chat-received:rtl {
1405
padding-left: 0px;
1406
padding-right: 4px; }
1407
1408
.chat-sent {
1409
padding-left: 18pt;
1410
color: rgba(0, 0, 0, 0.6); }
1411
.chat-sent:rtl {
1412
padding-left: 0;
1413
padding-right: 18pt; }
1414
1415
.chat-meta-message {
1416
padding-left: 4px;
1417
font-size: 9pt;
1418
font-weight: bold;
1419
color: rgba(0, 0, 0, 0.4); }
1420
.chat-meta-message:rtl {
1421
padding-left: 0;
1422
padding-right: 4px; }
1423
1424
.hotplug-transient-box {
1425
spacing: 6px;
1426
padding: 2px 72px 2px 12px; }
1427
1428
.hotplug-notification-item {
1429
padding: 2px 10px; }
1430
.hotplug-notification-item:focus {
1431
padding: 1px 71px 1px 11px; }
1432
1433
.hotplug-notification-item-icon {
1434
icon-size: 24px;
1435
padding: 2px 5px; }
1436
1437
.hotplug-resident-box {
1438
spacing: 8px; }
1439
1440
.hotplug-resident-mount {
1441
spacing: 8px;
1442
border-radius: 2px; }
1443
.hotplug-resident-mount:hover {
1444
background-color: rgba(0, 0, 0, 0.08); }
1445
.hotplug-resident-mount:active {
1446
background-color: rgba(0, 0, 0, 0.16); }
1447
1448
.hotplug-resident-mount-label {
1449
color: inherit;
1450
padding-left: 6px; }
1451
1452
.hotplug-resident-mount-icon {
1453
icon-size: 24px;
1454
padding-left: 6px; }
1455
1456
.hotplug-resident-eject-icon {
1457
icon-size: 16px; }
1458
1459
.hotplug-resident-eject-button {
1460
padding: 7px;
1461
border-radius: 2px;
1462
color: rgba(0, 0, 0, 0.8); }
1463
1464
/* Eeeky things */
1465
.legacy-tray {
1466
background-color: rgba(255, 255, 255, 0.95);
1467
border: none;
1468
border-bottom-width: 0;
1469
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.24), 0 3px 6px rgba(0, 0, 0, 0.345); }
1470
.legacy-tray:ltr {
1471
border-radius: 0 2px 0 0;
1472
border-left-width: 0; }
1473
.legacy-tray:rtl {
1474
border-radius: 2px 0 0 0;
1475
border-right-width: 0; }
1476
1477
.legacy-tray-handle,
1478
.legacy-tray-icon {
1479
padding: 6px; }
1480
.legacy-tray-handle StIcon,
1481
.legacy-tray-icon StIcon {
1482
icon-size: 24px; }
1483
.legacy-tray-handle:hover, .legacy-tray-handle:focus,
1484
.legacy-tray-icon:hover,
1485
.legacy-tray-icon:focus {
1486
background-color: rgba(0, 0, 0, 0.08); }
1487
.legacy-tray-handle:active,
1488
.legacy-tray-icon:active {
1489
background-color: rgba(0, 0, 0, 0.16); }
1490
1491
.legacy-tray-icon-box {
1492
spacing: 12px; }
1493
.legacy-tray-icon-box:ltr {
1494
padding-left: 12px; }
1495
.legacy-tray-icon-box:rtl {
1496
padding-right: 12px; }
1497
.legacy-tray-icon-box StButton {
1498
width: 24px;
1499
height: 24px; }
1500
1501
.magnifier-zoom-region {
1502
border: 2px solid #3498db; }
1503
.magnifier-zoom-region.full-screen {
1504
border-width: 0; }
1505
1506
/* On-screen Keyboard */
1507
#keyboard {
1508
background-color: rgba(0, 0, 0, 0.2); }
1509
1510
.keyboard-layout {
1511
spacing: 10px;
1512
padding: 10px; }
1513
1514
.keyboard-row {
1515
spacing: 15px; }
1516
1517
.keyboard-key {
1518
min-height: 2em;
1519
min-width: 2em;
1520
font-size: 2em;
1521
font-weight: bold;
1522
border-radius: 2px;
1523
border: none;
1524
color: inherit;
1525
color: rgba(0, 0, 0, 0.64);
1526
background-color: rgba(255, 255, 255, 0.95);
1527
border-color: transparent;
1528
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1529
text-shadow: none;
1530
icon-shadow: none; }
1531
.keyboard-key:focus {
1532
color: rgba(0, 0, 0, 0.8);
1533
text-shadow: none;
1534
icon-shadow: none;
1535
border-color: transparent;
1536
box-shadow: 0 0 transparent; }
1537
.keyboard-key:hover, .keyboard-key:checked {
1538
color: rgba(0, 0, 0, 0.8);
1539
background-color: rgba(255, 255, 255, 0.95);
1540
border-color: transparent;
1541
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.24), 0 3px 6px rgba(0, 0, 0, 0.345);
1542
text-shadow: none;
1543
icon-shadow: none; }
1544
.keyboard-key:active {
1545
color: rgba(0, 0, 0, 0.8);
1546
background-color: rgba(215, 215, 215, 0.92);
1547
border-color: transparent;
1548
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.24), 0 3px 6px rgba(0, 0, 0, 0.345);
1549
text-shadow: none;
1550
icon-shadow: none; }
1551
.keyboard-key:grayed {
1552
background-color: rgba(0, 0, 0, 0.5);
1553
color: white;
1554
border-color: rgba(0, 0, 0, 0.7); }
1555
1556
.keyboard-subkeys {
1557
color: inherit;
1558
padding: 5px;
1559
-arrow-border-radius: 0;
1560
-arrow-background-color: transparent;
1561
-arrow-border-width: 0;
1562
-arrow-border-color: transparent;
1563
-arrow-base: 0;
1564
-arrow-rise: 0;
1565
-boxpointer-gap: 5px;
1566
background-color: rgba(255, 255, 255, 0.95);
1567
border-radius: 2px;
1568
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.24), 0 3px 6px rgba(0, 0, 0, 0.345); }
1569
1570
.candidate-popup-content {
1571
padding: 0.5em;
1572
spacing: 0.3em; }
1573
1574
.candidate-index {
1575
padding: 0 0.5em 0 0;
1576
color: rgba(0, 0, 0, 0.4); }
1577
1578
.candidate-box {
1579
transition-duration: 0s;
1580
padding: 0.3em 0.5em 0.3em 0.5em;
1581
border-radius: 2px; }
1582
.candidate-box:hover {
1583
background-color: rgba(0, 0, 0, 0.08);
1584
color: rgba(0, 0, 0, 0.8); }
1585
.candidate-box:active {
1586
background-color: rgba(0, 0, 0, 0.16);
1587
color: rgba(0, 0, 0, 0.8); }
1588
.candidate-box:selected {
1589
background-color: #3498db;
1590
color: white; }
1591
1592
.candidate-page-button-box {
1593
height: 2em; }
1594
.vertical .candidate-page-button-box {
1595
padding-top: 0.5em; }
1596
.horizontal .candidate-page-button-box {
1597
padding-left: 0.5em; }
1598
1599
.candidate-page-button {
1600
padding: 4px; }
1601
1602
.candidate-page-button-previous {
1603
border-radius: 2px;
1604
border-right-width: 0; }
1605
1606
.candidate-page-button-next {
1607
border-radius: 2px; }
1608
1609
.candidate-page-button-icon {
1610
icon-size: 1.09em; }
1611
1612
/* Auth Dialogs & Screen Shield */
1613
.framed-user-icon {
1614
background-size: contain;
1615
border: none;
1616
color: white;
1617
border-radius: 2px; }
1618
.framed-user-icon:hover {
1619
border-color: white;
1620
color: white; }
1621
1622
.login-dialog-banner-view {
1623
padding-top: 24px;
1624
max-width: 23em; }
1625
1626
.login-dialog {
1627
border: none;
1628
background-color: transparent; }
1629
.login-dialog StEntry {
1630
color: white;
1631
selection-background-color: rgba(255, 255, 255, 0.4);
1632
selected-color: white;
1633
background-color: rgba(0, 0, 0, 0.01);
1634
border-color: transparent;
1635
box-shadow: inset 0 -1px rgba(255, 255, 255, 0.2); }
1636
.login-dialog StEntry:focus {
1637
border-color: transparent;
1638
box-shadow: inset 0 -2px rgba(255, 255, 255, 0.8); }
1639
.login-dialog StEntry:insensitive {
1640
color: rgba(0, 0, 0, 0.32);
1641
border-color: transparent;
1642
box-shadow: inset 0 -1px rgba(255, 255, 255, 0.16);
1643
color: rgba(255, 255, 255, 0.4); }
1644
.login-dialog .modal-dialog-button-box {
1645
spacing: 3px; }
1646
.login-dialog .modal-dialog-button {
1647
padding: 7px 16px 8px;
1648
color: rgba(255, 255, 255, 0.8);
1649
background-color: transparent;
1650
border-color: transparent;
1651
box-shadow: 0 0 transparent;
1652
text-shadow: none;
1653
icon-shadow: none; }
1654
.login-dialog .modal-dialog-button:hover, .login-dialog .modal-dialog-button:focus {
1655
color: white;
1656
background-color: rgba(255, 255, 255, 0.2);
1657
border-color: transparent;
1658
box-shadow: 0 0 transparent;
1659
text-shadow: none;
1660
icon-shadow: none; }
1661
.login-dialog .modal-dialog-button:active {
1662
color: white;
1663
background-color: rgba(255, 255, 255, 0.4);
1664
border-color: transparent;
1665
box-shadow: 0 0 transparent;
1666
text-shadow: none;
1667
icon-shadow: none; }
1668
.login-dialog .modal-dialog-button:insensitive {
1669
color: rgba(255, 255, 255, 0.32);
1670
background-color: transparent;
1671
border-color: transparent;
1672
box-shadow: 0 0 transparent;
1673
text-shadow: none;
1674
icon-shadow: none; }
1675
.login-dialog .modal-dialog-button:default {
1676
color: white;
1677
background-color: #3498db;
1678
border-color: transparent;
1679
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1680
text-shadow: none;
1681
icon-shadow: none; }
1682
.login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus {
1683
color: white;
1684
background-color: #3498db;
1685
border-color: transparent;
1686
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.24), 0 3px 6px rgba(0, 0, 0, 0.345);
1687
text-shadow: none;
1688
icon-shadow: none; }
1689
.login-dialog .modal-dialog-button:default:active {
1690
color: white;
1691
background-color: #5dade2;
1692
border-color: transparent;
1693
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.24), 0 3px 6px rgba(0, 0, 0, 0.345);
1694
text-shadow: none;
1695
icon-shadow: none; }
1696
.login-dialog .modal-dialog-button:default:insensitive {
1697
color: rgba(255, 255, 255, 0.4);
1698
background-color: rgba(255, 255, 255, 0.16);
1699
border-color: transparent;
1700
box-shadow: 0 0 transparent;
1701
text-shadow: none;
1702
icon-shadow: none; }
1703
1704
.login-dialog-logo-bin {
1705
padding: 24px 0px; }
1706
1707
.login-dialog-banner {
1708
color: rgba(255, 255, 255, 0.8); }
1709
1710
.login-dialog-button-box {
1711
spacing: 5px; }
1712
1713
.login-dialog-message-warning {
1714
color: #e67e22; }
1715
1716
.login-dialog-message-hint {
1717
padding-top: 0;
1718
padding-bottom: 20px; }
1719
1720
.login-dialog-user-selection-box {
1721
padding: 100px 0px; }
1722
.login-dialog-user-selection-box .login-dialog-not-listed-label {
1723
padding-left: 2px; }
1724
.login-dialog-not-listed-button:focus .login-dialog-user-selection-box .login-dialog-not-listed-label, .login-dialog-not-listed-button:hover .login-dialog-user-selection-box .login-dialog-not-listed-label {
1725
color: white; }
1726
1727
.login-dialog-not-listed-label {
1728
font-size: 90%;
1729
font-weight: bold;
1730
color: rgba(255, 255, 255, 0.8);
1731
padding-top: 1em; }
1732
.login-dialog-not-listed-label:hover {
1733
color: white; }
1734
.login-dialog-not-listed-label:focus {
1735
background-color: rgba(255, 255, 255, 0.2); }
1736
1737
.login-dialog-user-list-view {
1738
-st-vfade-offset: 1em; }
1739
1740
.login-dialog-user-list {
1741
spacing: 12px;
1742
padding: .2em;
1743
width: 23em; }
1744
.login-dialog-user-list:expanded .login-dialog-user-list-item:focus {
1745
background-color: rgba(255, 255, 255, 0.2);
1746
color: white; }
1747
.login-dialog-user-list:expanded .login-dialog-user-list-item:hover {
1748
background-color: rgba(255, 255, 255, 0.2);
1749
color: white; }
1750
.login-dialog-user-list:expanded .login-dialog-user-list-item:active {
1751
background-color: rgba(255, 255, 255, 0.4);
1752
color: white; }
1753
.login-dialog-user-list:expanded .login-dialog-user-list-item:logged-in {
1754
border-right: 2px solid rgba(255, 255, 255, 0.8); }
1755
1756
.login-dialog-user-list-item {
1757
border-radius: 2px;
1758
padding: .2em;
1759
color: rgba(255, 255, 255, 0.8); }
1760
.login-dialog-user-list-item:ltr {
1761
padding-right: 1em; }
1762
.login-dialog-user-list-item:rtl {
1763
padding-left: 1em; }
1764
.login-dialog-user-list-item:hover {
1765
background-color: rgba(255, 255, 255, 0.2);
1766
color: white; }
1767
.login-dialog-user-list-item:active {
1768
background-color: rgba(255, 255, 255, 0.4);
1769
color: white; }
1770
.login-dialog-user-list-item .login-dialog-timed-login-indicator {
1771
height: 2px;
1772
margin: 2px 0 0 0;
1773
background-color: white; }
1774
.login-dialog-user-list-item:focus .login-dialog-timed-login-indicator {
1775
background-color: white; }
1776
1777
.login-dialog-username,
1778
.user-widget-label {
1779
color: white;
1780
font-size: 120%;
1781
font-weight: bold;
1782
text-align: left;
1783
padding-left: 15px; }
1784
1785
.user-widget-label:ltr {
1786
padding-left: 18px; }
1787
.user-widget-label:rtl {
1788
padding-right: 18px; }
1789
1790
.login-dialog-prompt-layout {
1791
padding-top: 24px;
1792
padding-bottom: 12px;
1793
spacing: 8px;
1794
width: 23em; }
1795
1796
.login-dialog-prompt-label {
1797
color: rgba(255, 255, 255, 0.5);
1798
font-size: 1em;
1799
padding-top: 1em; }
1800
1801
.login-dialog-session-list-button StIcon {
1802
icon-size: 1.25em; }
1803
1804
.login-dialog-session-list-button {
1805
color: rgba(255, 255, 255, 0.8); }
1806
.login-dialog-session-list-button:hover, .login-dialog-session-list-button:focus {
1807
color: white; }
1808
.login-dialog-session-list-button:active {
1809
color: white; }
1810
1811
.screen-shield-arrows {
1812
padding-bottom: 3em; }
1813
1814
.screen-shield-arrows Gjs_Arrow {
1815
color: white;
1816
width: 80px;
1817
height: 48px;
1818
-arrow-thickness: 12px;
1819
-arrow-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1820
1821
.screen-shield-clock {
1822
color: white;
1823
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1824
font-weight: normal;
1825
text-align: center;
1826
padding-bottom: 1.5em; }
1827
1828
.screen-shield-clock-time {
1829
font-size: 112px;
1830
font-weight: 300;
1831
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1832
1833
.screen-shield-clock-date {
1834
font-size: 45px; }
1835
1836
.screen-shield-notifications-container {
1837
spacing: 6px;
1838
width: 30em;
1839
background-color: transparent;
1840
max-height: 500px; }
1841
.screen-shield-notifications-container .summary-notification-stack-scrollview {
1842
padding-top: 0;
1843
padding-bottom: 0; }
1844
.screen-shield-notifications-container .notification,
1845
.screen-shield-notifications-container .screen-shield-notification-source {
1846
padding: 12px 6px;
1847
border: none;
1848
background-color: rgba(0, 0, 0, 0.5);
1849
color: white;
1850
border-radius: 2px; }
1851
.screen-shield-notifications-container .notification {
1852
margin-right: 15px; }
1853
1854
.screen-shield-notification-label {
1855
font-weight: bold;
1856
padding: 0px 0px 0px 12px; }
1857
1858
.screen-shield-notification-count-text {
1859
padding: 0px 0px 0px 12px; }
1860
1861
#panel.lock-screen {
1862
background-color: rgba(0, 0, 0, 0.5); }
1863
1864
.screen-shield-background {
1865
background: black;
1866
box-shadow: 0 19px 38px rgba(0, 0, 0, 0.45), 0 15px 12px rgba(0, 0, 0, 0.33); }
1867
1868
#lockDialogGroup {
1869
background: #333333 url(noise-texture.png);
1870
background-repeat: repeat; }
1871
1872
#screenShieldNotifications StButton#vhandle, #screenShieldNotifications StButton#hhandle {
1873
background-color: rgba(255, 255, 255, 0.6); }
1874
#screenShieldNotifications StButton#vhandle:hover, #screenShieldNotifications StButton#vhandle:focus, #screenShieldNotifications StButton#hhandle:hover, #screenShieldNotifications StButton#hhandle:focus {
1875
background-color: rgba(255, 255, 255, 0.8); }
1876
#screenShieldNotifications StButton#vhandle:active, #screenShieldNotifications StButton#hhandle:active {
1877
background-color: white; }
1878
1879
#LookingGlassDialog {
1880
background-color: rgba(255, 255, 255, 0.95);
1881
spacing: 4px;
1882
padding: 0;
1883
border: none;
1884
border-radius: 2px;
1885
box-shadow: 0 14px 28px rgba(0, 0, 0, 0.375), 0 10px 10px rgba(0, 0, 0, 0.33); }
1886
#LookingGlassDialog > #Toolbar {
1887
padding: 0 8px;
1888
border: none;
1889
border-radius: 0;
1890
background-color: rgba(0, 0, 0, 0.01);
1891
box-shadow: inset 0 -1px 0px rgba(0, 0, 0, 0.1); }
1892
#LookingGlassDialog .labels {
1893
spacing: 0; }
1894
#LookingGlassDialog .notebook-tab {
1895
-natural-hpadding: 12px;
1896
-minimum-hpadding: 6px;
1897
font-weight: bold;
1898
color: rgba(0, 0, 0, 0.4);
1899
transition-duration: 0.2s;
1900
padding-left: .3em;
1901
padding-right: .3em;
1902
padding: 7px 32px 8px; }
1903
#LookingGlassDialog .notebook-tab:hover {
1904
color: rgba(0, 0, 0, 0.8);
1905
text-shadow: none; }
1906
#LookingGlassDialog .notebook-tab:selected {
1907
border-bottom-width: 0;
1908
border-color: transparent;
1909
background-color: rgba(0, 0, 0, 0.01);
1910
box-shadow: inset 0 -2px 0px #3498db;
1911
color: rgba(0, 0, 0, 0.8);
1912
text-shadow: none; }
1913
#LookingGlassDialog StBoxLayout#EvalBox {
1914
padding: 4px;
1915
spacing: 4px; }
1916
#LookingGlassDialog StBoxLayout#ResultsArea {
1917
spacing: 4px; }
1918
1919
.lg-dialog StEntry {
1920
selection-background-color: #3498db;
1921
selected-color: white; }
1922
.lg-dialog .shell-link {
1923
color: #3498db; }
1924
.lg-dialog .shell-link:hover {
1925
color: #3498db; }
1926
1927
.lg-completions-text {
1928
font-size: .9em;
1929
font-style: italic; }
1930
1931
.lg-obj-inspector-title {
1932
spacing: 4px; }
1933
1934
.lg-obj-inspector-button {
1935
border: 1px solid gray;
1936
padding: 4px;
1937
border-radius: 2px; }
1938
.lg-obj-inspector-button:hover {
1939
border: 1px solid #ffffff; }
1940
1941
#lookingGlassExtensions {
1942
padding: 4px; }
1943
1944
.lg-extensions-list {
1945
padding: 4px;
1946
spacing: 6px; }
1947
1948
.lg-extension {
1949
border: none;
1950
border-radius: 2px;
1951
padding: 4px; }
1952
1953
.lg-extension-name {
1954
font-weight: bold;
1955
font-size: 1.5em; }
1956
1957
.lg-extension-meta {
1958
spacing: 6px; }
1959
1960
#LookingGlassPropertyInspector {
1961
background: rgba(255, 255, 255, 0.95);
1962
border: none;
1963
border-radius: 2px;
1964
padding: 6px;
1965
box-shadow: 0 14px 28px rgba(0, 0, 0, 0.375), 0 10px 10px rgba(0, 0, 0, 0.33); }
1966