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