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-compact.css

View raw Download
text/plain • 73.31 kiB
ASCII text, with very long lines (501)
        
            
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
/* GLOBALS */
21
stage {
22
font-family: "M+ 1c", Roboto, Cantarell, Sans-Serif;
23
font-size: 10.5pt;
24
font-weight: 400;
25
color: rgba(0, 0, 0, 0.87);
26
}
27
28
/* WIDGETS */
29
/* Buttons */
30
.button, .modal-dialog .button, .prompt-dialog .button, .audio-device-selection-dialog .button, .access-dialog .button, .geolocation-dialog .button, .extension-dialog .button, .inhibit-shortcuts-dialog .button, .nm-dialog .button, .message-list-clear-button.button {
31
min-height: 32px;
32
min-width: 48px;
33
padding: 0 8px;
34
border-width: 0;
35
border-radius: 4px;
36
font-size: 10.5pt;
37
font-weight: 500;
38
color: #1A73E8;
39
background-color: transparent;
40
border-color: transparent;
41
box-shadow: 0 0 transparent;
42
text-shadow: none;
43
icon-shadow: none;
44
transition-duration: 100ms;
45
}
46
47
.button:focus, .modal-dialog .button:focus, .prompt-dialog .button:focus, .audio-device-selection-dialog .button:focus, .access-dialog .button:focus, .geolocation-dialog .button:focus, .extension-dialog .button:focus, .inhibit-shortcuts-dialog .button:focus, .nm-dialog .button:focus, .message-list-clear-button.button:focus {
48
color: #1A73E8;
49
background-color: rgba(26, 115, 232, 0.12);
50
text-shadow: none;
51
icon-shadow: none;
52
box-shadow: 0 0 transparent;
53
}
54
55
.button:hover, .modal-dialog .button:hover, .prompt-dialog .button:hover, .audio-device-selection-dialog .button:hover, .access-dialog .button:hover, .geolocation-dialog .button:hover, .extension-dialog .button:hover, .inhibit-shortcuts-dialog .button:hover, .nm-dialog .button:hover, .message-list-clear-button.button:hover {
56
color: #1A73E8;
57
background-color: rgba(26, 115, 232, 0.08);
58
border-color: transparent;
59
box-shadow: 0 0 transparent;
60
text-shadow: none;
61
icon-shadow: none;
62
}
63
64
.button:active, .modal-dialog .button:active, .prompt-dialog .button:active, .audio-device-selection-dialog .button:active, .access-dialog .button:active, .geolocation-dialog .button:active, .extension-dialog .button:active, .inhibit-shortcuts-dialog .button:active, .nm-dialog .button:active, .message-list-clear-button.button:active {
65
color: #1A73E8;
66
background-color: rgba(26, 115, 232, 0.2);
67
border-color: transparent;
68
box-shadow: 0 0 transparent;
69
text-shadow: none;
70
icon-shadow: none;
71
transition-duration: 200ms;
72
}
73
74
.button:insensitive, .modal-dialog .button:insensitive, .prompt-dialog .button:insensitive, .audio-device-selection-dialog .button:insensitive, .access-dialog .button:insensitive, .geolocation-dialog .button:insensitive, .extension-dialog .button:insensitive, .inhibit-shortcuts-dialog .button:insensitive, .nm-dialog .button:insensitive, .message-list-clear-button.button:insensitive {
75
color: rgba(0, 0, 0, 0.26);
76
background-color: transparent;
77
border-color: transparent;
78
box-shadow: 0 0 transparent;
79
text-shadow: none;
80
icon-shadow: none;
81
}
82
83
.modal-dialog-linked-button, .notification-banner .notification-button, .hotplug-notification-item {
84
min-height: 32px;
85
min-width: 48px;
86
margin: 4px;
87
margin-right: 0;
88
padding: 0 8px;
89
border-top: 0;
90
border-right-width: 0;
91
border-radius: 4px;
92
font-size: 10.5pt;
93
font-weight: 500;
94
color: #1A73E8;
95
background-color: transparent;
96
border-color: transparent;
97
box-shadow: 0 0 transparent;
98
text-shadow: none;
99
icon-shadow: none;
100
transition-duration: 100ms;
101
}
102
103
.modal-dialog-linked-button:focus, .notification-banner .notification-button:focus, .hotplug-notification-item:focus {
104
color: #1A73E8;
105
background-color: rgba(26, 115, 232, 0.12);
106
text-shadow: none;
107
icon-shadow: none;
108
box-shadow: 0 0 transparent;
109
}
110
111
.modal-dialog-linked-button:hover, .notification-banner .notification-button:hover, .hotplug-notification-item:hover {
112
color: #1A73E8;
113
background-color: rgba(26, 115, 232, 0.08);
114
border-color: transparent;
115
box-shadow: 0 0 transparent;
116
text-shadow: none;
117
icon-shadow: none;
118
}
119
120
.modal-dialog-linked-button:active, .notification-banner .notification-button:active, .hotplug-notification-item:active {
121
color: #1A73E8;
122
background-color: rgba(26, 115, 232, 0.2);
123
border-color: transparent;
124
box-shadow: 0 0 transparent;
125
text-shadow: none;
126
icon-shadow: none;
127
transition-duration: 200ms;
128
}
129
130
.modal-dialog-linked-button:insensitive, .notification-banner .notification-button:insensitive, .hotplug-notification-item:insensitive {
131
color: rgba(0, 0, 0, 0.26);
132
background-color: transparent;
133
border-color: transparent;
134
box-shadow: 0 0 transparent;
135
text-shadow: none;
136
icon-shadow: none;
137
}
138
139
.modal-dialog-linked-button:first-child, .notification-banner .notification-button:first-child, .hotplug-notification-item:first-child {
140
border-radius: 4px;
141
}
142
143
.modal-dialog-linked-button:last-child, .notification-banner .notification-button:last-child, .hotplug-notification-item:last-child {
144
margin-right: 4px;
145
border-right-width: 0px;
146
border-radius: 4px;
147
}
148
149
.modal-dialog-linked-button:first-child:last-child, .notification-banner .notification-button:first-child:last-child, .hotplug-notification-item:first-child:last-child {
150
margin-right: 4px;
151
border-right-width: 0px;
152
border-radius: 4px;
153
}
154
155
/* Entries */
156
StEntry, .modal-dialog StEntry, .prompt-dialog StEntry, .audio-device-selection-dialog StEntry, .access-dialog StEntry, .geolocation-dialog StEntry, .extension-dialog StEntry, .inhibit-shortcuts-dialog StEntry, .nm-dialog StEntry, .notification-banner StEntry {
157
min-height: 32px;
158
padding: 0 8px;
159
border-radius: 4px 4px 0 0;
160
border-width: 0;
161
color: rgba(0, 0, 0, 0.87);
162
selection-background-color: rgba(26, 115, 232, 0.24);
163
selected-color: rgba(0, 0, 0, 0.87);
164
font-size: 11.25pt;
165
font-weight: 400;
166
transition-duration: 100ms;
167
background-color: rgba(0, 0, 0, 0.04);
168
border-color: transparent;
169
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.26);
170
}
171
172
StEntry:hover, .modal-dialog StEntry:hover, .prompt-dialog StEntry:hover, .audio-device-selection-dialog StEntry:hover, .access-dialog StEntry:hover, .geolocation-dialog StEntry:hover, .extension-dialog StEntry:hover, .inhibit-shortcuts-dialog StEntry:hover, .nm-dialog StEntry:hover, .notification-banner StEntry:hover {
173
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.87);
174
}
175
176
StEntry:focus, .modal-dialog StEntry:focus, .prompt-dialog StEntry:focus, .audio-device-selection-dialog StEntry:focus, .access-dialog StEntry:focus, .geolocation-dialog StEntry:focus, .extension-dialog StEntry:focus, .inhibit-shortcuts-dialog StEntry:focus, .nm-dialog StEntry:focus, .notification-banner StEntry:focus {
177
border-color: transparent;
178
box-shadow: inset 0 -2px #1A73E8;
179
border: none;
180
}
181
182
StEntry:insensitive, .modal-dialog StEntry:insensitive, .prompt-dialog StEntry:insensitive, .audio-device-selection-dialog StEntry:insensitive, .access-dialog StEntry:insensitive, .geolocation-dialog StEntry:insensitive, .extension-dialog StEntry:insensitive, .inhibit-shortcuts-dialog StEntry:insensitive, .nm-dialog StEntry:insensitive, .notification-banner StEntry:insensitive {
183
color: rgba(0, 0, 0, 0.38);
184
border-color: transparent;
185
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12);
186
}
187
188
StEntry StIcon.capslock-warning, .modal-dialog StEntry StIcon.capslock-warning, .prompt-dialog StEntry StIcon.capslock-warning, .audio-device-selection-dialog StEntry StIcon.capslock-warning, .access-dialog StEntry StIcon.capslock-warning, .geolocation-dialog StEntry StIcon.capslock-warning, .extension-dialog StEntry StIcon.capslock-warning, .inhibit-shortcuts-dialog StEntry StIcon.capslock-warning, .nm-dialog StEntry StIcon.capslock-warning, .notification-banner StEntry StIcon.capslock-warning {
189
icon-size: 16px;
190
warning-color: #F4B400;
191
padding: 0 0;
192
}
193
194
/* Scrollbars */
195
StScrollView.vfade {
196
-st-vfade-offset: 32px;
197
}
198
199
StScrollView.hfade {
200
-st-hfade-offset: 32px;
201
}
202
203
StScrollBar {
204
padding: 0;
205
}
206
207
StScrollView StScrollBar {
208
min-width: 16px;
209
min-height: 16px;
210
}
211
212
StScrollBar StBin#trough {
213
margin: 4px;
214
border-radius: 100px;
215
background-color: rgba(0, 0, 0, 0.12);
216
}
217
218
StScrollBar StButton#vhandle, StScrollBar StButton#hhandle {
219
transition-duration: 100ms;
220
border-radius: 100px;
221
background-color: rgba(0, 0, 0, 0.38);
222
margin: 4px;
223
}
224
225
StScrollBar StButton#vhandle:hover, StScrollBar StButton#hhandle:hover {
226
background-color: rgba(0, 0, 0, 0.6);
227
}
228
229
StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
230
background-color: rgba(0, 0, 0, 0.87);
231
}
232
233
#overview StScrollBar StBin#trough, #screenShieldNotifications StScrollBar StBin#trough {
234
background-color: rgba(255, 255, 255, 0.12);
235
}
236
237
#overview StScrollBar StButton#vhandle, #screenShieldNotifications StScrollBar StButton#vhandle, #overview StScrollBar StButton#hhandle, #screenShieldNotifications StScrollBar StButton#hhandle {
238
background-color: rgba(255, 255, 255, 0.5);
239
}
240
241
#overview StScrollBar StButton#vhandle:hover, #screenShieldNotifications StScrollBar StButton#vhandle:hover, #overview StScrollBar StButton#hhandle:hover, #screenShieldNotifications StScrollBar StButton#hhandle:hover {
242
background-color: rgba(255, 255, 255, 0.7);
243
}
244
245
#overview StScrollBar StButton#vhandle:active, #screenShieldNotifications StScrollBar StButton#vhandle:active, #overview StScrollBar StButton#hhandle:active, #screenShieldNotifications StScrollBar StButton#hhandle:active {
246
background-color: white;
247
}
248
249
/* Slider */
250
.slider {
251
height: 20px;
252
-barlevel-height: 2px;
253
-barlevel-background-color: rgba(0, 0, 0, 0.26);
254
-barlevel-border-color: transparent;
255
-barlevel-active-background-color: #1A73E8;
256
-barlevel-active-border-color: transparent;
257
-barlevel-overdrive-color: #D93025;
258
-barlevel-overdrive-border-color: transparent;
259
-barlevel-overdrive-separator-width: 2px;
260
-barlevel-border-width: 0;
261
-slider-handle-radius: 6px;
262
-slider-handle-border-width: 0;
263
-slider-handle-border-color: transparent;
264
color: #1A73E8;
265
}
266
267
.slider:hover {
268
color: #1A73E8;
269
}
270
271
.slider:active {
272
color: #1A73E8;
273
}
274
275
/* Check Boxes */
276
.check-box * {
277
min-height: 16px;
278
padding: 8px 0;
279
}
280
281
.check-box StBoxLayout {
282
spacing: 8px;
283
}
284
285
.check-box StBin {
286
transition-duration: 100ms;
287
width: 24px;
288
height: 24px;
289
padding: 4px;
290
border-radius: 100px;
291
background-image: url("assets/checkbox-off.svg");
292
}
293
294
.check-box:focus StBin {
295
background-image: url("assets/checkbox-off.svg");
296
}
297
298
.check-box:hover StBin {
299
background-color: rgba(0, 0, 0, 0.08);
300
}
301
302
.check-box:active StBin {
303
transition-duration: 200ms;
304
background-color: rgba(0, 0, 0, 0.2);
305
}
306
307
.check-box:checked StBin {
308
background-image: url("assets/checkbox.svg");
309
}
310
311
.check-box:focus:checked StBin {
312
background-image: url("assets/checkbox.svg");
313
}
314
315
.check-box:hover:checked StBin {
316
background-color: rgba(26, 115, 232, 0.08);
317
}
318
319
.check-box:active:checked StBin {
320
background-color: rgba(26, 115, 232, 0.2);
321
}
322
323
/* Switches */
324
.toggle-switch {
325
color: transparent;
326
width: 40px;
327
height: 20px;
328
background-size: contain;
329
background-image: url("assets/toggle-off.svg");
330
}
331
332
.toggle-switch:checked {
333
background-image: url("assets/toggle-on.svg");
334
}
335
336
/* links */
337
.shell-link {
338
transition-duration: 100ms;
339
border-radius: 4px;
340
color: #1A73E8;
341
}
342
343
.shell-link:hover {
344
color: #1A73E8;
345
background-color: rgba(26, 115, 232, 0.08);
346
}
347
348
.shell-link:active {
349
transition-duration: 200ms;
350
color: #1A73E8;
351
background-color: rgba(26, 115, 232, 0.2);
352
}
353
354
/* Modal Dialogs */
355
.headline {
356
font-size: 15pt;
357
font-weight: 500;
358
}
359
360
.lightbox {
361
background-color: black;
362
}
363
364
.flashspot {
365
background-color: white;
366
}
367
368
.modal-dialog {
369
border-radius: 4px;
370
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44);
371
}
372
373
.modal-dialog .modal-dialog-content-box {
374
padding: 24px;
375
}
376
377
.modal-dialog .run-dialog-entry {
378
width: 20em;
379
margin-bottom: 0;
380
}
381
382
.modal-dialog .run-dialog-error-box {
383
padding-top: 16px;
384
spacing: 6px;
385
}
386
387
.modal-dialog .run-dialog-button-box {
388
padding-top: 1em;
389
}
390
391
.modal-dialog .run-dialog-label {
392
font-size: 1em;
393
font-weight: normal;
394
color: rgba(0, 0, 0, 0.6);
395
padding-bottom: .4em;
396
}
397
398
.mount-dialog-subject,
399
.end-session-dialog-subject {
400
font-size: 15pt;
401
font-weight: 500;
402
}
403
404
/* Message Dialog */
405
.message-dialog-main-layout {
406
padding: 12px 20px 0;
407
spacing: 12px;
408
}
409
410
.message-dialog-content {
411
max-width: 28em;
412
spacing: 20px;
413
}
414
415
.message-dialog-icon {
416
min-width: 48px;
417
icon-size: 48px;
418
}
419
420
.message-dialog-title {
421
font-weight: bold;
422
}
423
424
.message-dialog-subtitle {
425
color: rgba(0, 0, 0, 0.6);
426
font-weight: normal;
427
}
428
429
/* End Session Dialog */
430
.end-session-dialog {
431
spacing: 42px;
432
border: none;
433
}
434
435
.end-session-dialog-list {
436
padding-top: 20px;
437
}
438
439
.end-session-dialog-layout {
440
padding-left: 17px;
441
}
442
443
.end-session-dialog-layout:rtl {
444
padding-right: 17px;
445
}
446
447
.end-session-dialog-description {
448
width: 28em;
449
padding-bottom: 10px;
450
}
451
452
.end-session-dialog-description:rtl {
453
text-align: right;
454
}
455
456
.end-session-dialog-warning {
457
width: 28em;
458
color: #F4B400;
459
padding-top: 6px;
460
}
461
462
.end-session-dialog-warning:rtl {
463
text-align: right;
464
}
465
466
.end-session-dialog-logout-icon {
467
border-radius: 9999px;
468
width: 48px;
469
height: 48px;
470
background-size: contain;
471
}
472
473
.end-session-dialog-shutdown-icon {
474
color: rgba(0, 0, 0, 0.38);
475
width: 48px;
476
height: 48px;
477
}
478
479
.end-session-dialog-inhibitor-layout {
480
spacing: 16px;
481
max-height: 200px;
482
padding-right: 65px;
483
padding-left: 65px;
484
}
485
486
.end-session-dialog-session-list,
487
.end-session-dialog-app-list {
488
spacing: 1em;
489
}
490
491
.end-session-dialog-list-header {
492
font-weight: bold;
493
}
494
495
.end-session-dialog-list-header:rtl {
496
text-align: right;
497
}
498
499
.end-session-dialog-app-list-item,
500
.end-session-dialog-session-list-item {
501
spacing: 1em;
502
}
503
504
.end-session-dialog-app-list-item-name,
505
.end-session-dialog-session-list-item-name {
506
font-weight: bold;
507
}
508
509
.end-session-dialog-app-list-item-description {
510
color: rgba(0, 0, 0, 0.6);
511
font-size: 1em;
512
}
513
514
/* ShellMountOperation Dialogs */
515
.shell-mount-operation-icon {
516
icon-size: 48px;
517
}
518
519
.mount-dialog {
520
spacing: 24px;
521
}
522
523
.mount-dialog .message-dialog-title {
524
padding-top: 10px;
525
padding-left: 17px;
526
padding-bottom: 6px;
527
max-width: 34em;
528
}
529
530
.mount-dialog .message-dialog-title:rtl {
531
padding-left: 0px;
532
padding-right: 17px;
533
}
534
535
.mount-dialog .message-dialog-body {
536
padding-left: 17px;
537
width: 28em;
538
}
539
540
.mount-dialog .message-dialog-body:rtl {
541
padding-left: 0px;
542
padding-right: 17px;
543
}
544
545
.mount-dialog-app-list {
546
max-height: 200px;
547
padding-top: 24px;
548
padding-left: 49px;
549
padding-right: 32px;
550
}
551
552
.mount-dialog-app-list:rtl {
553
padding-right: 49px;
554
padding-left: 32px;
555
}
556
557
.mount-dialog-app-list-item {
558
color: rgba(0, 0, 0, 0.87);
559
}
560
561
.mount-dialog-app-list-item:hover {
562
color: rgba(0, 0, 0, 0.87);
563
}
564
565
.mount-dialog-app-list-item:ltr {
566
padding-right: 1em;
567
}
568
569
.mount-dialog-app-list-item:rtl {
570
padding-left: 1em;
571
}
572
573
.mount-dialog-app-list-item-icon:ltr {
574
padding-right: 17px;
575
}
576
577
.mount-dialog-app-list-item-icon:rtl {
578
padding-left: 17px;
579
}
580
581
.mount-dialog-app-list-item-name {
582
font-size: 1em;
583
}
584
585
/* Password or Authentication Dialog */
586
.prompt-dialog {
587
width: 34em;
588
}
589
590
.prompt-dialog .message-dialog-main-layout {
591
spacing: 24px;
592
padding: 10px;
593
}
594
595
.prompt-dialog .message-dialog-content {
596
spacing: 16px;
597
}
598
599
.prompt-dialog .message-dialog-title {
600
font-size: 15pt;
601
font-weight: 500;
602
color: rgba(0, 0, 0, 0.87);
603
}
604
605
.prompt-dialog-description:rtl {
606
text-align: right;
607
}
608
609
.prompt-dialog-password-box {
610
spacing: 1em;
611
padding-bottom: 1em;
612
}
613
614
.prompt-dialog-error-label {
615
font-size: 1em;
616
color: #D93025;
617
padding-bottom: 8px;
618
}
619
620
.prompt-dialog-info-label {
621
font-size: 1em;
622
padding-bottom: 8px;
623
}
624
625
.hidden {
626
color: rgba(0, 0, 0, 0);
627
}
628
629
.prompt-dialog-null-label {
630
font-size: 1em;
631
padding-bottom: 8px;
632
}
633
634
.prompt-dialog-pim-box {
635
spacing: 1em;
636
}
637
638
.prompt-dialog-grid {
639
spacing-rows: 15px;
640
spacing-columns: 1em;
641
}
642
643
.prompt-dialog-keyfiles-box {
644
spacing: 1em;
645
}
646
647
.prompt-dialog-button.button {
648
padding: 0 8px;
649
}
650
651
/* Polkit Dialog */
652
.polkit-dialog-user-layout {
653
padding-left: 10px;
654
spacing: 10px;
655
}
656
657
.polkit-dialog-user-layout:rtl {
658
padding-left: 0px;
659
padding-right: 10px;
660
}
661
662
.polkit-dialog-user-root-label {
663
color: #F4B400;
664
}
665
666
.polkit-dialog-user-icon {
667
border-radius: 9999px;
668
background-size: contain;
669
width: 48px;
670
height: 48px;
671
}
672
673
/* Audio selection dialog */
674
.audio-device-selection-dialog {
675
spacing: 30px;
676
}
677
678
.audio-selection-content {
679
spacing: 20px;
680
padding: 24px;
681
}
682
683
.audio-selection-title {
684
font-weight: bold;
685
text-align: center;
686
}
687
688
.audio-selection-box {
689
spacing: 20px;
690
}
691
692
.audio-selection-device {
693
border: none;
694
border-radius: 4px;
695
}
696
697
.audio-selection-device:focus {
698
background-color: rgba(0, 0, 0, 0.12);
699
}
700
701
.audio-selection-device:hover {
702
background-color: rgba(0, 0, 0, 0.08);
703
}
704
705
.audio-selection-device:active {
706
background-color: rgba(0, 0, 0, 0.2);
707
color: rgba(0, 0, 0, 0.87);
708
}
709
710
.audio-selection-device-box {
711
padding: 20px;
712
spacing: 20px;
713
}
714
715
.audio-selection-device-icon {
716
icon-size: 64px;
717
}
718
719
/* Access Dialog */
720
.access-dialog {
721
spacing: 30px;
722
}
723
724
/* Geolocation Dialog */
725
.geolocation-dialog {
726
spacing: 30px;
727
}
728
729
/* Extension Dialog */
730
.extension-dialog .message-dialog-main-layout {
731
spacing: 24px;
732
padding: 10px;
733
}
734
735
.extension-dialog .message-dialog-title {
736
font-weight: normal;
737
color: rgba(0, 0, 0, 0.6);
738
}
739
740
/* Inhibit-Shortcuts Dialog */
741
.inhibit-shortcuts-dialog {
742
spacing: 30px;
743
}
744
745
/* Network Agent Dialog */
746
.network-dialog-secret-table {
747
spacing-rows: 15px;
748
spacing-columns: 1em;
749
}
750
751
.keyring-dialog-control-table {
752
spacing-rows: 15px;
753
spacing-columns: 1em;
754
}
755
756
/* Popovers/Menus */
757
.popup-menu {
758
min-width: 200px;
759
color: rgba(0, 0, 0, 0.87);
760
border-color: transparent;
761
}
762
763
.popup-menu .popup-sub-menu {
764
padding-bottom: 0;
765
background-color: rgba(0, 0, 0, 0.04);
766
box-shadow: 0 0 transparent;
767
}
768
769
.popup-menu .popup-menu-content {
770
padding: 8px 0;
771
}
772
773
.popup-menu .popup-menu-item {
774
spacing: 8px;
775
transition-duration: 100ms;
776
}
777
778
.popup-menu .popup-menu-item:ltr {
779
padding: 0.4em 24px 0.4em 0;
780
}
781
782
.popup-menu .popup-menu-item:rtl {
783
padding: 0.4em 0 0.4em 24px;
784
}
785
786
.popup-menu .popup-menu-item:checked {
787
background-color: rgba(26, 115, 232, 0.24);
788
box-shadow: 0 0 transparent;
789
font-weight: normal;
790
}
791
792
.popup-menu .popup-menu-item:checked.selected {
793
background-color: rgba(26, 115, 232, 0.4);
794
}
795
796
.popup-menu .popup-menu-item:checked:active {
797
background-color: rgba(26, 115, 232, 0.6);
798
}
799
800
.popup-menu .popup-menu-item.selected {
801
background-color: rgba(0, 0, 0, 0.08);
802
color: rgba(0, 0, 0, 0.87);
803
transition-duration: 0ms;
804
}
805
806
.popup-menu .popup-menu-item:active {
807
background-color: rgba(0, 0, 0, 0.2);
808
color: rgba(0, 0, 0, 0.87);
809
transition-duration: 200ms;
810
}
811
812
.popup-menu .popup-menu-item.selected:active {
813
color: rgba(0, 0, 0, 0.87);
814
}
815
816
.popup-menu .popup-menu-item:insensitive {
817
color: rgba(0, 0, 0, 0.38);
818
}
819
820
.popup-menu .popup-inactive-menu-item {
821
color: rgba(0, 0, 0, 0.87);
822
}
823
824
.popup-menu .popup-inactive-menu-item:insensitive {
825
color: rgba(0, 0, 0, 0.38);
826
}
827
828
.popup-menu.panel-menu {
829
-boxpointer-gap: 4px;
830
margin-bottom: 1.75em;
831
}
832
833
.popup-menu-ornament {
834
text-align: right;
835
width: 16px;
836
height: 16px;
837
}
838
839
.popup-menu-boxpointer,
840
.candidate-popup-boxpointer {
841
-arrow-border-radius: 20px;
842
-arrow-background-color: transparent;
843
-arrow-border-width: 0;
844
-arrow-border-color: transparent;
845
-arrow-base: 0;
846
-arrow-rise: 0;
847
-arrow-box-shadow: none;
848
}
849
850
.popup-menu-content,
851
.candidate-popup-content {
852
margin: 5px 8px 8px;
853
background-color: #FFFFFF;
854
border-radius: 4px;
855
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345);
856
}
857
858
.popup-separator-menu-item {
859
height: 1px;
860
margin: 8px 40px;
861
background-color: rgba(0, 0, 0, 0.12);
862
border-color: transparent;
863
border-bottom-width: 0;
864
border-bottom-style: none;
865
}
866
867
.rename-folder-popup .rename-folder-popup-item {
868
spacing: 6px;
869
}
870
871
.rename-folder-popup .rename-folder-popup-item:ltr, .rename-folder-popup .rename-folder-popup-item:rtl {
872
padding: 0, 12px;
873
}
874
875
.background-menu {
876
-boxpointer-gap: 4px;
877
-arrow-rise: 0;
878
}
879
880
/* fallback menu
881
- odd thing for styling App menu when apparently not running under shell. Light Adwaita styled
882
app menu inside the main app window itself rather than the top bar
883
*/
884
/*************
885
* App Icons *
886
*************/
887
/* Outline for low res icons */
888
.lowres-icon {
889
icon-shadow: none;
890
}
891
892
/* Drapshadow for large icons */
893
.icon-dropshadow {
894
icon-shadow: none;
895
}
896
897
/* OSD */
898
.osd-window {
899
text-align: center;
900
font-weight: bold;
901
spacing: 1em;
902
margin: 32px;
903
min-width: 64px;
904
min-height: 64px;
905
}
906
907
.osd-window .osd-monitor-label {
908
font-size: 48px;
909
font-weight: 400;
910
}
911
912
.osd-window .level {
913
height: 8px;
914
-barlevel-height: 8px;
915
-barlevel-background-color: rgba(0, 0, 0, 0.12);
916
-barlevel-active-background-color: #1A73E8;
917
-barlevel-overdrive-color: #D93025;
918
-barlevel-overdrive-separator-width: 2px;
919
}
920
921
/* Pad OSD */
922
.pad-osd-window {
923
padding: 32px;
924
background-color: rgba(0, 0, 0, 0.6);
925
}
926
927
.pad-osd-window .pad-osd-title-box {
928
spacing: 12px;
929
}
930
931
.pad-osd-window .pad-osd-title-menu-box {
932
spacing: 6px;
933
}
934
935
.combo-box-label {
936
width: 15em;
937
}
938
939
/* App Switcher */
940
.switcher-popup {
941
padding: 8px;
942
spacing: 16px;
943
}
944
945
.switcher-list-item-container {
946
spacing: 8px;
947
}
948
949
.switcher-list .item-box {
950
transition-duration: 100ms;
951
padding: 8px;
952
border-radius: 4px;
953
}
954
955
.switcher-list .item-box:outlined {
956
padding: 8px;
957
border: none;
958
background-color: rgba(0, 0, 0, 0.12);
959
color: rgba(0, 0, 0, 0.87);
960
}
961
962
.switcher-list .item-box:selected {
963
background-color: rgba(26, 115, 232, 0.24);
964
color: rgba(0, 0, 0, 0.87);
965
}
966
967
.switcher-list .thumbnail-box {
968
padding: 2px;
969
spacing: 4px;
970
}
971
972
.switcher-list .thumbnail {
973
width: 256px;
974
}
975
976
.switcher-list .separator {
977
width: 1px;
978
background: rgba(0, 0, 0, 0.12);
979
}
980
981
.switcher-arrow {
982
transition-duration: 100ms;
983
border-color: rgba(0, 0, 0, 0);
984
color: rgba(0, 0, 0, 0.6);
985
}
986
987
.switcher-arrow:highlighted {
988
color: rgba(0, 0, 0, 0.87);
989
}
990
991
.input-source-switcher-symbol {
992
font-size: 48px;
993
font-weight: 400;
994
width: 96px;
995
height: 96px;
996
}
997
998
/* Window Cycler */
999
.cycler-highlight {
1000
border: 4px solid #1A73E8;
1001
}
1002
1003
/* Workspace Switcher */
1004
.workspace-switcher-group {
1005
padding: 8px;
1006
}
1007
1008
.workspace-switcher {
1009
background: transparent;
1010
border: 0px;
1011
border-radius: 0px;
1012
padding: 0px;
1013
spacing: 8px;
1014
}
1015
1016
.ws-switcher-active-up, .ws-switcher-active-down,
1017
.ws-switcher-active-left, .ws-switcher-active-right {
1018
height: 48px;
1019
background-color: #1A73E8;
1020
color: white;
1021
background-size: 32px;
1022
border-radius: 4px;
1023
}
1024
1025
.ws-switcher-box {
1026
height: 48px;
1027
border: none;
1028
background: rgba(0, 0, 0, 0.12);
1029
border-radius: 4px;
1030
}
1031
1032
.osd-window,
1033
.resize-popup,
1034
.switcher-list, .workspace-switcher-container {
1035
color: rgba(0, 0, 0, 0.87);
1036
background-color: #FFFFFF;
1037
border: none;
1038
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44);
1039
border-radius: 4px;
1040
padding: 12px;
1041
}
1042
1043
.modal-dialog, .prompt-dialog, .audio-device-selection-dialog, .access-dialog, .geolocation-dialog, .extension-dialog, .inhibit-shortcuts-dialog, .nm-dialog {
1044
color: rgba(0, 0, 0, 0.87);
1045
background-color: #FFFFFF;
1046
border: none;
1047
}
1048
1049
/* Tiled window previews */
1050
.tile-preview {
1051
background-color: rgba(138, 180, 248, 0.3);
1052
border: 1px solid #8AB4F8;
1053
}
1054
1055
.tile-preview-left.on-primary {
1056
border-radius: 0;
1057
}
1058
1059
.tile-preview-right.on-primary {
1060
border-radius: 0;
1061
}
1062
1063
.tile-preview-left.tile-preview-right.on-primary {
1064
border-radius: 0;
1065
}
1066
1067
/* TOP BAR */
1068
#panel {
1069
background-color: #1F1F1F;
1070
/* transition from solid to transparent */
1071
transition-duration: 250ms;
1072
font-weight: bold;
1073
height: 28px;
1074
font-feature-settings: "tnum";
1075
}
1076
1077
#panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen {
1078
background-color: transparent;
1079
}
1080
1081
#panel #panelLeft, #panel #panelCenter {
1082
spacing: 0;
1083
}
1084
1085
#panel .panel-corner {
1086
-panel-corner-radius: 0;
1087
-panel-corner-background-color: transparent;
1088
-panel-corner-border-width: 0;
1089
-panel-corner-border-color: transparent;
1090
}
1091
1092
#panel .panel-corner:active, #panel .panel-corner:overview, #panel .panel-corner:focus {
1093
-panel-corner-border-color: transparent;
1094
}
1095
1096
#panel .panel-corner.lock-screen, #panel .panel-corner.login-screen, #panel .panel-corner.unlock-screen {
1097
-panel-corner-radius: 0;
1098
-panel-corner-background-color: transparent;
1099
-panel-corner-border-color: transparent;
1100
}
1101
1102
#panel .panel-button {
1103
-natural-hpadding: 8px;
1104
-minimum-hpadding: 4px;
1105
font-weight: bold;
1106
color: rgba(255, 255, 255, 0.7);
1107
text-shadow: none;
1108
transition-duration: 100ms;
1109
}
1110
1111
#panel .panel-button .app-menu-icon {
1112
-st-icon-style: symbolic;
1113
margin-left: 4px;
1114
margin-right: 4px;
1115
}
1116
1117
#panel .panel-button .system-status-icon,
1118
#panel .panel-button .app-menu-icon > StIcon,
1119
#panel .panel-button .popup-menu-arrow {
1120
icon-shadow: none;
1121
}
1122
1123
#panel .panel-button:hover {
1124
color: white;
1125
text-shadow: none;
1126
}
1127
1128
#panel .panel-button:hover .system-status-icon,
1129
#panel .panel-button:hover .app-menu-icon > StIcon,
1130
#panel .panel-button:hover .popup-menu-arrow {
1131
icon-shadow: none;
1132
}
1133
1134
#panel .panel-button:active, #panel .panel-button:overview, #panel .panel-button:focus, #panel .panel-button:checked {
1135
background-color: rgba(31, 31, 31, 0.01);
1136
box-shadow: inset 0 -2px 0px white;
1137
color: white;
1138
}
1139
1140
#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 {
1141
icon-shadow: none;
1142
}
1143
1144
#panel .panel-button .system-status-icon {
1145
icon-size: 1.14286em;
1146
padding: 0 4px;
1147
}
1148
1149
.unlock-screen #panel .panel-button,
1150
.login-screen #panel .panel-button,
1151
.lock-screen #panel .panel-button {
1152
color: rgba(255, 255, 255, 0.7);
1153
}
1154
1155
.unlock-screen #panel .panel-button:focus, .unlock-screen #panel .panel-button:hover, .unlock-screen #panel .panel-button:active,
1156
.login-screen #panel .panel-button:focus,
1157
.login-screen #panel .panel-button:hover,
1158
.login-screen #panel .panel-button:active,
1159
.lock-screen #panel .panel-button:focus,
1160
.lock-screen #panel .panel-button:hover,
1161
.lock-screen #panel .panel-button:active {
1162
color: white;
1163
}
1164
1165
#panel .panel-status-indicators-box,
1166
#panel .panel-status-menu-box {
1167
spacing: 2px;
1168
}
1169
1170
#panel .power-status.panel-status-indicators-box {
1171
spacing: 0;
1172
}
1173
1174
#panel .screencast-indicator {
1175
color: #F4B400;
1176
}
1177
1178
#panel .remote-access-indicator {
1179
color: #F4B400;
1180
}
1181
1182
#panel.solid {
1183
background-color: #1F1F1F;
1184
/* transition from transparent to solid */
1185
transition-duration: 250ms;
1186
background-gradient-direction: none;
1187
text-shadow: none;
1188
}
1189
1190
#panel.solid:overview {
1191
background-color: transparent;
1192
}
1193
1194
#panel.solid .panel-corner {
1195
-panel-corner-background-color: #1F1F1F;
1196
}
1197
1198
#panel.solid .panel-button {
1199
color: rgba(255, 255, 255, 0.7);
1200
text-shadow: none;
1201
}
1202
1203
#panel.solid .panel-button:hover, #panel.solid .panel-button:active, #panel.solid .panel-button:overview, #panel.solid .panel-button:focus, #panel.solid .panel-button:checked {
1204
color: white;
1205
}
1206
1207
#panel.solid .system-status-icon,
1208
#panel.solid .app-menu-icon > StIcon,
1209
#panel.solid .popup-menu-arrow {
1210
icon-shadow: none;
1211
}
1212
1213
#calendarArea {
1214
padding: 8px 16px;
1215
}
1216
1217
.calendar {
1218
margin-bottom: 0;
1219
}
1220
1221
.calendar,
1222
.datemenu-today-button,
1223
.datemenu-displays-box,
1224
.message-list-sections {
1225
margin: 0 8px;
1226
}
1227
1228
.datemenu-calendar-column {
1229
spacing: 8px;
1230
}
1231
1232
.datemenu-displays-section {
1233
padding-bottom: 0;
1234
}
1235
1236
.datemenu-displays-box {
1237
spacing: 8px;
1238
}
1239
1240
.datemenu-calendar-column {
1241
border: 0 solid rgba(0, 0, 0, 0.12);
1242
}
1243
1244
.datemenu-calendar-column:ltr {
1245
border-left-width: 0;
1246
}
1247
1248
.datemenu-calendar-column:rtl {
1249
border-right-width: 0;
1250
}
1251
1252
.datemenu-today-button,
1253
.world-clocks-button,
1254
.weather-button,
1255
.events-section-title {
1256
min-height: 20px;
1257
padding: 4px 8px;
1258
border-radius: 4px;
1259
}
1260
1261
.datemenu-today-button {
1262
min-height: 48px;
1263
}
1264
1265
.message-list-section-list:ltr {
1266
padding-left: 0;
1267
}
1268
1269
.message-list-section-list:rtl {
1270
padding-right: 0;
1271
}
1272
1273
.datemenu-today-button,
1274
.world-clocks-button,
1275
.weather-button,
1276
.events-section-title {
1277
transition-duration: 100ms;
1278
}
1279
1280
.datemenu-today-button:hover, .datemenu-today-button:focus,
1281
.world-clocks-button:hover,
1282
.world-clocks-button:focus,
1283
.weather-button:hover,
1284
.weather-button:focus,
1285
.events-section-title:hover,
1286
.events-section-title:focus {
1287
color: rgba(0, 0, 0, 0.87);
1288
background-color: rgba(0, 0, 0, 0.08);
1289
}
1290
1291
.datemenu-today-button:active,
1292
.world-clocks-button:active,
1293
.weather-button:active,
1294
.events-section-title:active {
1295
transition-duration: 200ms;
1296
color: rgba(0, 0, 0, 0.87);
1297
background-color: rgba(0, 0, 0, 0.2);
1298
}
1299
1300
.datemenu-today-button .date-label {
1301
font-size: 18pt;
1302
font-weight: 400;
1303
}
1304
1305
.world-clocks-header,
1306
.weather-header,
1307
.events-section-title {
1308
color: rgba(0, 0, 0, 0.6);
1309
font-weight: bold;
1310
}
1311
1312
.weather-header.location {
1313
font-weight: normal;
1314
font-size: 1em;
1315
}
1316
1317
.world-clocks-grid,
1318
.weather-grid {
1319
spacing-rows: 0.4em;
1320
spacing-columns: 0.8em;
1321
}
1322
1323
.weather-box {
1324
spacing: 0.4em;
1325
}
1326
1327
.world-clocks-city {
1328
font-weight: normal;
1329
font-size: 1em;
1330
}
1331
1332
.world-clocks-time {
1333
color: rgba(0, 0, 0, 0.6);
1334
font-feature-settings: "tnum";
1335
font-size: 1em;
1336
}
1337
1338
.world-clocks-timezone {
1339
color: rgba(0, 0, 0, 0.38);
1340
font-feature-settings: "tnum";
1341
font-size: 1em;
1342
}
1343
1344
.weather-forecast-icon {
1345
icon-size: 2.28571em;
1346
}
1347
1348
.weather-forecast-time {
1349
color: rgba(0, 0, 0, 0.6);
1350
font-size: 9pt;
1351
font-weight: 400;
1352
}
1353
1354
.calendar-month-label {
1355
transition-duration: 100ms;
1356
height: 16px;
1357
margin: 2px;
1358
padding: 6px 16px;
1359
border-radius: 4px;
1360
color: rgba(0, 0, 0, 0.87);
1361
font-weight: bold;
1362
text-align: center;
1363
}
1364
1365
.calendar-month-label:focus {
1366
background-color: rgba(0, 0, 0, 0.12);
1367
}
1368
1369
.pager-button {
1370
transition-duration: 100ms;
1371
width: 28px;
1372
height: 28px;
1373
margin: 2px;
1374
border-radius: 100px;
1375
background-color: transparent;
1376
color: rgba(0, 0, 0, 0.6);
1377
}
1378
1379
.pager-button:hover, .pager-button:focus {
1380
background-color: rgba(0, 0, 0, 0.08);
1381
color: rgba(0, 0, 0, 0.87);
1382
}
1383
1384
.pager-button:active {
1385
background-color: rgba(0, 0, 0, 0.2);
1386
color: rgba(0, 0, 0, 0.87);
1387
transition-duration: 200ms;
1388
}
1389
1390
.calendar-change-month-back StIcon, .calendar-change-month-forward StIcon {
1391
icon-size: 1.14286em;
1392
}
1393
1394
.calendar-day-base {
1395
transition-duration: 100ms;
1396
font-size: 9pt;
1397
font-weight: 400;
1398
text-align: center;
1399
width: 28px;
1400
height: 28px;
1401
padding: 0;
1402
margin: 2px;
1403
border-radius: 100px;
1404
font-feature-settings: "tnum";
1405
}
1406
1407
.calendar-day-base:hover, .calendar-day-base:focus {
1408
background-color: rgba(0, 0, 0, 0.08);
1409
}
1410
1411
.calendar-day-base:active {
1412
transition-duration: 200ms;
1413
color: inherit;
1414
background-color: rgba(0, 0, 0, 0.2);
1415
border-color: transparent;
1416
}
1417
1418
.calendar-day-base:selected {
1419
color: rgba(0, 0, 0, 0.87);
1420
background-color: rgba(26, 115, 232, 0.24);
1421
border-color: transparent;
1422
}
1423
1424
.calendar-day-base.calendar-day-heading {
1425
width: 28px;
1426
height: 21px;
1427
margin-top: 2px;
1428
padding: 7px 0 0;
1429
border-radius: 100px;
1430
background-color: transparent;
1431
color: rgba(0, 0, 0, 0.38);
1432
font-size: 9pt;
1433
font-weight: 400;
1434
font-weight: bold;
1435
text-align: center;
1436
}
1437
1438
.calendar-day {
1439
border-width: 0;
1440
}
1441
1442
.calendar-day-top {
1443
border-top-width: 0;
1444
}
1445
1446
.calendar-day-left {
1447
border-left-width: 0;
1448
}
1449
1450
.calendar-nonwork-day {
1451
color: rgba(0, 0, 0, 0.87);
1452
}
1453
1454
.calendar-today {
1455
font-weight: bold !important;
1456
border: none;
1457
}
1458
1459
.calendar-day-with-events {
1460
color: #1A73E8;
1461
font-weight: normal;
1462
text-decoration: underline;
1463
background-image: none;
1464
}
1465
1466
.calendar-other-month-day {
1467
color: rgba(0, 0, 0, 0.26);
1468
}
1469
1470
.calendar-week-number {
1471
width: 28px;
1472
height: 21px;
1473
margin: 2px;
1474
padding: 7px 0 0;
1475
border-radius: 100px;
1476
background-color: transparent;
1477
color: rgba(0, 0, 0, 0.38);
1478
font-size: inherit;
1479
font-weight: bold;
1480
text-align: center;
1481
}
1482
1483
/* Message list */
1484
.message-list {
1485
width: 420px;
1486
}
1487
1488
.message-list-clear-button.button {
1489
margin: 8px 8px 0;
1490
}
1491
1492
.message-list-sections {
1493
spacing: 8px;
1494
}
1495
1496
.message-list-section,
1497
.message-list-section-list {
1498
spacing: 8px;
1499
}
1500
1501
.message {
1502
transition-duration: 100ms;
1503
min-height: 56px;
1504
border: none;
1505
background-color: transparent;
1506
border-radius: 4px;
1507
}
1508
1509
.message:hover, .message:focus {
1510
background-color: rgba(0, 0, 0, 0.08);
1511
}
1512
1513
.message:active {
1514
transition-duration: 200ms;
1515
background-color: rgba(0, 0, 0, 0.2);
1516
}
1517
1518
.message-icon-bin {
1519
padding: 8px 0px 8px 8px;
1520
}
1521
1522
.message-icon-bin:rtl {
1523
padding: 8px 8px 8px 0px;
1524
}
1525
1526
.message-icon-bin > StIcon {
1527
color: rgba(0, 0, 0, 0.87);
1528
icon-size: 1.14286em;
1529
-st-icon-style: requested;
1530
margin: 4px 0px 4px 4px;
1531
}
1532
1533
.message-icon-bin > StIcon:rtl {
1534
margin: 4px 4px 4px 0px;
1535
}
1536
1537
.message-icon-bin > .fallback-window-icon {
1538
width: 1.14286em;
1539
height: 1.14286em;
1540
}
1541
1542
.message-secondary-bin {
1543
padding: 0 8px;
1544
}
1545
1546
.message-secondary-bin > .event-time {
1547
min-height: 22px;
1548
padding-top: 2px;
1549
color: rgba(0, 0, 0, 0.6);
1550
font-size: 1em;
1551
/* HACK: the label should be baseline-aligned with a 1em label,
1552
fake this with some bottom padding */
1553
padding-bottom: 0;
1554
}
1555
1556
.message-secondary-bin > StIcon {
1557
icon-size: 1.14286em;
1558
}
1559
1560
.message-title {
1561
min-height: 22px;
1562
padding-top: 2px;
1563
color: rgba(0, 0, 0, 0.87);
1564
font-weight: bold;
1565
font-size: 1em;
1566
}
1567
1568
.message-content {
1569
min-height: 40px;
1570
padding: 8px;
1571
color: rgba(0, 0, 0, 0.6);
1572
font-size: 1em;
1573
}
1574
1575
.message-content * > StIcon {
1576
transition-duration: 100ms;
1577
icon-size: 16px;
1578
border-radius: 16px;
1579
padding: 4px;
1580
color: rgba(0, 0, 0, 0.6);
1581
}
1582
1583
/* FIXME: how do you do this in sass? */
1584
.message-content *:hover > StIcon,
1585
.message-content *:focus > StIcon {
1586
color: rgba(0, 0, 0, 0.87);
1587
background-color: rgba(0, 0, 0, 0.08);
1588
}
1589
1590
.message-content *:active > StIcon {
1591
transition-duration: 200ms;
1592
color: rgba(0, 0, 0, 0.87);
1593
background-color: rgba(0, 0, 0, 0.2);
1594
}
1595
1596
.message-media-control {
1597
transition-duration: 100ms;
1598
margin: 16px 0;
1599
padding: 8px;
1600
border-radius: 100px;
1601
color: rgba(0, 0, 0, 0.6);
1602
}
1603
1604
.message-media-control:hover, .message-media-control:focus {
1605
color: rgba(0, 0, 0, 0.87);
1606
background-color: rgba(0, 0, 0, 0.08);
1607
}
1608
1609
.message-media-control:active {
1610
color: rgba(0, 0, 0, 0.87);
1611
background-color: rgba(0, 0, 0, 0.2);
1612
transition-duration: 200ms;
1613
}
1614
1615
.message-media-control:insensitive {
1616
color: rgba(0, 0, 0, 0.26);
1617
}
1618
1619
.message-media-control:last-child:ltr {
1620
margin-right: 16px;
1621
padding-right: 8px;
1622
}
1623
1624
.message-media-control:last-child:rtl {
1625
margin-left: 16px;
1626
padding-left: 8px;
1627
}
1628
1629
.media-message-cover-icon {
1630
icon-size: 32px !important;
1631
margin: 8px 0px 8px 4px !important;
1632
}
1633
1634
.media-message-cover-icon:rtl {
1635
margin: 8px 4px 8px 0px !important;
1636
}
1637
1638
.media-message-cover-icon.fallback {
1639
icon-size: 16px !important;
1640
padding: 8px;
1641
border: none;
1642
border-radius: 4px;
1643
background-color: rgba(0, 0, 0, 0.12);
1644
color: rgba(0, 0, 0, 0.38);
1645
}
1646
1647
#appMenu {
1648
spacing: 4px;
1649
}
1650
1651
#appMenu .label-shadow {
1652
color: transparent;
1653
}
1654
1655
.app-menu,
1656
.app-well-menu {
1657
max-width: 27.25em;
1658
}
1659
1660
.aggregate-menu {
1661
min-width: 280px;
1662
}
1663
1664
.aggregate-menu .popup-menu-icon {
1665
padding: 0 4px;
1666
}
1667
1668
.aggregate-menu .popup-sub-menu .popup-menu-item > :first-child:ltr {
1669
/* 8px spacing + 2*4px padding */
1670
padding-left: 16px;
1671
margin-left: 1.14286em;
1672
}
1673
1674
.aggregate-menu .popup-sub-menu .popup-menu-item > :first-child:rtl {
1675
/* 8px spacing + 2*4px padding */
1676
padding-right: 16px;
1677
margin-right: 1.14286em;
1678
}
1679
1680
.system-menu-action {
1681
-st-icon-style: symbolic;
1682
color: rgba(0, 0, 0, 0.6);
1683
border-radius: 100px;
1684
/* wish we could do 50% */
1685
padding: 12px;
1686
border: none;
1687
transition-duration: 100ms;
1688
}
1689
1690
.system-menu-action:hover, .system-menu-action:focus {
1691
background-color: rgba(0, 0, 0, 0.08);
1692
color: rgba(0, 0, 0, 0.87);
1693
border: none;
1694
padding: 12px;
1695
}
1696
1697
.system-menu-action:active {
1698
background-color: rgba(0, 0, 0, 0.2);
1699
color: rgba(0, 0, 0, 0.87);
1700
transition-duration: 200ms;
1701
}
1702
1703
.system-menu-action > StIcon {
1704
icon-size: 16px;
1705
}
1706
1707
.ripple-box {
1708
width: 48px;
1709
height: 48px;
1710
border-radius: 0 0 48px 0;
1711
background-color: rgba(255, 255, 255, 0.3);
1712
background-image: none;
1713
background-size: auto;
1714
box-shadow: none;
1715
}
1716
1717
.ripple-box:rtl {
1718
border-radius: 0 0 0 48px;
1719
background-image: none;
1720
}
1721
1722
.select-area-rubberband {
1723
background-color: rgba(138, 180, 248, 0.3);
1724
border: 1px solid #8AB4F8;
1725
}
1726
1727
.ripple-pointer-location {
1728
width: 50px;
1729
height: 50px;
1730
border-radius: 25px;
1731
background-color: rgba(26, 115, 232, 0.24);
1732
box-shadow: none;
1733
}
1734
1735
.popup-menu-arrow {
1736
icon-size: 1.14286em;
1737
}
1738
1739
.popup-menu-icon {
1740
icon-size: 1.14286em;
1741
}
1742
1743
.window-close {
1744
background-color: transparent;
1745
border-radius: 0;
1746
border: none;
1747
box-shadow: none;
1748
color: transparent;
1749
height: 32px;
1750
width: 32px;
1751
-shell-close-overlap: 16px;
1752
-st-background-image-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24);
1753
background-image: url("assets/window-close.svg");
1754
background-size: 32px;
1755
}
1756
1757
.window-close:hover {
1758
background-color: transparent;
1759
border-color: transparent;
1760
color: transparent;
1761
-st-background-image-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345);
1762
background-image: url("assets/window-close.svg");
1763
}
1764
1765
.window-close:active {
1766
background-color: transparent;
1767
border-color: transparent;
1768
color: transparent;
1769
background-image: url("assets/window-close-active.svg");
1770
}
1771
1772
.window-close:rtl {
1773
-st-background-image-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24);
1774
}
1775
1776
.window-close:rtl:hover {
1777
-st-background-image-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345);
1778
}
1779
1780
.pie-timer {
1781
width: 60px;
1782
height: 60px;
1783
-pie-border-width: 0;
1784
-pie-border-color: transparent;
1785
-pie-background-color: rgba(26, 115, 232, 0.24);
1786
}
1787
1788
/* NETWORK DIALOGS */
1789
.nm-dialog {
1790
max-height: 34em;
1791
min-height: 31em;
1792
min-width: 32em;
1793
}
1794
1795
.nm-dialog-content {
1796
spacing: 20px;
1797
padding: 24px;
1798
}
1799
1800
.nm-dialog-header-hbox {
1801
spacing: 10px;
1802
}
1803
1804
.nm-dialog-airplane-box {
1805
spacing: 12px;
1806
}
1807
1808
.nm-dialog-airplane-headline {
1809
font-weight: bold;
1810
text-align: center;
1811
}
1812
1813
.nm-dialog-airplane-text {
1814
color: rgba(0, 0, 0, 0.87);
1815
}
1816
1817
.nm-dialog-header-icon {
1818
icon-size: 32px;
1819
}
1820
1821
.nm-dialog-scroll-view {
1822
border: none;
1823
}
1824
1825
.nm-dialog-header {
1826
font-size: 15pt;
1827
font-weight: 500;
1828
}
1829
1830
.nm-dialog-item {
1831
transition-duration: 100ms;
1832
font-size: 1em;
1833
border-bottom: none;
1834
border-radius: 4px;
1835
padding: 12px;
1836
spacing: 20px;
1837
}
1838
1839
.nm-dialog-item:hover, .nm-dialog-item:focus {
1840
background-color: rgba(0, 0, 0, 0.08);
1841
}
1842
1843
.nm-dialog-item:active {
1844
transition-duration: 200ms;
1845
background-color: rgba(0, 0, 0, 0.2);
1846
}
1847
1848
.nm-dialog-item:selected {
1849
background-color: rgba(26, 115, 232, 0.24);
1850
color: rgba(0, 0, 0, 0.87);
1851
}
1852
1853
.nm-dialog-icons {
1854
spacing: .5em;
1855
}
1856
1857
.nm-dialog-icon {
1858
icon-size: 16px;
1859
}
1860
1861
.no-networks-label {
1862
color: rgba(0, 0, 0, 0.38);
1863
}
1864
1865
.no-networks-box {
1866
spacing: 12px;
1867
}
1868
1869
/* OVERVIEW */
1870
#overview {
1871
spacing: 24px;
1872
}
1873
1874
.overview-controls {
1875
padding-bottom: 32px;
1876
}
1877
1878
.window-picker {
1879
-horizontal-spacing: 16px;
1880
-vertical-spacing: 16px;
1881
padding: 0 16px 32px;
1882
}
1883
1884
.window-picker.external-monitor {
1885
padding: 16px;
1886
}
1887
1888
.window-clone-border {
1889
border: 4px solid rgba(255, 255, 255, 0.3);
1890
border-radius: 4px;
1891
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3);
1892
}
1893
1894
.window-caption {
1895
spacing: 25px;
1896
color: white;
1897
background-color: rgba(0, 0, 0, 0.6);
1898
border-radius: 4px;
1899
padding: 4px 8px;
1900
}
1901
1902
.search-entry {
1903
width: 304px;
1904
padding: 0 8px;
1905
border-radius: 4px 4px 0 0;
1906
color: rgba(255, 255, 255, 0.5);
1907
selection-background-color: rgba(255, 255, 255, 0.3);
1908
selected-color: white;
1909
transition-duration: 100ms;
1910
background-color: rgba(255, 255, 255, 0.04);
1911
border-color: transparent;
1912
box-shadow: inset 0 -1px rgba(255, 255, 255, 0.3);
1913
}
1914
1915
.search-entry:hover {
1916
box-shadow: inset 0 -1px rgba(255, 255, 255, 0.3);
1917
}
1918
1919
.search-entry:focus {
1920
border-color: transparent;
1921
box-shadow: inset 0 -2px white;
1922
padding: 0 8px;
1923
border-width: 0;
1924
color: white;
1925
}
1926
1927
.search-entry .search-entry-icon {
1928
icon-size: 16px;
1929
padding: 0 0;
1930
color: rgba(255, 255, 255, 0.7);
1931
}
1932
1933
.search-entry:hover .search-entry-icon, .search-entry:focus .search-entry-icon {
1934
color: white;
1935
}
1936
1937
#searchResultsContent {
1938
max-width: 1000px;
1939
padding-left: 20px;
1940
padding-right: 20px;
1941
spacing: 16px;
1942
}
1943
1944
.search-section {
1945
spacing: 16px;
1946
}
1947
1948
.search-section-content {
1949
spacing: 32px;
1950
}
1951
1952
.list-search-results {
1953
spacing: 3px;
1954
}
1955
1956
.search-section-separator {
1957
height: 1px;
1958
background-color: rgba(255, 255, 255, 0.12);
1959
}
1960
1961
.search-section:last-child .search-section-separator {
1962
background-color: transparent;
1963
}
1964
1965
.list-search-result-content {
1966
spacing: 30px;
1967
}
1968
1969
.list-search-result-title {
1970
font-size: 11.25pt;
1971
font-weight: 400;
1972
color: white;
1973
spacing: 12px;
1974
}
1975
1976
.list-search-result-description {
1977
color: rgba(255, 255, 255, 0.7);
1978
}
1979
1980
.list-search-provider-details {
1981
width: 150px;
1982
color: rgba(255, 255, 255, 0.7);
1983
margin-top: 0.24em;
1984
}
1985
1986
.list-search-provider-content {
1987
spacing: 20px;
1988
}
1989
1990
.search-provider-icon {
1991
padding: 15px;
1992
}
1993
1994
/* DASHBOARD */
1995
#dash {
1996
font-size: 1em;
1997
padding: 3px 0;
1998
border-radius: 0px 4px 4px 0px;
1999
}
2000
2001
#dash:rtl {
2002
border-radius: 4px 0 0 4px;
2003
}
2004
2005
#dash .placeholder {
2006
background-image: url("assets/dash-placeholder.svg");
2007
background-size: contain;
2008
height: 24px;
2009
}
2010
2011
#dash .empty-dash-drop-target {
2012
width: 24px;
2013
height: 24px;
2014
}
2015
2016
.dash-item-container > StWidget {
2017
padding: 3px 6px;
2018
}
2019
2020
.dash-label {
2021
border-radius: 4px;
2022
padding: 7px 8px;
2023
color: rgba(0, 0, 0, 0.87);
2024
background-color: #FFFFFF;
2025
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345);
2026
border: none;
2027
text-align: center;
2028
-x-offset: 8px;
2029
}
2030
2031
/* App Vault/Grid */
2032
.icon-grid {
2033
spacing: 30px;
2034
-shell-grid-horizontal-item-size: 136px;
2035
-shell-grid-vertical-item-size: 136px;
2036
}
2037
2038
.icon-grid .overview-icon {
2039
icon-size: 96px;
2040
}
2041
2042
.system-action-icon {
2043
box-shadow: 0 4px 4px rgba(0, 0, 0, 0.2);
2044
background-color: #212121;
2045
color: #FFFFFF;
2046
border-radius: 99px;
2047
icon-size: 48px;
2048
}
2049
2050
.app-view-controls {
2051
width: 320px;
2052
padding-bottom: 32px;
2053
}
2054
2055
.app-view-control {
2056
padding: 0 8px;
2057
margin: 0;
2058
font-weight: bold;
2059
color: rgba(255, 255, 255, 0.7);
2060
}
2061
2062
.app-view-control, .app-view-control:hover, .app-view-control:active, .app-view-control:checked {
2063
color: rgba(255, 255, 255, 0.7);
2064
background-color: transparent;
2065
border-color: transparent;
2066
box-shadow: 0 0 transparent;
2067
text-shadow: none;
2068
icon-shadow: none;
2069
transition-duration: 100ms;
2070
}
2071
2072
.app-view-control:hover {
2073
color: white;
2074
background-color: rgba(255, 255, 255, 0.08) !important;
2075
}
2076
2077
.app-view-control:active {
2078
color: white;
2079
background-color: rgba(255, 255, 255, 0.2) !important;
2080
}
2081
2082
.app-view-control:checked {
2083
color: white;
2084
background-color: rgba(0, 0, 0, 0.01) !important;
2085
box-shadow: inset 0 2px 0 white;
2086
}
2087
2088
.app-view-control:first-child {
2089
border-right-width: 0;
2090
border-radius: 4px;
2091
}
2092
2093
.app-view-control:first-child:checked {
2094
border-radius: 0;
2095
}
2096
2097
.app-view-control:last-child {
2098
border-radius: 4px;
2099
}
2100
2101
.app-view-control:last-child:checked {
2102
border-radius: 0;
2103
}
2104
2105
.search-provider-icon:focus, .search-provider-icon:selected, .search-provider-icon:hover,
2106
.list-search-result:focus,
2107
.list-search-result:selected,
2108
.list-search-result:hover {
2109
background-color: rgba(255, 255, 255, 0.08);
2110
transition-duration: 0ms;
2111
}
2112
2113
.search-provider-icon:active, .search-provider-icon:checked,
2114
.list-search-result:active,
2115
.list-search-result:checked {
2116
background-color: rgba(255, 255, 255, 0.2);
2117
transition-duration: 200ms;
2118
}
2119
2120
.app-well-app:hover .overview-icon,
2121
.app-well-app:focus .overview-icon,
2122
.app-well-app:selected .overview-icon,
2123
.app-well-app.app-folder:hover .overview-icon,
2124
.app-well-app.app-folder:focus .overview-icon,
2125
.app-well-app.app-folder:selected .overview-icon,
2126
.show-apps:hover .overview-icon,
2127
.show-apps:focus .overview-icon,
2128
.show-apps:selected .overview-icon,
2129
.grid-search-result:hover .overview-icon,
2130
.grid-search-result:focus .overview-icon,
2131
.grid-search-result:selected .overview-icon {
2132
background-color: rgba(255, 255, 255, 0.08);
2133
transition-duration: 0ms;
2134
border-image: none;
2135
background-image: none;
2136
}
2137
2138
.app-well-app:drop .overview-icon,
2139
.app-well-app.app-folder:drop .overview-icon,
2140
.show-apps:drop .overview-icon,
2141
.grid-search-result:drop .overview-icon {
2142
background-color: rgba(255, 255, 255, 0.08);
2143
}
2144
2145
.app-well-app:active .overview-icon,
2146
.app-well-app:checked .overview-icon,
2147
.app-well-app.app-folder:active .overview-icon,
2148
.app-well-app.app-folder:checked .overview-icon,
2149
.show-apps:active .overview-icon,
2150
.show-apps:checked .overview-icon,
2151
.grid-search-result:active .overview-icon,
2152
.grid-search-result:checked .overview-icon {
2153
background-color: rgba(255, 255, 255, 0.2);
2154
box-shadow: 0 0 transparent;
2155
transition-duration: 200ms;
2156
}
2157
2158
.app-well-app-running-dot {
2159
width: 32px;
2160
height: 2px;
2161
background-color: white;
2162
margin-bottom: 0;
2163
}
2164
2165
.search-provider-icon,
2166
.list-search-result, .app-well-app .overview-icon,
2167
.app-well-app.app-folder .overview-icon,
2168
.show-apps .overview-icon,
2169
.grid-search-result .overview-icon {
2170
color: white;
2171
border-radius: 4px;
2172
padding: 6px;
2173
border: none;
2174
transition-duration: 100ms;
2175
text-align: center;
2176
}
2177
2178
.app-well-app.app-folder > .overview-icon {
2179
background-color: rgba(255, 255, 255, 0.1);
2180
}
2181
2182
.show-apps .show-apps-icon {
2183
color: rgba(255, 255, 255, 0.7);
2184
}
2185
2186
.show-apps:hover .show-apps-icon,
2187
.show-apps:active .show-apps-icon,
2188
.show-apps:checked .show-apps-icon,
2189
.show-apps:focus .show-apps-icon {
2190
color: white;
2191
transition-duration: 100ms;
2192
}
2193
2194
.app-folder-popup {
2195
-arrow-border-radius: 4px;
2196
-arrow-background-color: rgba(255, 255, 255, 0.1);
2197
-arrow-base: 24px;
2198
-arrow-rise: 12px;
2199
}
2200
2201
.app-folder-popup-bin {
2202
padding: 5px;
2203
}
2204
2205
.app-folder-icon {
2206
padding: 5px;
2207
spacing-rows: 5px;
2208
spacing-columns: 5px;
2209
}
2210
2211
.page-indicator {
2212
padding: 15px 20px;
2213
}
2214
2215
.page-indicator .page-indicator-icon {
2216
width: 12px;
2217
height: 12px;
2218
border: none;
2219
border-radius: 12px;
2220
background-image: none;
2221
background-color: rgba(255, 255, 255, 0.3);
2222
transition-duration: 100ms;
2223
}
2224
2225
.page-indicator:hover .page-indicator-icon {
2226
border-color: transparent;
2227
background-image: none;
2228
background-color: rgba(255, 255, 255, 0.5);
2229
}
2230
2231
.page-indicator:active .page-indicator-icon {
2232
border: none;
2233
margin: 0;
2234
background-image: none;
2235
background-color: rgba(255, 255, 255, 0.7);
2236
}
2237
2238
.page-indicator:checked .page-indicator-icon,
2239
.page-indicator:checked:active .page-indicator-icon {
2240
background-image: none;
2241
background-color: white;
2242
transition-duration: 0ms;
2243
}
2244
2245
.page-indicator:checked:active {
2246
background-image: none;
2247
background-color: transparent;
2248
}
2249
2250
.app-well-app > .overview-icon.overview-icon-with-label,
2251
.grid-search-result .overview-icon.overview-icon-with-label {
2252
padding: 10px 8px 5px 8px;
2253
spacing: 4px;
2254
}
2255
2256
.workspace-thumbnails {
2257
visible-width: 32px;
2258
spacing: 12px;
2259
padding: 12px;
2260
border-radius: 4px 0 0 4px;
2261
}
2262
2263
.workspace-thumbnails:rtl {
2264
border-radius: 0 4px 4px 0;
2265
}
2266
2267
.workspace-thumbnails .placeholder {
2268
background-image: url("assets/dash-placeholder.svg");
2269
background-size: contain;
2270
height: 24px;
2271
}
2272
2273
.workspace-thumbnail-indicator {
2274
border: 0 solid white;
2275
border-left-width: 2px;
2276
padding: 6px 10px;
2277
border-radius: 0;
2278
}
2279
2280
.all-apps,
2281
.frequent-apps > StBoxLayout {
2282
padding: 0px 88px 10px 88px;
2283
}
2284
2285
#dash, .workspace-thumbnails {
2286
transition-duration: 250ms;
2287
color: white;
2288
background-color: rgba(255, 255, 255, 0.1);
2289
border: none;
2290
}
2291
2292
.search-statustext, .no-frequent-applications-label {
2293
font-size: 48px;
2294
font-weight: 400;
2295
color: rgba(255, 255, 255, 0.5);
2296
}
2297
2298
/* NOTIFICATIONS & MESSAGE TRAY */
2299
.url-highlighter {
2300
link-color: #1A73E8;
2301
}
2302
2303
.notification-banner {
2304
font-size: 1em;
2305
width: 34em;
2306
min-height: 56px;
2307
margin: 5px;
2308
border-radius: 4px;
2309
color: rgba(0, 0, 0, 0.87);
2310
background-color: #FFFFFF;
2311
border: none;
2312
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345);
2313
}
2314
2315
.notification-banner:hover {
2316
background: #FFFFFF;
2317
}
2318
2319
.notification-banner, .notification-banner:focus, .notification-banner:active {
2320
background-color: #FFFFFF;
2321
}
2322
2323
.notification-banner .message-title, .notification-banner:focus .message-title, .notification-banner:active .message-title {
2324
color: rgba(0, 0, 0, 0.87);
2325
}
2326
2327
.notification-banner .message-content, .notification-banner:focus .message-content, .notification-banner:active .message-content {
2328
color: rgba(0, 0, 0, 0.6);
2329
}
2330
2331
.notification-banner .message-icon-bin > StIcon {
2332
color: rgba(0, 0, 0, 0.87);
2333
}
2334
2335
.notification-banner .notification-icon {
2336
padding: 5px;
2337
}
2338
2339
.notification-banner .notification-content {
2340
padding: 5px;
2341
spacing: 5px;
2342
}
2343
2344
.notification-banner .secondary-icon {
2345
icon-size: 1.14286em;
2346
}
2347
2348
.notification-banner .notification-actions {
2349
background-color: transparent;
2350
padding-top: 0;
2351
color: inherit;
2352
border-top: none;
2353
spacing: 0;
2354
}
2355
2356
.notification-banner .notification-button {
2357
min-height: 32px;
2358
padding: 0 8px;
2359
border: none;
2360
}
2361
2362
.notification-banner .notification-button:focus {
2363
box-shadow: none;
2364
}
2365
2366
.summary-source-counter {
2367
font-size: 1em;
2368
font-weight: bold;
2369
height: 1.6em;
2370
width: 1.6em;
2371
-shell-counter-overlap-x: 3px;
2372
-shell-counter-overlap-y: 3px;
2373
background-color: #1A73E8;
2374
color: white;
2375
border: 2px solid white;
2376
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5);
2377
border-radius: 0.9em;
2378
}
2379
2380
.secondary-icon {
2381
icon-size: 1.14286em;
2382
}
2383
2384
.chat-body {
2385
spacing: 5px;
2386
}
2387
2388
.chat-response {
2389
margin: 5px;
2390
}
2391
2392
.chat-log-message {
2393
color: rgba(0, 0, 0, 0.87);
2394
}
2395
2396
.chat-new-group {
2397
padding-top: 1em;
2398
}
2399
2400
.chat-received {
2401
padding-left: 4px;
2402
}
2403
2404
.chat-received:rtl {
2405
padding-left: 0px;
2406
padding-right: 4px;
2407
}
2408
2409
.chat-sent {
2410
padding-left: 18pt;
2411
color: rgba(0, 0, 0, 0.6);
2412
}
2413
2414
.chat-sent:rtl {
2415
padding-left: 0;
2416
padding-right: 18pt;
2417
}
2418
2419
.chat-meta-message {
2420
padding-left: 4px;
2421
font-size: 9pt;
2422
font-weight: 400;
2423
color: rgba(0, 0, 0, 0.6);
2424
}
2425
2426
.chat-meta-message:rtl {
2427
padding-left: 0;
2428
padding-right: 4px;
2429
}
2430
2431
.hotplug-transient-box {
2432
spacing: 6px;
2433
padding: 2px 72px 2px 12px;
2434
}
2435
2436
.hotplug-notification-item {
2437
border: none;
2438
box-shadow: none;
2439
padding: 2px 10px;
2440
}
2441
2442
.hotplug-notification-item:focus {
2443
padding: 1px 71px 1px 11px;
2444
}
2445
2446
.hotplug-notification-item-icon {
2447
icon-size: 24px;
2448
padding: 2px 5px;
2449
}
2450
2451
.hotplug-resident-box {
2452
spacing: 8px;
2453
}
2454
2455
.hotplug-resident-mount {
2456
transition-duration: 100ms;
2457
spacing: 8px;
2458
border-radius: 4px;
2459
}
2460
2461
.hotplug-resident-mount:hover {
2462
background-color: rgba(0, 0, 0, 0.08);
2463
}
2464
2465
.hotplug-resident-mount:active {
2466
transition-duration: 200ms;
2467
background-color: rgba(0, 0, 0, 0.2);
2468
}
2469
2470
.hotplug-resident-mount-label {
2471
color: inherit;
2472
padding-left: 6px;
2473
}
2474
2475
.hotplug-resident-mount-icon {
2476
icon-size: 24px;
2477
padding-left: 6px;
2478
}
2479
2480
.hotplug-resident-eject-icon {
2481
icon-size: 16px;
2482
}
2483
2484
.hotplug-resident-eject-button {
2485
padding: 7px;
2486
border-radius: 4px;
2487
color: rgba(0, 0, 0, 0.87);
2488
}
2489
2490
/* Eeeky things */
2491
.magnifier-zoom-region {
2492
border: 2px solid #1A73E8;
2493
}
2494
2495
.magnifier-zoom-region.full-screen {
2496
border-width: 0;
2497
}
2498
2499
/* On-screen Keyboard */
2500
.word-suggestions {
2501
font-size: 11.25pt;
2502
font-weight: 400;
2503
spacing: 12px;
2504
min-height: 20pt;
2505
}
2506
2507
#keyboard {
2508
background-color: rgba(0, 0, 0, 0.3);
2509
}
2510
2511
#keyboard .page-indicator {
2512
padding: 4px 4px;
2513
}
2514
2515
#keyboard .page-indicator .page-indicator-icon {
2516
width: 8px;
2517
height: 8px;
2518
}
2519
2520
.key-container {
2521
padding: 4px;
2522
spacing: 4px;
2523
}
2524
2525
.keyboard-key {
2526
min-height: 1.2em;
2527
min-width: 1.2em;
2528
font-size: 2em;
2529
font-weight: 500;
2530
border-radius: 4px;
2531
border: none;
2532
color: rgba(0, 0, 0, 0.87);
2533
background-color: #FFFFFF;
2534
border-color: transparent;
2535
box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24);
2536
text-shadow: none;
2537
icon-shadow: none;
2538
transition-duration: 100ms;
2539
}
2540
2541
.keyboard-key:focus {
2542
color: rgba(0, 0, 0, 0.87);
2543
text-shadow: none;
2544
icon-shadow: none;
2545
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345);
2546
}
2547
2548
.keyboard-key:hover, .keyboard-key:checked {
2549
color: rgba(0, 0, 0, 0.87);
2550
background-color: #FFFFFF;
2551
border-color: transparent;
2552
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345);
2553
text-shadow: none;
2554
icon-shadow: none;
2555
}
2556
2557
.keyboard-key:active {
2558
color: rgba(0, 0, 0, 0.87);
2559
background-color: rgba(205, 205, 205, 0.9688);
2560
border-color: transparent;
2561
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345);
2562
text-shadow: none;
2563
icon-shadow: none;
2564
transition-duration: 200ms;
2565
}
2566
2567
.keyboard-key:grayed {
2568
background-color: rgba(0, 0, 0, 0.3);
2569
color: white;
2570
border-color: rgba(0, 0, 0, 0.3);
2571
}
2572
2573
.keyboard-key.default-key {
2574
border-color: transparent;
2575
background-color: #FFFFFF;
2576
background-size: 24px;
2577
}
2578
2579
.keyboard-key.default-key:hover, .keyboard-key.default-key:checked {
2580
background-color: #FFFFFF;
2581
}
2582
2583
.keyboard-key.default-key:active {
2584
background-color: rgba(214, 214, 214, 0.974);
2585
}
2586
2587
.keyboard-key.enter-key {
2588
border-color: transparent;
2589
background-color: #1A73E8;
2590
background-image: url("assets/key-enter.svg");
2591
}
2592
2593
.keyboard-key.enter-key:hover, .keyboard-key.enter-key:checked {
2594
background-color: #1A73E8;
2595
}
2596
2597
.keyboard-key.enter-key:active {
2598
background-color: #488fed;
2599
}
2600
2601
.keyboard-key.shift-key-lowercase {
2602
background-image: url("assets/key-shift.svg");
2603
}
2604
2605
.keyboard-key.shift-key-uppercase {
2606
background-image: url("assets/key-shift-uppercase.svg");
2607
}
2608
2609
.keyboard-key.shift-key-uppercase:latched {
2610
background-image: url("assets/key-shift-latched-uppercase.svg");
2611
}
2612
2613
.keyboard-key.hide-key {
2614
background-image: url("assets/key-hide.svg");
2615
}
2616
2617
.keyboard-key.layout-key {
2618
background-image: url("assets/key-layout.svg");
2619
}
2620
2621
.keyboard-subkeys {
2622
color: inherit;
2623
padding: 5px;
2624
-arrow-border-radius: 0;
2625
-arrow-background-color: transparent;
2626
-arrow-border-width: 0;
2627
-arrow-border-color: transparent;
2628
-arrow-base: 0;
2629
-arrow-rise: 0;
2630
-boxpointer-gap: 5px;
2631
background-color: #FFFFFF;
2632
border-radius: 4px;
2633
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345);
2634
}
2635
2636
.emoji-page .keyboard-key {
2637
border: none;
2638
color: rgba(255, 255, 255, 0.7);
2639
background-color: transparent;
2640
border-color: transparent;
2641
box-shadow: 0 0 transparent;
2642
text-shadow: none;
2643
icon-shadow: none;
2644
transition-duration: 100ms;
2645
}
2646
2647
.emoji-page .keyboard-key:hover, .emoji-page .keyboard-key:focus {
2648
color: white;
2649
background-color: rgba(255, 255, 255, 0.08);
2650
border-color: transparent;
2651
box-shadow: 0 0 transparent;
2652
text-shadow: none;
2653
icon-shadow: none;
2654
}
2655
2656
.emoji-page .keyboard-key:active {
2657
color: white;
2658
background-color: rgba(255, 255, 255, 0.2);
2659
border-color: transparent;
2660
box-shadow: 0 0 transparent;
2661
text-shadow: none;
2662
icon-shadow: none;
2663
transition-duration: 200ms;
2664
}
2665
2666
.emoji-panel .keyboard-key:latched {
2667
border-color: transparent;
2668
background-color: #1A73E8;
2669
color: white;
2670
}
2671
2672
.candidate-popup-content {
2673
padding: 8px;
2674
spacing: 0;
2675
}
2676
2677
.candidate-index {
2678
padding: 0 4px 0 0;
2679
color: rgba(0, 0, 0, 0.6);
2680
}
2681
2682
.candidate-box {
2683
transition-duration: 100ms;
2684
min-height: 28px;
2685
padding: 0 8px;
2686
border-radius: 4px;
2687
}
2688
2689
.candidate-box:hover {
2690
background-color: rgba(0, 0, 0, 0.08);
2691
color: rgba(0, 0, 0, 0.87);
2692
transition-duration: 0ms;
2693
}
2694
2695
.candidate-box:active {
2696
background-color: rgba(0, 0, 0, 0.2);
2697
color: rgba(0, 0, 0, 0.87);
2698
transition-duration: 200ms;
2699
}
2700
2701
.candidate-box:selected {
2702
background-color: rgba(26, 115, 232, 0.24);
2703
color: rgba(0, 0, 0, 0.87);
2704
transition-duration: 0ms;
2705
}
2706
2707
.candidate-page-button-box {
2708
height: 28px;
2709
}
2710
2711
.vertical .candidate-page-button-box {
2712
padding-top: 0;
2713
}
2714
2715
.horizontal .candidate-page-button-box {
2716
padding-left: 0;
2717
}
2718
2719
.candidate-page-button {
2720
min-width: 28px;
2721
min-height: 28px;
2722
padding: 0;
2723
}
2724
2725
.candidate-page-button-previous {
2726
border-radius: 4px;
2727
border-right-width: 0;
2728
}
2729
2730
.candidate-page-button-next {
2731
border-radius: 4px;
2732
}
2733
2734
.candidate-page-button-icon {
2735
icon-size: 1.14286em;
2736
}
2737
2738
/* Auth Dialogs & Screen Shield */
2739
.user-icon {
2740
background-size: contain;
2741
border: none;
2742
color: white;
2743
border-radius: 9999px;
2744
}
2745
2746
.user-icon:hover {
2747
border-color: white;
2748
color: white;
2749
}
2750
2751
.login-dialog-banner-view {
2752
padding-top: 24px;
2753
max-width: 23em;
2754
}
2755
2756
.login-dialog {
2757
border: none;
2758
background-color: transparent;
2759
}
2760
2761
.login-dialog StEntry {
2762
color: white;
2763
selection-background-color: rgba(255, 255, 255, 0.3);
2764
selected-color: white;
2765
transition-duration: 100ms;
2766
background-color: rgba(255, 255, 255, 0.04);
2767
border-color: transparent;
2768
box-shadow: inset 0 -1px rgba(255, 255, 255, 0.3);
2769
}
2770
2771
.login-dialog StEntry:focus {
2772
border-color: transparent;
2773
box-shadow: inset 0 -2px white;
2774
}
2775
2776
.login-dialog StEntry:insensitive {
2777
color: rgba(0, 0, 0, 0.38);
2778
border-color: transparent;
2779
box-shadow: inset 0 -1px rgba(255, 255, 255, 0.12);
2780
color: rgba(255, 255, 255, 0.5);
2781
}
2782
2783
.login-dialog .modal-dialog-button-box {
2784
spacing: 3px;
2785
}
2786
2787
.login-dialog .modal-dialog-button {
2788
min-width: 48px;
2789
padding: 0 8px;
2790
color: rgba(255, 255, 255, 0.7);
2791
background-color: transparent;
2792
border-color: transparent;
2793
box-shadow: 0 0 transparent;
2794
text-shadow: none;
2795
icon-shadow: none;
2796
transition-duration: 100ms;
2797
}
2798
2799
.login-dialog .modal-dialog-button:hover, .login-dialog .modal-dialog-button:focus {
2800
color: white;
2801
background-color: rgba(255, 255, 255, 0.08);
2802
border-color: transparent;
2803
box-shadow: 0 0 transparent;
2804
text-shadow: none;
2805
icon-shadow: none;
2806
}
2807
2808
.login-dialog .modal-dialog-button:active {
2809
color: white;
2810
background-color: rgba(255, 255, 255, 0.2);
2811
border-color: transparent;
2812
box-shadow: 0 0 transparent;
2813
text-shadow: none;
2814
icon-shadow: none;
2815
transition-duration: 200ms;
2816
}
2817
2818
.login-dialog .modal-dialog-button:insensitive {
2819
color: rgba(255, 255, 255, 0.3);
2820
background-color: transparent;
2821
border-color: transparent;
2822
box-shadow: 0 0 transparent;
2823
text-shadow: none;
2824
icon-shadow: none;
2825
}
2826
2827
.login-dialog .modal-dialog-button:default {
2828
min-width: 32px;
2829
padding: 0 16px;
2830
color: white;
2831
background-color: #1A73E8;
2832
border-color: transparent;
2833
box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24);
2834
text-shadow: none;
2835
icon-shadow: none;
2836
transition-duration: 100ms;
2837
}
2838
2839
.login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus {
2840
color: white;
2841
background-color: #1A73E8;
2842
border-color: transparent;
2843
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345);
2844
text-shadow: none;
2845
icon-shadow: none;
2846
}
2847
2848
.login-dialog .modal-dialog-button:default:active {
2849
color: white;
2850
background-color: #5195ee;
2851
border-color: transparent;
2852
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.24), 0 3px 3px rgba(0, 0, 0, 0.345);
2853
text-shadow: none;
2854
icon-shadow: none;
2855
transition-duration: 200ms;
2856
}
2857
2858
.login-dialog .modal-dialog-button:default:insensitive {
2859
color: rgba(255, 255, 255, 0.5);
2860
background-color: rgba(255, 255, 255, 0.04);
2861
border-color: transparent;
2862
box-shadow: 0 0 transparent;
2863
text-shadow: none;
2864
icon-shadow: none;
2865
}
2866
2867
.login-dialog-logo-bin {
2868
padding: 24px 0px;
2869
}
2870
2871
.login-dialog-banner {
2872
color: rgba(255, 255, 255, 0.7);
2873
}
2874
2875
.login-dialog-button-box {
2876
spacing: 5px;
2877
}
2878
2879
.login-dialog-message-warning {
2880
color: #F4B400;
2881
}
2882
2883
.login-dialog-message-hint {
2884
padding-top: 0;
2885
padding-bottom: 20px;
2886
}
2887
2888
.login-dialog-user-selection-box {
2889
padding: 100px 0px;
2890
}
2891
2892
.login-dialog-not-listed-label {
2893
padding-left: 2px;
2894
}
2895
2896
.login-dialog-not-listed-button:focus .login-dialog-not-listed-label,
2897
.login-dialog-not-listed-button:hover .login-dialog-not-listed-label {
2898
color: white;
2899
}
2900
2901
.login-dialog-not-listed-label {
2902
transition-duration: 100ms;
2903
font-size: 1em;
2904
font-weight: bold;
2905
color: rgba(255, 255, 255, 0.7);
2906
padding-top: 1em;
2907
border-radius: 4px;
2908
}
2909
2910
.login-dialog-not-listed-label:hover {
2911
background-color: rgba(255, 255, 255, 0.08);
2912
color: white;
2913
}
2914
2915
.login-dialog-not-listed-label:focus {
2916
background-color: rgba(255, 255, 255, 0.12);
2917
}
2918
2919
.login-dialog-not-listed-label:active {
2920
transition-duration: 200ms;
2921
background-color: rgba(255, 255, 255, 0.2);
2922
color: white;
2923
}
2924
2925
.login-dialog-user-list-view {
2926
-st-vfade-offset: 1em;
2927
}
2928
2929
.login-dialog-user-list {
2930
spacing: 12px;
2931
width: 23em;
2932
}
2933
2934
.login-dialog-user-list:expanded .login-dialog-user-list-item:selected {
2935
background-color: rgba(255, 255, 255, 0.12);
2936
color: white;
2937
}
2938
2939
.login-dialog-user-list:expanded .login-dialog-user-list-item:hover {
2940
background-color: rgba(255, 255, 255, 0.08);
2941
color: white;
2942
}
2943
2944
.login-dialog-user-list:expanded .login-dialog-user-list-item:active {
2945
background-color: rgba(255, 255, 255, 0.2);
2946
color: white;
2947
}
2948
2949
.login-dialog-user-list:expanded .login-dialog-user-list-item:logged-in {
2950
border-right: 2px solid white;
2951
}
2952
2953
.login-dialog-user-list-item {
2954
transition-duration: 100ms;
2955
border-radius: 4px;
2956
padding: 6px;
2957
color: rgba(255, 255, 255, 0.7);
2958
}
2959
2960
.login-dialog-user-list-item:ltr .user-widget {
2961
padding-right: 1em;
2962
}
2963
2964
.login-dialog-user-list-item:rtl .user-widget {
2965
padding-left: 1em;
2966
}
2967
2968
.login-dialog-user-list-item:hover {
2969
background-color: rgba(255, 255, 255, 0.08);
2970
color: white;
2971
}
2972
2973
.login-dialog-user-list-item:active {
2974
transition-duration: 200ms;
2975
background-color: rgba(255, 255, 255, 0.2);
2976
color: white;
2977
}
2978
2979
.login-dialog-user-list-item .login-dialog-timed-login-indicator {
2980
height: 2px;
2981
margin-top: 6px;
2982
background-color: white;
2983
}
2984
2985
.login-dialog-user-list-item:focus .login-dialog-timed-login-indicator {
2986
background-color: white;
2987
}
2988
2989
.login-dialog-username,
2990
.user-widget-label {
2991
color: white;
2992
font-size: 15pt;
2993
font-weight: 500;
2994
text-align: left;
2995
padding-left: 15px;
2996
}
2997
2998
.user-widget-label:ltr {
2999
padding-left: 14px;
3000
}
3001
3002
.user-widget-label:rtl {
3003
padding-right: 14px;
3004
}
3005
3006
.login-dialog-prompt-layout {
3007
padding-top: 24px;
3008
padding-bottom: 12px;
3009
spacing: 8px;
3010
width: 23em;
3011
}
3012
3013
.login-dialog-prompt-label {
3014
color: rgba(255, 255, 255, 0.7);
3015
font-size: 1em;
3016
padding-top: 1em;
3017
}
3018
3019
.login-dialog-session-list-button StIcon {
3020
icon-size: 1.25em;
3021
}
3022
3023
.login-dialog-session-list-button {
3024
color: rgba(255, 255, 255, 0.7);
3025
}
3026
3027
.login-dialog-session-list-button:hover, .login-dialog-session-list-button:focus {
3028
color: white;
3029
}
3030
3031
.login-dialog-session-list-button:active {
3032
color: white;
3033
}
3034
3035
.screen-shield-arrows {
3036
padding-bottom: 3em;
3037
}
3038
3039
.screen-shield-arrows Gjs_Arrow {
3040
color: white;
3041
width: 80px;
3042
height: 48px;
3043
-arrow-thickness: 12px;
3044
-arrow-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24);
3045
}
3046
3047
.screen-shield-clock {
3048
color: white;
3049
text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24);
3050
font-weight: normal;
3051
text-align: center;
3052
padding-bottom: 1.5em;
3053
}
3054
3055
.screen-shield-clock-time {
3056
font-size: 96px;
3057
font-weight: 300;
3058
text-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.12), 0 1px 1px rgba(0, 0, 0, 0.24);
3059
font-feature-settings: "tnum";
3060
}
3061
3062
.screen-shield-clock-date {
3063
font-size: 34px;
3064
font-weight: 400;
3065
}
3066
3067
.screen-shield-notifications-container {
3068
spacing: 6px;
3069
width: 30em;
3070
background-color: transparent;
3071
max-height: 500px;
3072
}
3073
3074
.screen-shield-notifications-container .summary-notification-stack-scrollview {
3075
padding-top: 0;
3076
padding-bottom: 0;
3077
}
3078
3079
.screen-shield-notifications-container .notification,
3080
.screen-shield-notifications-container .screen-shield-notification-source {
3081
padding: 8px;
3082
border: none;
3083
background-color: rgba(0, 0, 0, 0.3);
3084
color: white;
3085
border-radius: 4px;
3086
}
3087
3088
.screen-shield-notifications-container .notification {
3089
margin-right: 16px;
3090
}
3091
3092
.screen-shield-notification-label {
3093
min-height: 22px;
3094
padding: 2px 0px 0px 16px;
3095
font-weight: bold;
3096
}
3097
3098
.screen-shield-notification-count-text {
3099
min-height: 22px;
3100
padding: 2px 0px 0px 16px;
3101
color: rgba(255, 255, 255, 0.7);
3102
}
3103
3104
#panel.lock-screen {
3105
background-color: rgba(0, 0, 0, 0.3);
3106
}
3107
3108
.screen-shield-background {
3109
background: black;
3110
box-shadow: 0 19px 19px rgba(0, 0, 0, 0.6), 0 15px 6px rgba(0, 0, 0, 0.44);
3111
}
3112
3113
#lockDialogGroup {
3114
background: #212121;
3115
background-size: cover;
3116
color: rgba(255, 255, 255, 0.7);
3117
}
3118
3119
#LookingGlassDialog {
3120
background-color: #FFFFFF;
3121
spacing: 4px;
3122
padding: 0;
3123
border: none;
3124
border-radius: 4px;
3125
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44);
3126
}
3127
3128
#LookingGlassDialog > #Toolbar {
3129
padding: 0 8px;
3130
border: none;
3131
border-radius: 0;
3132
background-color: rgba(255, 255, 255, 0.01);
3133
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.12);
3134
}
3135
3136
#LookingGlassDialog .labels {
3137
spacing: 0;
3138
}
3139
3140
#LookingGlassDialog .notebook-tab {
3141
-natural-hpadding: 12px;
3142
-minimum-hpadding: 6px;
3143
font-weight: bold;
3144
color: rgba(0, 0, 0, 0.6);
3145
transition-duration: 100ms;
3146
padding-left: 16px;
3147
padding-right: 16px;
3148
min-height: 32px;
3149
padding: 0 32px;
3150
}
3151
3152
#LookingGlassDialog .notebook-tab:hover {
3153
background-color: rgba(0, 0, 0, 0.08);
3154
color: rgba(0, 0, 0, 0.87);
3155
text-shadow: none;
3156
}
3157
3158
#LookingGlassDialog .notebook-tab:active {
3159
background-color: rgba(0, 0, 0, 0.2);
3160
color: rgba(0, 0, 0, 0.87);
3161
transition-duration: 200ms;
3162
}
3163
3164
#LookingGlassDialog .notebook-tab:selected {
3165
border-bottom-width: 0;
3166
border-color: transparent;
3167
background-color: rgba(255, 255, 255, 0.01);
3168
box-shadow: inset 0 -2px 0px #1A73E8;
3169
color: rgba(0, 0, 0, 0.87);
3170
text-shadow: none;
3171
}
3172
3173
#LookingGlassDialog StBoxLayout#EvalBox {
3174
padding: 4px;
3175
spacing: 4px;
3176
}
3177
3178
#LookingGlassDialog StBoxLayout#ResultsArea {
3179
spacing: 4px;
3180
}
3181
3182
.lg-dialog StEntry {
3183
selection-background-color: rgba(26, 115, 232, 0.24);
3184
selected-color: rgba(0, 0, 0, 0.87);
3185
}
3186
3187
.lg-dialog .shell-link {
3188
color: #1A73E8;
3189
}
3190
3191
.lg-dialog .shell-link:hover {
3192
color: #1A73E8;
3193
}
3194
3195
.lg-completions-text {
3196
font-size: 1em;
3197
font-style: italic;
3198
}
3199
3200
.lg-obj-inspector-title {
3201
spacing: 4px;
3202
}
3203
3204
.lg-obj-inspector-button {
3205
min-height: 32px;
3206
min-width: 48px;
3207
padding: 0 8px;
3208
border: none;
3209
border-radius: 4px;
3210
font-size: 10.5pt;
3211
font-weight: 500;
3212
color: #1A73E8;
3213
background-color: transparent;
3214
border-color: transparent;
3215
box-shadow: 0 0 transparent;
3216
text-shadow: none;
3217
icon-shadow: none;
3218
transition-duration: 100ms;
3219
}
3220
3221
.lg-obj-inspector-button:hover {
3222
color: #1A73E8;
3223
background-color: rgba(26, 115, 232, 0.08);
3224
border-color: transparent;
3225
box-shadow: 0 0 transparent;
3226
text-shadow: none;
3227
icon-shadow: none;
3228
}
3229
3230
.lg-obj-inspector-button:active {
3231
color: #1A73E8;
3232
background-color: rgba(26, 115, 232, 0.2);
3233
border-color: transparent;
3234
box-shadow: 0 0 transparent;
3235
text-shadow: none;
3236
icon-shadow: none;
3237
transition-duration: 200ms;
3238
}
3239
3240
.lg-obj-inspector-button:insensitive {
3241
color: rgba(0, 0, 0, 0.26);
3242
background-color: transparent;
3243
border-color: transparent;
3244
box-shadow: 0 0 transparent;
3245
text-shadow: none;
3246
icon-shadow: none;
3247
}
3248
3249
.lg-obj-inspector-button:focus {
3250
color: #1A73E8;
3251
background-color: rgba(26, 115, 232, 0.12);
3252
text-shadow: none;
3253
icon-shadow: none;
3254
box-shadow: 0 0 transparent;
3255
}
3256
3257
.lg-obj-inspector-button:hover {
3258
border: none;
3259
}
3260
3261
#lookingGlassExtensions {
3262
padding: 4px;
3263
}
3264
3265
.lg-extensions-list {
3266
padding: 4px;
3267
spacing: 6px;
3268
}
3269
3270
.lg-extension {
3271
border: none;
3272
border-radius: 4px;
3273
padding: 4px;
3274
}
3275
3276
.lg-extension-name {
3277
font-size: 18pt;
3278
font-weight: 400;
3279
}
3280
3281
.lg-extension-meta {
3282
spacing: 6px;
3283
}
3284
3285
#LookingGlassPropertyInspector {
3286
background: #FFFFFF;
3287
border: none;
3288
border-radius: 4px;
3289
padding: 6px;
3290
box-shadow: 0 14px 14px rgba(0, 0, 0, 0.5), 0 10px 5px rgba(0, 0, 0, 0.44);
3291
}
3292
3293
/* Dash to Dock */
3294
#dashtodockContainer #dash {
3295
background-color: rgba(0, 0, 0, 0.6);
3296
}
3297
3298
#dashtodockContainer:overview #dash {
3299
background-color: rgba(255, 255, 255, 0.1);
3300
}
3301
3302
#dashtodockContainer.extended:overview #dash {
3303
background-color: transparent;
3304
}
3305
3306
#dashtodockContainer.left #dash,
3307
#dashtodockContainer.right #dash {
3308
padding: 3px 0;
3309
}
3310
3311
#dashtodockContainer.top #dash,
3312
#dashtodockContainer.bottom #dash {
3313
padding: 0 3px;
3314
}
3315
3316
#dashtodockContainer.extended #dash {
3317
padding: 0;
3318
border-radius: 0;
3319
}
3320
3321
#dashtodockContainer.left .dash-item-container > StWidget,
3322
#dashtodockContainer.right .dash-item-container > StWidget,
3323
#dashtodockContainer.extended.left .dash-item-container > StWidget,
3324
#dashtodockContainer.extended.right .dash-item-container > StWidget {
3325
padding: 3px 6px;
3326
}
3327
3328
#dashtodockContainer.extended.left .dash-item-container:first-child > StWidget,
3329
#dashtodockContainer.extended.right .dash-item-container:first-child > StWidget {
3330
padding: 6px 6px 3px 6px;
3331
}
3332
3333
#dashtodockContainer.extended.left .dash-item-container:last-child > StWidget,
3334
#dashtodockContainer.extended.right .dash-item-container:last-child > StWidget {
3335
padding: 3px 6px 6px 6px;
3336
}
3337
3338
#dashtodockContainer.top .dash-item-container > StWidget,
3339
#dashtodockContainer.bottom .dash-item-container > StWidget,
3340
#dashtodockContainer.extended.top .dash-item-container > StWidget,
3341
#dashtodockContainer.extended.bottom .dash-item-container > StWidget {
3342
padding: 6px 3px;
3343
}
3344
3345
#dashtodockContainer.extended.top .dash-item-container:first-child > StWidget,
3346
#dashtodockContainer.extended.bottom .dash-item-container:first-child > StWidget {
3347
padding: 6px 3px 6px 6px;
3348
}
3349
3350
#dashtodockContainer.extended.top .dash-item-container:last-child > StWidget,
3351
#dashtodockContainer.extended.bottom .dash-item-container:last-child > StWidget {
3352
padding: 6px 6px 6px 3px;
3353
}
3354
3355
#dashtodockContainer .focused .overview-icon {
3356
background-color: rgba(0, 0, 0, 0.12);
3357
}
3358
3359
#dashtodockContainer .default.focused .overview-icon {
3360
background-color: transparent;
3361
}
3362
3363
#dashtodockContainer .app-well-app-running-dot {
3364
background-color: transparent;
3365
}
3366
3367
#dashtodockContainer .default {
3368
background-size: cover;
3369
}
3370
3371
#dashtodockContainer.left .default.running1 {
3372
background-image: url("assets/dash/left-running1.svg");
3373
}
3374
3375
#dashtodockContainer.left .default.running1.focused {
3376
background-image: url("assets/dash/left-running1-focused.svg");
3377
}
3378
3379
#dashtodockContainer.left .default.running2 {
3380
background-image: url("assets/dash/left-running2.svg");
3381
}
3382
3383
#dashtodockContainer.left .default.running2.focused {
3384
background-image: url("assets/dash/left-running2-focused.svg");
3385
}
3386
3387
#dashtodockContainer.left .default.running3 {
3388
background-image: url("assets/dash/left-running3.svg");
3389
}
3390
3391
#dashtodockContainer.left .default.running3.focused {
3392
background-image: url("assets/dash/left-running3-focused.svg");
3393
}
3394
3395
#dashtodockContainer.left .default.running4 {
3396
background-image: url("assets/dash/left-running4.svg");
3397
}
3398
3399
#dashtodockContainer.left .default.running4.focused {
3400
background-image: url("assets/dash/left-running4-focused.svg");
3401
}
3402
3403
#dashtodockContainer.right .default.running1 {
3404
background-image: url("assets/dash/right-running1.svg");
3405
}
3406
3407
#dashtodockContainer.right .default.running1.focused {
3408
background-image: url("assets/dash/right-running1-focused.svg");
3409
}
3410
3411
#dashtodockContainer.right .default.running2 {
3412
background-image: url("assets/dash/right-running2.svg");
3413
}
3414
3415
#dashtodockContainer.right .default.running2.focused {
3416
background-image: url("assets/dash/right-running2-focused.svg");
3417
}
3418
3419
#dashtodockContainer.right .default.running3 {
3420
background-image: url("assets/dash/right-running3.svg");
3421
}
3422
3423
#dashtodockContainer.right .default.running3.focused {
3424
background-image: url("assets/dash/right-running3-focused.svg");
3425
}
3426
3427
#dashtodockContainer.right .default.running4 {
3428
background-image: url("assets/dash/right-running4.svg");
3429
}
3430
3431
#dashtodockContainer.right .default.running4.focused {
3432
background-image: url("assets/dash/right-running4-focused.svg");
3433
}
3434
3435
#dashtodockContainer.top .default.running1 {
3436
background-image: url("assets/dash/top-running1.svg");
3437
}
3438
3439
#dashtodockContainer.top .default.running1.focused {
3440
background-image: url("assets/dash/top-running1-focused.svg");
3441
}
3442
3443
#dashtodockContainer.top .default.running2 {
3444
background-image: url("assets/dash/top-running2.svg");
3445
}
3446
3447
#dashtodockContainer.top .default.running2.focused {
3448
background-image: url("assets/dash/top-running2-focused.svg");
3449
}
3450
3451
#dashtodockContainer.top .default.running3 {
3452
background-image: url("assets/dash/top-running3.svg");
3453
}
3454
3455
#dashtodockContainer.top .default.running3.focused {
3456
background-image: url("assets/dash/top-running3-focused.svg");
3457
}
3458
3459
#dashtodockContainer.top .default.running4 {
3460
background-image: url("assets/dash/top-running4.svg");
3461
}
3462
3463
#dashtodockContainer.top .default.running4.focused {
3464
background-image: url("assets/dash/top-running4-focused.svg");
3465
}
3466
3467
#dashtodockContainer.bottom .default.running1 {
3468
background-image: url("assets/dash/bottom-running1.svg");
3469
}
3470
3471
#dashtodockContainer.bottom .default.running1.focused {
3472
background-image: url("assets/dash/bottom-running1-focused.svg");
3473
}
3474
3475
#dashtodockContainer.bottom .default.running2 {
3476
background-image: url("assets/dash/bottom-running2.svg");
3477
}
3478
3479
#dashtodockContainer.bottom .default.running2.focused {
3480
background-image: url("assets/dash/bottom-running2-focused.svg");
3481
}
3482
3483
#dashtodockContainer.bottom .default.running3 {
3484
background-image: url("assets/dash/bottom-running3.svg");
3485
}
3486
3487
#dashtodockContainer.bottom .default.running3.focused {
3488
background-image: url("assets/dash/bottom-running3-focused.svg");
3489
}
3490
3491
#dashtodockContainer.bottom .default.running4 {
3492
background-image: url("assets/dash/bottom-running4.svg");
3493
}
3494
3495
#dashtodockContainer.bottom .default.running4.focused {
3496
background-image: url("assets/dash/bottom-running4-focused.svg");
3497
}
3498
3499
/* Simple Dock */
3500
#dash:desktop {
3501
background-color: rgba(0, 0, 0, 0.6);
3502
}
3503
3504
/* GPaste */
3505
.popup-menu .search-entry {
3506
color: rgba(0, 0, 0, 0.87);
3507
selection-background-color: rgba(26, 115, 232, 0.24);
3508
selected-color: rgba(0, 0, 0, 0.87);
3509
transition-duration: 100ms;
3510
background-color: rgba(0, 0, 0, 0.04);
3511
border-color: transparent;
3512
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.26);
3513
}
3514
3515
.popup-menu .search-entry:hover {
3516
box-shadow: inset 0 -1px rgba(0, 0, 0, 0.87);
3517
}
3518
3519
.popup-menu .search-entry:focus {
3520
border-color: transparent;
3521
box-shadow: inset 0 -2px #1A73E8;
3522
color: rgba(0, 0, 0, 0.87);
3523
}
3524
3525
.popup-menu .search-entry .search-entry-icon {
3526
color: rgba(0, 0, 0, 0.6);
3527
}
3528
3529
.popup-menu .search-entry:hover .search-entry-icon, .popup-menu .search-entry:focus .search-entry-icon {
3530
color: rgba(0, 0, 0, 0.87);
3531
}
3532