~ubuntu-branches/debian/sid/gnome-shell/sid

« back to all changes in this revision

Viewing changes to data/theme/gnome-shell.css

  • Committer: Package Import Robot
  • Author(s): Emilio Pozuelo Monfort, Petr Salinger, Emilio Pozuelo Monfort
  • Date: 2013-10-13 17:47:35 UTC
  • mfrom: (1.2.17) (18.1.41 experimental)
  • Revision ID: package-import@ubuntu.com-20131013174735-2npsu0w5wk0e6vgb
Tags: 3.8.4-4
[ Petr Salinger ]
* Restrict dependency on gir1.2-nmgtk-1.0 to linux-any (Closes: #726099)

[ Emilio Pozuelo Monfort ]
* Upload to unstable.

Show diffs side-by-side

added added

removed removed

Lines of Context:
38
38
 
39
39
/* small */
40
40
.app-well-menu,
41
 
.contact-details-status,
42
 
.run-dialog-label,
43
41
.run-dialog-error-label {
44
42
    font-size: 9pt;
45
43
}
48
46
.dash-label,
49
47
.window-caption,
50
48
.switcher-list, 
51
 
.source-title,
52
49
.app-well-app > .overview-icon,
53
 
.remove-favorite > .overview-icon,
54
 
.search-result-content > .overview-icon {
 
50
.show-apps > .overview-icon,
 
51
.grid-search-result .overview-icon {
55
52
    font-size: 9pt;
56
53
    font-weight: bold;
57
54
}
58
55
 
59
56
/* Scroll Bars */
60
57
 
61
 
StScrollBar
62
 
{
 
58
StScrollBar {
63
59
    padding: 0px;
64
60
}
65
61
 
66
 
StScrollView.vfade
67
 
{
 
62
StScrollView.vfade {
68
63
    -st-vfade-offset: 68px;
69
64
}
70
65
 
71
 
StScrollView.hfade
72
 
{
 
66
StScrollView.hfade {
73
67
    -st-hfade-offset: 68px;
74
68
}
75
69
 
76
 
StScrollView StScrollBar
77
 
{
78
 
    min-width: 16px;
79
 
    min-height: 16px;
 
70
StScrollView StScrollBar {
 
71
    min-width: 14px;
 
72
    min-height: 14px;
80
73
}
81
74
 
82
 
 
83
75
StScrollBar StBin#trough {
84
 
    background-color: #080808;
85
 
    border: 1px solid #2d2d2d;
86
 
    border-radius: 8px;
87
 
}
88
 
 
89
 
StScrollBar StButton#vhandle
90
 
{
91
 
    background-image: url("scroll-vhandle.svg");
92
 
    background-color: #252525;
93
 
    border: 1px solid #080808;
94
 
    border-radius: 8px;
95
 
}
96
 
 
97
 
StScrollBar StButton#hhandle
98
 
{
99
 
    background-image: url("scroll-hhandle.svg");
100
 
    background-color: #252525;
101
 
    border: 1px solid #080808;
 
76
    background-color: rgba(0,0,0,0.3);
 
77
    border-radius: 8px;
 
78
}
 
79
 
 
80
StScrollBar StButton#vhandle {
 
81
    background-color: #5d6464;
 
82
    border: 2px solid #242424;
 
83
    border-radius: 8px;
 
84
}
 
85
 
 
86
StScrollBar StButton#hhandle {
 
87
    background-color: #5d6464;
 
88
    border: 2px solid #242424;
102
89
    border-radius: 8px;
103
90
}
104
91
 
105
92
StScrollBar StButton#hhandle:hover,
106
 
StScrollBar StButton#vhandle:hover
107
 
{
108
 
    background-color: #292929;
 
93
StScrollBar StButton#vhandle:hover {
 
94
    background-color: #777d7c;
 
95
}
 
96
 
 
97
StScrollBar StButton#hhandle:active,
 
98
StScrollBar StButton#vhandle:active {
 
99
    background-color: #3465a4;
109
100
}
110
101
 
111
102
/* Check Boxes */
134
125
 
135
126
/* PopupMenu */
136
127
 
137
 
.popup-menu-boxpointer {
 
128
.popup-menu-boxpointer,
 
129
.candidate-popup-boxpointer {
138
130
    -arrow-border-radius: 8px;
139
131
    -arrow-background-color: rgba(0,0,0,0.9);
140
132
    -arrow-border-width: 2px;
158
150
    box-shadow: inset 0px 2px 4px rgba(0,0,0,0.9);
159
151
}
160
152
 
161
 
.popup-sub-menu .popup-menu-item:ltr {
 
153
.popup-sub-menu:scrolled .popup-menu-item:ltr {
162
154
    padding-right: 0em;
163
155
}
164
156
 
165
 
.popup-sub-menu .popup-menu-item:rtl {
 
157
.popup-sub-menu:scrolled .popup-menu-item:rtl {
166
158
    padding-left: 0em;
167
159
}
168
160
 
214
206
}
215
207
 
216
208
.popup-separator-menu-item {
217
 
    -gradient-height: 2px;
218
 
    -gradient-start: rgba(8,8,8,0);
219
 
    -gradient-end: #333333;
220
 
    -margin-horizontal: 1.5em;
221
 
    height: 1em;
 
209
    -gradient-height: 1px;
 
210
    -gradient-start: rgba(255,255,255,0.0);
 
211
    -gradient-end: rgba(255,255,255,0.3);
 
212
    -margin-horizontal: 24px;
 
213
    height: 1px;
 
214
    padding: 8px 0px;
222
215
}
223
216
 
224
217
.popup-alternating-menu-item:alternate {
241
234
    spacing: .5em;
242
235
}
243
236
 
244
 
.popup-inactive-menu-item {
 
237
.popup-status-menu-item {
245
238
    font-weight: normal;
246
239
    color: #999;
247
240
}
248
241
 
249
 
.popup-subtitle-menu-item {
 
242
.popup-inactive-menu-item, .popup-inactive-menu-item:insensitive {
 
243
    color: white;
 
244
}
 
245
 
 
246
.popup-subtitle-menu-item, .popup-subtitle-menu-item:insensitive {
250
247
    font-weight: bold;
 
248
    color: white;
251
249
}
252
250
 
253
251
.popup-menu-icon {
254
252
    icon-size: 1.09em;
255
253
}
256
254
 
 
255
.popup-battery-percentage {
 
256
    padding-left: 24px;
 
257
}
 
258
 
257
259
/* Switches */
258
260
.toggle-switch {
259
261
    width: 65px;
284
286
 
285
287
/* Buttons */
286
288
 
287
 
.dash-search-button,
 
289
.candidate-page-button,
288
290
.notification-button,
289
291
.notification-icon-button,
290
292
.hotplug-notification-item,
291
293
.hotplug-resident-eject-button,
292
 
.modal-dialog-button {
293
 
    font-weight: bold;
 
294
.modal-dialog-button,
 
295
.app-view-control {
294
296
    border: 1px solid #8b8b8b;
295
297
    background-gradient-direction: vertical;
296
298
    background-gradient-start: rgba(255, 255, 255, 0.2);
297
299
    background-gradient-end: rgba(255, 255, 255, 0);
298
300
}
299
301
 
300
 
.dash-search-button:hover,
 
302
.modal-dialog-button {
 
303
    font-weight: bold;
 
304
}
 
305
 
 
306
.candidate-page-button:hover,
301
307
.notification-button:hover,
302
308
.notification-icon-button:hover,
303
309
.hotplug-notification-item:hover,
307
313
    background-gradient-end: rgba(255, 255, 255, 0.1);
308
314
}
309
315
 
310
 
.dash-search-button:selected,
311
 
.dash-search-button:focus,
312
316
.notification-button:focus,
313
317
.notification-icon-button:focus,
314
318
.hotplug-notification-item:focus,
315
 
.modal-dialog-button:focus {
316
 
    border: 2px solid #8b8b8b;
317
 
}
318
 
 
319
 
.dash-search-button:active,
320
 
.dash-search-button:pressed,
 
319
.modal-dialog-button:focus,
 
320
.app-view-control:focus {
 
321
    border-width: 2px;
 
322
}
 
323
 
 
324
.app-view-control:focus {
 
325
    padding: 3px;
 
326
}
 
327
 
 
328
.app-view-control:first-child:ltr:focus,
 
329
.app-view-control:last-child:rtl:focus {
 
330
    border-right-width: 1px;
 
331
}
 
332
 
 
333
.candidate-page-button:active,
 
334
.candidate-page-button:pressed,
321
335
.notification-button:active,
322
336
.notification-icon-button:active,
323
337
.hotplug-notification-item:active,
324
338
.hotplug-resident-eject-button:active,
325
339
.modal-dialog-button:active,
326
 
.modal-dialog-button:pressed {
 
340
.modal-dialog-button:pressed,
 
341
.app-view-control:checked {
327
342
    background-gradient-start: rgba(255, 255, 255, 0);
328
343
    background-gradient-end: rgba(255, 255, 255, 0.2);
329
344
}
330
345
 
 
346
.candidate-page-button:insensitive,
 
347
.notification-button:insensitive,
 
348
.notification-icon-button:insensitive,
 
349
.modal-dialog-button:insensitive {
 
350
    border-color: #666666;
 
351
    color: #9f9f9f;
 
352
    background-gradient-direction: none;
 
353
    background-color: rgba(102, 102, 102, 0.15);
 
354
}
 
355
 
 
356
/* Common radii */
 
357
 
 
358
#searchEntry,
 
359
.modal-dialog-button,
 
360
.notification-button,
 
361
.hotplug-notification-item,
 
362
.app-view-controls {
 
363
    border-radius: 18px;
 
364
}
 
365
 
 
366
.app-view-control:first-child:ltr,
 
367
.app-view-control:last-child:rtl {
 
368
    border-radius: 18px 0px 0px 18px;
 
369
    border-right-width: 0px;
 
370
}
 
371
 
 
372
.app-view-control:last-child:ltr,
 
373
.app-view-control:first-child:rtl {
 
374
    border-radius: 0px 18px 18px 0px;
 
375
}
 
376
 
 
377
/* Entries */
 
378
 
 
379
#searchEntry,
 
380
.notification StEntry,
 
381
.modal-dialog StEntry {
 
382
    color: rgb(64, 64, 64);
 
383
    caret-color: rgb(64, 64, 64);
 
384
    font-size: 12pt;
 
385
    caret-size: 1px;
 
386
    selected-color: white;
 
387
    padding: 4px 12px;
 
388
}
 
389
 
 
390
#searchEntry,
 
391
.run-dialog-entry,
 
392
.notification StEntry {
 
393
    border: 2px solid rgba(245,245,245,0.2);
 
394
    background-gradient-start: rgba(5,5,6,0.1);
 
395
    background-gradient-end: rgba(254,254,254,0.1);
 
396
    background-gradient-direction: vertical;
 
397
    transition-duration: 300ms;
 
398
    box-shadow: inset 0px 2px 4px rgba(0,0,0,0.6);
 
399
}
 
400
 
 
401
#searchEntry:focus,
 
402
#searchEntry:hover,
 
403
.notification StEntry:focus,
 
404
.modal-dialog StEntry {
 
405
    border: 2px solid rgb(136,138,133);
 
406
    background-gradient-start: rgb(200,200,200);
 
407
    background-gradient-end: white;
 
408
    background-gradient-direction: vertical;
 
409
    box-shadow: inset 0px 2px 4px rgba(0,0,0,0.6);
 
410
}
 
411
 
 
412
.notification StEntry:focus,
 
413
.modal-dialog StEntry:focus {
 
414
    border: 2px solid #3465a4;
 
415
}
 
416
 
 
417
#searchEntry {
 
418
    border-color: rgba(245,245,245,0.3);
 
419
    color: rgb(192, 192, 192);
 
420
    caret-color: rgb(192, 192, 192);
 
421
}
 
422
 
 
423
#searchEntry:hover {
 
424
    color: rgb(128, 128, 128);
 
425
    caret-color: rgb(128, 128, 128);
 
426
}
 
427
 
 
428
#searchEntry:focus {
 
429
    color: rgb(64, 64, 64);
 
430
    caret-color: rgb(64, 64, 64);
 
431
    font-weight: bold;
 
432
    transition-duration: 0ms;
 
433
}
 
434
 
 
435
.notification StEntry,
 
436
.modal-dialog StEntry {
 
437
    border-radius: 5px;
 
438
    padding: 4px 4px;
 
439
}
 
440
 
 
441
.prompt-dialog-password-entry .capslock-warning,
 
442
.login-dialog-prompt-entry .capslock-warning {
 
443
    icon-size: 16px;
 
444
    warning-color: #999;
 
445
    padding: 0 4px;
 
446
}
 
447
 
 
448
.modal-dialog StEntry:insensitive {
 
449
    border-color: #666666;
 
450
    color: #9f9f9f;
 
451
    border: 2px solid #9f9f9f;
 
452
    background-gradient-direction: none;
 
453
    background-color: rgba(102, 102, 102, 0.15);
 
454
    box-shadow: inset 0 0 rgba(0,0,0,1.0);
 
455
}
 
456
 
331
457
/* Panel */
332
458
 
333
459
#panel {
336
462
    height: 1.86em;
337
463
}
338
464
 
 
465
#panel.lock-screen {
 
466
    background-color: rgba(0,0,0,0.3);
 
467
}
 
468
 
 
469
#panel.unlock-screen,
 
470
#panel.login-screen {
 
471
    background-color: transparent;
 
472
}
 
473
 
339
474
#panelLeft, #panelCenter {
340
475
    spacing: 4px;
341
476
}
357
492
}
358
493
 
359
494
.panel-corner {
360
 
    -panel-corner-radius: 10px;
 
495
    -panel-corner-radius: 6px;
361
496
    -panel-corner-background-color: black;
362
497
    -panel-corner-border-width: 2px;
363
498
    -panel-corner-border-color: transparent;
369
504
    -panel-corner-border-color: rgba(255,255,255,0.8);
370
505
}
371
506
 
 
507
.panel-corner.lock-screen,
 
508
.panel-corner.unlock-screen,
 
509
.panel-corner.login-screen {
 
510
    -panel-corner-background-color: transparent;
 
511
    -panel-corner-border-color: transparent;
 
512
}
 
513
 
372
514
#appMenu {
 
515
    spinner-image: url("process-working.svg");
373
516
    spacing: 4px;
374
517
}
375
518
 
398
541
    -minimum-hpadding: 6px;
399
542
    font-weight: bold;
400
543
    color: #ccc;
401
 
    transition-duration: 100;
 
544
    transition-duration: 100ms;
 
545
}
 
546
 
 
547
#panel.unlock-screen .panel-button,
 
548
#panel.lock-screen .panel-button,
 
549
#panel.login-screen .panel-button {
 
550
    color: #e6e6e6;
 
551
}
 
552
 
 
553
#panel.unlock-screen .panel-button:hover,
 
554
#panel.lock-screen .panel-button:hover,
 
555
#panel.login-screen .panel-button:hover,
 
556
#panel.unlock-screen .panel-button:active,
 
557
#panel.lock-screen .panel-button:active,
 
558
#panel.login-screen .panel-button:active,
 
559
#panel.unlock-screen .panel-button:focus,
 
560
#panel.lock-screen .panel-button:focus,
 
561
#panel.login-screen .panel-button:focus {
 
562
    color: white;
402
563
}
403
564
 
404
565
.panel-button:hover {
409
570
.panel-button:active,
410
571
.panel-button:overview,
411
572
.panel-button:focus {
412
 
    border-image: url("panel-button-border.svg") 10 10 0 2;
 
573
    border-image: url("panel-button-border.svg") 6 10 0 2;
413
574
    background-image: url("panel-button-highlight-wide.svg");
414
575
    color: white;
415
576
    text-shadow: black 0px 2px 2px;
428
589
}
429
590
 
430
591
.panel-menu {
431
 
    -boxpointer-gap: 4px
 
592
    -boxpointer-gap: 4px;
 
593
}
 
594
 
 
595
.panel-status-button-box {
 
596
    spacing: 4px;
 
597
}
 
598
 
 
599
.lock-screen-status-button-box {
 
600
    spacing: 8px;
432
601
}
433
602
 
434
603
/* User Menu */
451
620
    border-radius: 5px;
452
621
    width: 48pt;
453
622
    height: 48pt;
 
623
    background-size: contain;
454
624
}
455
625
 
456
626
.status-chooser-user-icon:hover {
468
638
}
469
639
 
470
640
.status-chooser-combo.popup-combo-menu {
471
 
    background-color: rgba(0,0,0,0.7);
472
641
    padding: .4em 0em;
473
642
    border-radius: 4px;
474
643
    border: 1px solid #5f5f5f;
486
655
/* Overview */
487
656
 
488
657
#overview {
489
 
    spacing: 12px;
490
 
}
491
 
 
492
 
.window-caption {
493
 
    spacing: 25px;
494
 
}
495
 
 
496
 
.workspace-controls {
497
 
    visible-width: 32px; /* Amount visible before hovering */
 
658
    spacing: 24px;
 
659
}
 
660
 
 
661
.overview-controls {
 
662
    padding-bottom: 32px;
498
663
}
499
664
 
500
665
.workspace-thumbnails-background {
502
667
    border-right: 0px;
503
668
    border-radius: 9px 0px 0px 9px;
504
669
    background-color: rgba(0, 0, 0, 0.5);
505
 
    padding: 8px;
 
670
    padding: 11px 7px 11px 11px;
506
671
}
507
672
 
508
673
.workspace-thumbnails-background:rtl {
509
674
    border-right: 1px;
510
675
    border-left: 0px;
511
676
    border-radius: 0px 9px 9px 0px;
 
677
    padding: 11px 11px 11px 7px;
512
678
}
513
679
 
514
680
.workspace-thumbnails {
515
 
    spacing: 7px;
 
681
    spacing: 11px;
 
682
    visible-width: 32px; /* Amount visible before hovering */
516
683
}
517
684
 
518
685
.workspace-thumbnail-indicator {
519
 
    outline: 2px solid white;
520
 
    border: 1px solid #888;
 
686
    border: 4px solid rgba(255,255,255,0.7);
 
687
    border-radius: 4px;
 
688
    padding: 1px;
521
689
}
522
690
 
523
691
.window-caption {
 
692
    spacing: 25px;
524
693
    background: rgba(0,0,0,0.5);
525
694
    border-radius: 8px;
526
695
    padding: 4px 12px;
527
696
    -shell-caption-spacing: 12px;
 
697
    border: 2px solid rgba(0, 0, 0, 0);
 
698
}
 
699
 
 
700
.window-caption:hover {
 
701
    border: 2px solid rgba(255, 255, 255, 0);
 
702
}
 
703
 
 
704
.window-close, .notification-close {
 
705
    background-image: url("close-window.svg");
 
706
    background-size: 32px;
 
707
    height: 32px;
 
708
    width: 32px;
528
709
}
529
710
 
530
711
.window-close {
531
 
    background-image: url("close-window.svg");
532
 
    background-size: 34px;
533
 
    height: 34px;
534
 
    width: 34px;
535
 
    -shell-close-overlap: 20px;
 
712
    -shell-close-overlap: 16px;
 
713
}
 
714
 
 
715
.window-clone-border {
 
716
    border: 4px solid rgba(255, 255, 255, 0.5);
 
717
    border-radius: 4px;
 
718
}
 
719
 
 
720
.notification-close {
 
721
    /* we start out in the top right of the
 
722
     * notification, inset.
 
723
     *
 
724
     * center is 32px/2 = 16px
 
725
     *
 
726
     * adjust left 2px
 
727
     * adjust down 8px */
 
728
 
 
729
    -shell-close-overlap-x: 14px;
 
730
    -shell-close-overlap-y: -12px;
 
731
}
 
732
 
 
733
.notification-close:rtl {
 
734
    /* as above, but starting out in the top left of the
 
735
     * notification. */
 
736
 
 
737
    -shell-close-overlap-x: -14px;
536
738
}
537
739
 
538
740
.window-close:rtl {
539
741
    -st-background-image-shadow: 2px 2px 6px rgba(0,0,0,0.5);
540
742
}
541
743
 
 
744
.window-picker {
 
745
    -horizontal-spacing: 32px;
 
746
    -vertical-spacing: 32px;
 
747
    padding-left: 32px;
 
748
    padding-right: 32px;
 
749
    padding-bottom: 48px;
 
750
}
 
751
 
 
752
.window-picker.external-monitor {
 
753
    padding: 32px;
 
754
}
 
755
 
 
756
.messages-indicator {
 
757
    color: #999999;
 
758
    height: 32px;
 
759
}
 
760
 
 
761
.messages-indicator-contents {
 
762
    spacing: 12px;
 
763
    padding-bottom: 12px;
 
764
}
 
765
 
 
766
.messages-indicator-contents:hover {
 
767
    color: white;
 
768
    text-shadow: black 0px 2px 2px;
 
769
}
 
770
 
 
771
.messages-indicator-highlight {
 
772
    background-gradient-start: transparent;
 
773
    background-gradient-end: #999999;
 
774
    background-gradient-direction: vertical;
 
775
 
 
776
    height: 6px;
 
777
}
 
778
 
542
779
/* Dash */
543
780
 
544
781
#dash {
557
794
    border-radius: 9px 0px 0px 9px;
558
795
}
559
796
 
560
 
#dash:empty {
561
 
    height: 100px;
562
 
    width: 60px;
563
 
}
564
 
 
565
797
.placeholder {
566
798
    background-image: url("dash-placeholder.svg");
567
799
    background-size: contain;
568
800
    height: 24px;
569
801
}
570
802
 
571
 
#viewSelector {
572
 
    spacing: 1em;
573
 
}
574
 
 
575
 
#viewSelectorTabBar {
576
 
    padding: 1em;
 
803
.empty-dash-drop-target {
 
804
    width: 24px;
 
805
    height: 24px;
577
806
}
578
807
 
579
808
/* Search Box */
580
809
 
581
 
#searchArea {
582
 
    padding: 0px 24px;
583
 
}
584
 
 
585
810
#searchEntry {
586
 
    padding: 4px 12px;
587
 
    border-radius: 17px;
588
 
    font-size: 12pt;
589
 
    color: rgb(128, 128, 128);
590
 
    border: 2px solid rgba(245,245,245,0.2);
591
 
    background-gradient-start: rgba(5,5,6,0.1);
592
 
    background-gradient-end: rgba(254,254,254,0.1);
593
 
    background-gradient-direction: vertical;
594
 
    selected-color: black;
595
 
    caret-color: rgb(128, 128, 128);
596
 
    caret-size: 1px;
597
 
    width: 250px;
598
 
    transition-duration: 300;
599
 
    box-shadow: inset 0px 2px 4px rgba(0,0,0,0.6);
600
 
}
601
 
 
602
 
#searchEntry:focus,
603
 
#searchEntry:hover {
604
 
    border: 2px solid rgb(136,138,133);
605
 
    background-gradient-start: rgb(200,200,200);
606
 
    background-gradient-end: white;
607
 
    background-gradient-direction: vertical;
608
 
}
609
 
 
610
 
#searchEntry:hover {
611
 
    transition-duration: 300;
612
 
}
613
 
 
614
 
#searchEntry:focus {
615
 
    color: rgb(64, 64, 64);
616
 
    font-weight: bold;
617
 
    transition-duration: 0;
 
811
    width: 320px;
618
812
}
619
813
 
620
814
.search-entry-icon {
621
815
    icon-size: 1em;
 
816
    color: #c0c0c0;
 
817
}
 
818
 
 
819
#searchEntry:hover .search-entry-icon,
 
820
#searchEntry:focus .search-entry-icon {
622
821
    color: #8d8f8a;
623
822
}
624
823
 
625
 
/* View Tabs */
626
 
 
627
 
.view-tab-title {
628
 
    color: #888a85;
629
 
    font-size: 12pt;
630
 
    font-weight: bold;
631
 
    padding: 0px 0.75em;
632
 
    height: 1.5em;
633
 
}
634
 
 
635
 
.view-tab-title:hover {
636
 
    color: #bbb;
637
 
}
638
 
 
639
 
.view-tab-title:selected {
640
 
    color: #000000;
641
 
    background-color: #c2c7cd;
642
 
    border-radius: 0.25em;
643
 
}
644
 
 
645
824
/* Search Results */
646
825
 
647
826
#searchResults {
648
 
    padding: 20px 10px 10px 10px;
 
827
    padding: 20px 10px 0px 10px;
649
828
    spacing: 18px;
650
829
}
651
830
 
 
831
#searchResultsBin {
 
832
    max-width: 1000px;
 
833
}
 
834
 
652
835
#searchResultsContent {
 
836
    padding-left: 20px;
653
837
    padding-right: 20px;
654
 
    spacing: 36px;
655
 
}
656
 
 
657
 
#searchResultsContent:rtl {
658
 
    padding-right: 0px;
659
 
    padding-left: 20px;
660
 
}
661
 
 
662
 
.search-statustext,
663
 
.search-section-header {
664
 
    padding: 4px 12px;
665
 
    spacing: 4px;
666
 
    color: #6f6f6f;
667
 
    font-size: .8em;
668
 
}
669
 
 
670
 
.search-section-results {
671
 
    padding: 6px;
672
 
}
673
 
 
674
 
.search-section-list-results {
675
 
    spacing: 4px;
676
 
}
677
 
 
678
 
.results-container {
679
 
    spacing: 4px;
680
 
}
681
 
 
682
 
.search-providers-box {
683
 
    spacing: 12px;
684
 
}
685
 
 
686
 
/* Text labels are an odd number of pixels tall. The uneven top and bottom
687
 
 * padding compensates for this and ensures that the label is vertically
688
 
 * centered */
689
 
.dash-search-button {
690
 
    border-radius: 16px;
691
 
    padding-top: 4px;
692
 
    padding-bottom: 5px;
693
 
    width: 300px;
 
838
    spacing: 16px;
 
839
}
 
840
 
 
841
.search-section {
 
842
    /* This should be equal to #searchResultsContent spacing */
 
843
    spacing: 16px;
 
844
}
 
845
 
 
846
.search-section-separator {
 
847
    -gradient-height: 1px;
 
848
    -gradient-start: rgba(255,255,255,0);
 
849
    -gradient-end: rgba(255,255,255,0.5);
 
850
    -margin-horizontal: 1.5em;
 
851
    height: 1px;
 
852
}
 
853
 
 
854
.search-section-content {
 
855
    /* This is the space between the provider icon and the results container */
 
856
    spacing: 32px;
 
857
}
 
858
 
 
859
.search-statustext {
 
860
    color: #efefef;
 
861
    font-size: 2em;
694
862
    font-weight: bold;
695
863
}
696
864
 
697
 
.dash-search-button:focus,
698
 
.dash-search-button:selected {
699
 
    padding-top: 3px;
700
 
    padding-bottom: 4px;
701
 
    width: 298px;
 
865
.list-search-results {
 
866
    spacing: 3px;
702
867
}
703
868
 
704
869
.dash-label {
709
874
    -x-offset: 8px;
710
875
}
711
876
 
712
 
/* Application Launchers and Grid */
 
877
/* Application Launchers, Grid and List results */
713
878
 
714
879
.icon-grid {
715
880
    spacing: 36px;
721
886
    icon-size: 96px;
722
887
}
723
888
 
724
 
.all-app {
725
 
    padding: 16px 25px 16px 16px;
 
889
.app-display {
 
890
    padding: 8px;
726
891
    spacing: 20px;
727
892
}
728
893
 
729
 
.all-app:rtl {
730
 
    padding-right: 16px;
731
 
    padding-left: 25px;
732
 
}
733
 
 
734
 
.app-filter {
735
 
    font-weight: bold;
736
 
    height: 2.85em;
737
 
    color: #aaa;
738
 
    width: 200px;
739
 
}
740
 
 
741
 
.app-filter:hover {
742
 
    color: #eee;
743
 
}
744
 
 
745
 
.app-filter:selected {
746
 
    color: #ffffff;
747
 
    background-image: url("filter-selected-ltr.svg");
748
 
    background-position: 190px 10px;
749
 
}
750
 
 
751
 
.app-filter:selected:rtl {
752
 
    background-image: url("filter-selected-rtl.svg");
753
 
    background-position: 10px 10px;
754
 
}
755
 
 
756
 
.app-filter:focus {
757
 
    outline: 1px solid #aaa;
758
 
}
759
 
 
760
 
.dash-item-container > .app-well-app {
 
894
.app-view-controls {
 
895
    padding-bottom: 32px;
 
896
}
 
897
 
 
898
.app-view-control {
 
899
    padding: 4px 32px;
 
900
}
 
901
 
 
902
.search-display > StBoxLayout,
 
903
.all-apps > StBoxLayout,
 
904
.frequent-apps > StBoxLayout {
 
905
    /* horizontal padding to make sure scrollbars or dash don't overlap content */
 
906
    padding: 0px 88px;
 
907
}
 
908
 
 
909
.app-folder-icon {
 
910
    padding: 5px;
 
911
}
 
912
 
 
913
.dash-item-container > StButton {
761
914
    padding: 4px 8px;
762
915
}
763
916
 
764
 
.remove-favorite-icon {
765
 
    color: #a0a0a0;
 
917
.list-search-result-content {
 
918
    spacing: 12px;
 
919
    padding: 12px;
766
920
}
767
921
 
768
 
.remove-favorite-icon:hover {
 
922
.list-search-result-title {
 
923
    font-weight: bold;
 
924
    font-size: 14pt;
769
925
    color: white;
770
 
    icon-shadow: black 0px 2px 2px;
 
926
}
 
927
 
 
928
.list-search-result-description {
 
929
    color: #eeeeec;
 
930
}
 
931
 
 
932
.search-provider-icon-more {
 
933
    width: 16px;
 
934
    height: 16px;
 
935
    background-image: url("more-results.svg");
771
936
}
772
937
 
773
938
.app-well-app > .overview-icon,
774
 
.remove-favorite > .overview-icon,
775
 
.search-result-content > .overview-icon {
 
939
.show-apps > .overview-icon,
 
940
.search-provider-icon,
 
941
.list-search-result,
 
942
.grid-search-result .overview-icon {
776
943
    border-radius: 4px;
777
944
    padding: 3px;
778
945
    border: 1px rgba(0,0,0,0);
779
 
    transition-duration: 100;
 
946
    transition-duration: 100ms;
780
947
    text-align: center;
781
948
}
782
949
 
 
950
.app-folder-popup {
 
951
    -arrow-border-radius: 8px;
 
952
    -arrow-background-color: black;
 
953
    -arrow-base: 24px;
 
954
    -arrow-rise: 11px;
 
955
}
 
956
 
 
957
.app-folder-popup-bin {
 
958
    padding: 15px;
 
959
}
 
960
 
783
961
.app-well-app.running > .overview-icon {
784
962
    text-shadow: black 0px 2px 2px;
785
963
    background-image: url("running-indicator.svg");
786
964
    background-size: contain;
787
965
}
788
966
 
 
967
.app-well-app.app-folder > .overview-icon {
 
968
    background-color: rgba(0,0,0,0.5);
 
969
}
 
970
 
789
971
.app-well-app:hover > .overview-icon,
790
 
.remove-favorite:hover > .overview-icon,
791
 
.search-result-content:hover > .overview-icon {
 
972
.show-apps:hover > .overview-icon,
 
973
.search-provider-icon:hover,
 
974
.list-search-result:hover,
 
975
.grid-search-result:hover .overview-icon {
792
976
    background-color: rgba(255,255,255,0.1);
793
977
    text-shadow: black 0px 2px 2px;
794
 
    transition-duration: 100;
795
 
}
796
 
 
797
 
/* Contacts */
798
 
 
799
 
.contact-grid {
800
 
    spacing: 36px;
801
 
    -shell-grid-horizontal-item-size: 272px; /* 2 * -shell-grid-horizontal-item-size + spacing */
802
 
    -shell-grid-vertical-item-size: 118px;
803
 
}
804
 
 
805
 
.contact {
806
 
    width: 272px; /* Same width as two normal results + spacing */
807
 
    height: 118px; /* Aspect ratio = 1.75. Normal US business card ratio */
808
 
    border-radius: 4px;
809
 
    padding: 3px;
810
 
    border: 1px rgba(0,0,0,0);
811
 
    transition-duration: 100;
812
 
}
813
 
 
814
 
.contact-content {
815
 
    border-radius: 7px;
816
 
    padding: 8px;
817
 
    width: 232px;
818
 
    height: 84px;
819
 
    background-color: rgba(0.0, 0.0, 0.0, 0.5);
820
 
    color: white;
821
 
}
822
 
 
823
 
.contact-icon {
824
 
    border-radius: 4px;
825
 
}
826
 
 
827
 
.contact-details {
828
 
    padding: 0px 6px 22px 10px;
829
 
}
830
 
 
831
 
.contact-details-alias {
832
 
    font-size: 18px;
833
 
    padding-bottom: 8px;
834
 
}
835
 
 
836
 
.contact-details-status-icon {
837
 
    padding-right: 4px;
838
 
}
839
 
 
840
 
.contact:hover {
841
 
    background-color: rgba(255,255,255,0.1);
842
 
    transition-duration: 100;
843
 
}
844
 
 
845
 
.contact:focus,
 
978
    transition-duration: 100ms;
 
979
    color:white;
 
980
}
 
981
 
 
982
.app-display .app-well-app > .overview-icon {
 
983
    border-radius: 10px;
 
984
}
 
985
 
 
986
.list-search-result:hover .list-search-result-description {
 
987
    text-shadow: rgba(0,0,0,0.8) 0px 1px 2px;
 
988
}
 
989
 
 
990
.show-apps {
 
991
    padding: 4px 0;
 
992
}
 
993
 
 
994
.show-apps-icon {
 
995
    color: #a0a0a0;
 
996
}
 
997
 
 
998
.show-apps:hover .show-apps-icon {
 
999
    color: white;
 
1000
}
 
1001
 
 
1002
.app-well-app:checked > .overview-icon,
 
1003
.app-well-app:active > .overview-icon,
 
1004
.show-apps:checked > .overview-icon,
 
1005
.show-apps:active > .overview-icon {
 
1006
    background-gradient-start: rgba(255, 255, 255, .05);
 
1007
    background-gradient-end: rgba(255, 255, 255, .15);
 
1008
    background-gradient-direction: vertical;
 
1009
    border-radius: 4px;
 
1010
    box-shadow: inset 0px 1px 2px 0px rgba(0, 0, 0, 1);
 
1011
    transition-duration: 100ms;
 
1012
}
 
1013
 
 
1014
.show-apps:checked .show-apps-icon,
 
1015
.show-apps:focus .show-apps-icon {
 
1016
    color: white;
 
1017
    transition-duration: 100ms;
 
1018
}
 
1019
 
846
1020
.app-well-app:focus > .overview-icon,
847
 
.search-result-content:focus > .overview-icon,
848
 
.contact:selected,
 
1021
.grid-search-result:focus .overview-icon,
 
1022
.show-apps:focus > .overview-icon,
 
1023
.search-provider-icon:focus,
 
1024
.list-search-result:focus,
849
1025
.app-well-app:selected > .overview-icon,
850
 
.search-result-content:selected > .overview-icon {
 
1026
.grid-search-result:selected .overview-icon,
 
1027
.search-provider-icon:selected,
 
1028
.list-search-result:selected {
851
1029
    background-color: rgba(255,255,255,0.33);
852
1030
}
853
1031
 
854
1032
/* LookingGlass */
855
1033
 
856
 
#LookingGlassDialog
857
 
{
 
1034
#LookingGlassDialog {
858
1035
    background-color: rgba(0,0,0,0.80);
859
1036
    spacing: 4px;
860
1037
    padding: 4px;
862
1039
    border-radius: 4px;
863
1040
}
864
1041
 
865
 
#LookingGlassDialog > #Toolbar
866
 
{
 
1042
#LookingGlassDialog > #Toolbar {
867
1043
    border: 1px solid grey;
868
1044
    border-radius: 4px;
869
1045
}
877
1053
    -minimum-hpadding: 6px;
878
1054
    font-weight: bold;
879
1055
    color: #ccc;
880
 
    transition-duration: 100;
 
1056
    transition-duration: 100ms;
881
1057
    padding-left: .3em;
882
1058
    padding-right: .3em;
883
1059
}
899
1075
    padding-bottom: 8px;
900
1076
}
901
1077
 
902
 
.lg-dialog StEntry
903
 
{
 
1078
.lg-dialog StEntry {
904
1079
    selection-background-color: #bbbbbb;
905
1080
    selected-color: #333333;
906
1081
}
907
1082
 
908
 
.lg-completions-text
909
 
{
 
1083
.lg-completions-text {
910
1084
    font-size: .9em;
911
1085
    font-style: italic;
912
1086
}
913
1087
 
914
 
.lg-obj-inspector-title
915
 
{
 
1088
.lg-obj-inspector-title {
916
1089
    spacing: 4px;
917
1090
}
918
1091
 
919
 
.lg-obj-inspector-button
920
 
{
 
1092
.lg-obj-inspector-button {
921
1093
    border: 1px solid gray;
922
1094
    padding: 4px;
923
1095
    border-radius: 4px;
924
1096
}
925
1097
 
926
 
.lg-obj-inspector-button:hover
927
 
{
 
1098
.lg-obj-inspector-button:hover {
928
1099
    border: 1px solid #ffffff;
929
1100
}
930
1101
 
931
 
.lg-dialog .shell-link
932
 
{
 
1102
.lg-dialog .shell-link {
933
1103
    color: #999999;
934
1104
}
935
1105
 
936
 
.lg-dialog .shell-link:hover
937
 
{
 
1106
.lg-dialog .shell-link:hover {
938
1107
    color: #dddddd;
939
1108
}
940
1109
 
941
 
#LookingGlassDialog StBoxLayout#EvalBox
942
 
{
 
1110
#LookingGlassDialog StBoxLayout#EvalBox {
943
1111
    padding: 4px;
944
1112
    spacing: 4px;
945
1113
}
946
1114
 
947
 
#LookingGlassDialog StBoxLayout#ResultsArea
948
 
{
 
1115
#LookingGlassDialog StBoxLayout#ResultsArea {
949
1116
    spacing: 4px;
950
1117
}
951
1118
 
983
1150
 
984
1151
#calendarEventsArea {
985
1152
    /* this is the width of the second column of the popup */
986
 
    min-width: 400px;
 
1153
    min-width: 320px;
987
1154
}
988
1155
 
989
1156
.calendar-vertical-separator {
992
1159
    width: 0.3em;
993
1160
}
994
1161
 
995
 
#calendarPopup {
996
 
    border-radius: 5px;
997
 
    background: rgba(0,0,0,0.9);
998
 
    border: 1px solid rgba(128,128,128,0.45);
999
 
    color: white;
1000
 
}
1001
 
 
1002
1162
#calendarPopup .calendar {
1003
1163
    padding: 10px;
1004
1164
}
1005
1165
 
1006
1166
.calendar {
1007
 
    padding: .4em 1.75em;
 
1167
    padding: .4em 1.75em .8em 1.75em;
1008
1168
    spacing-rows: 0px;
1009
1169
    spacing-columns: 0px;
1010
1170
}
1011
1171
 
1012
1172
.calendar-month-label {
1013
 
    color: #666666;
1014
 
    font-size: 7.5pt;
 
1173
    color: #888a85;
 
1174
    font-size: 9.5pt;
 
1175
    font-weight: bold;
1015
1176
    padding-bottom: 8px;
1016
1177
    padding-top: 8px;
1017
 
    font-weight: bold;
1018
1178
}
1019
1179
 
1020
1180
.calendar-change-month-back {
1054
1214
}
1055
1215
 
1056
1216
.datemenu-date-label {
1057
 
    padding: .4em 1.75em;
1058
 
    color: #cccccc;
 
1217
    padding: .4em 1.7em;
1059
1218
    font-weight: bold;
 
1219
    text-align: center;
 
1220
    color: #eeeeec;
1060
1221
}
1061
1222
 
1062
1223
.calendar-day-base {
1063
 
    font-size: 7.5pt;
 
1224
    font-size: 9pt;
1064
1225
    text-align: center;
1065
1226
    width: 2.4em;
1066
1227
    height: 2.4em;
1068
1229
 
1069
1230
.calendar-day-base:hover {
1070
1231
    background-color: #777777;
1071
 
    color: #fff;
1072
1232
}
1073
1233
 
1074
1234
.calendar-day-base:active {
 
1235
    font-size: 9pt;
1075
1236
    background-color: #555555;
 
1237
    color: white;
1076
1238
}
1077
1239
 
1078
1240
.calendar-day-heading {
1079
 
    color: #666666;
1080
 
    padding-top: 1em;
 
1241
    color: #888a85;
 
1242
    padding-top: .2em;
 
1243
    height: 1.7em;
1081
1244
}
1082
1245
 
1083
1246
.calendar-week-number {
1084
 
    color: #666666;
 
1247
    color: #babdb6;
1085
1248
    font-weight: bold;
1086
1249
}
1087
1250
 
1088
1251
/* Hack used in lieu of border-collapse - see calendar.js */
1089
1252
.calendar-day {
1090
 
    border: 1px solid #333333;
1091
 
    color: #888888;
 
1253
    border: 1px solid #505050;
 
1254
    color: #babdb6;
1092
1255
    border-top-width: 0;
1093
1256
    border-left-width: 0;
1094
1257
}
 
1258
 
1095
1259
.calendar-day-top {
1096
1260
    border-top-width: 1px;
1097
1261
}
 
1262
 
1098
1263
.calendar-day-left {
1099
1264
    border-left-width: 1px;
1100
1265
}
1109
1274
.calendar-today {
1110
1275
    background-image: url("calendar-today.svg");
1111
1276
    text-shadow: black 0px 2px 2px;
1112
 
    color: #ffffff;
1113
 
    font-weight: bold;
 
1277
    font-weight: bold;
 
1278
}
 
1279
 
 
1280
.calendar-day-with-events {
 
1281
    font-weight: bold;
 
1282
    color: white;
1114
1283
}
1115
1284
 
1116
1285
.calendar-other-month-day {
1117
1286
    color: #333333;
1118
1287
}
1119
1288
 
1120
 
.calendar-day-with-events {
1121
 
    font-weight: bold;
1122
 
    color: #cccccc;
1123
 
}
1124
 
 
1125
1289
.events-header-vbox {
1126
1290
    spacing: 6pt;
1127
 
    padding-right: 1.75em;
 
1291
    padding-right: .5em;
1128
1292
}
1129
1293
 
1130
1294
.events-header-vbox:rtl {
1131
 
    padding-right: 0em;
1132
 
    padding-left: 1.75em;
 
1295
    padding-left: .5em;
1133
1296
}
1134
1297
 
1135
1298
.events-header-hbox {
1136
 
    padding: 0.3em;
 
1299
    padding: 0.3em 1.4em;
1137
1300
}
1138
1301
 
1139
1302
.events-day-header {
1140
 
    font-size: 9pt;
1141
1303
    font-weight: bold;
1142
 
    color: rgba(153, 153, 153, 1.0);
1143
 
    padding-left: 1.8em;
1144
 
    padding-top: 0.8em;
 
1304
    color: #999999;
 
1305
    padding: 0.4em 1.4em 0em 1.4em;
1145
1306
}
1146
1307
 
1147
1308
.events-day-header:rtl {
1148
 
    padding-left: 0em;
1149
 
    padding-right: 0.3em;
 
1309
    padding: 0em 1.4em 0.4em 1.4em;
1150
1310
}
1151
1311
 
1152
1312
.events-day-dayname {
1153
 
    font-size: 9pt;
1154
1313
    color: rgba(153, 153, 153, 1.0);
1155
1314
    text-align: left;
1156
1315
}
1160
1319
}
1161
1320
 
1162
1321
.events-day-time {
1163
 
    font-size: 9pt;
1164
1322
    color: #fff;
1165
1323
    text-align: right;
1166
1324
}
1170
1328
}
1171
1329
 
1172
1330
.events-day-task {
1173
 
    font-size: 9pt;
1174
1331
    color: rgba(153, 153, 153, 1.0);
1175
1332
}
1176
1333
 
1179
1336
}
1180
1337
 
1181
1338
.events-time-box {
1182
 
    min-width: 53pt;
1183
 
    padding-right: 6pt;
 
1339
    min-width: 48pt;
 
1340
    padding-right: 12pt;
1184
1341
}
1185
1342
 
1186
1343
.events-time-box:rtl {
1187
1344
    padding-right: 0px;
1188
 
    padding-left: 6pt;
 
1345
    padding-left: 12pt;
1189
1346
}
1190
1347
 
1191
1348
.events-event-box {
1197
1354
 
1198
1355
/* Message Tray */
1199
1356
#message-tray {
1200
 
    background-gradient-direction: vertical;
1201
 
    background-gradient-start: rgba(0,0,0,0.01);
1202
 
    background-gradient-end: rgba(0,0,0,0.82);
1203
 
    height: 36px;
1204
 
}
1205
 
 
1206
 
#notification {
 
1357
    background: #2e3436 url(message-tray-background.png);
 
1358
    background-repeat: repeat;
 
1359
    height: 72px;
 
1360
}
 
1361
 
 
1362
.message-tray-summary {
 
1363
    height: 72px;
 
1364
}
 
1365
 
 
1366
.no-messages-label {
 
1367
    font-family: cantarell, sans-serif;
 
1368
    font-size: 11pt;
 
1369
    color: #999999;
 
1370
}
 
1371
 
 
1372
.notification {
1207
1373
    border-radius: 10px 10px 0px 0px;
1208
 
    background: rgba(0,0,0,0.8);
 
1374
    background: rgba(0,0,0,0.9);
1209
1375
    padding: 8px 8px 4px 8px;
1210
 
    spacing-rows: 10px;
 
1376
    spacing-rows: 4px;
1211
1377
    spacing-columns: 10px;
 
1378
}
 
1379
 
 
1380
.notification, #notification-container {
 
1381
    font-size: 11pt;
1212
1382
    width: 34em;
1213
1383
}
1214
1384
 
1215
 
#notification.multi-line-notification {
 
1385
.notification.multi-line-notification {
1216
1386
    padding-bottom: 8px;
1217
1387
}
1218
1388
 
 
1389
.notification-unexpanded {
 
1390
    /* We want to force the actor at a specific size, irrespective
 
1391
       of its minimum and preferred size, so we override both */
 
1392
    min-height: 36px;
 
1393
    height: 36px;
 
1394
}
 
1395
 
1219
1396
/* We use row-span = 2 for the image cell, which prevents its height preferences to be
1220
1397
   taken into account during allocation, so its height ends up being limited by the height
1221
1398
   of the content in the other rows. To avoid showing a stretched image, we set the minimum
1225
1402
}
1226
1403
 
1227
1404
.summary-boxpointer {
1228
 
    -arrow-border-radius: 8px;
 
1405
    -arrow-border-radius: 15px;
1229
1406
    -arrow-background-color: rgba(0,0,0,0.9);
1230
 
    -arrow-border-width: 2px;
1231
 
    -arrow-border-color: #a5a5a5;
1232
 
    -arrow-base: 24px;
1233
 
    -arrow-rise: 11px;
 
1407
    -arrow-base: 36px;
 
1408
    -arrow-rise: 18px;
1234
1409
    color: white;
 
1410
    -boxpointer-gap: 4px;
1235
1411
}
1236
1412
 
1237
 
.summary-boxpointer #notification {
 
1413
.summary-boxpointer .notification {
1238
1414
    border-radius: 9px;
1239
1415
    background: rgba(0,0,0,0) !important;
1240
1416
    padding-bottom: 12px;
1245
1421
    padding-bottom: 12px;
1246
1422
}
1247
1423
 
1248
 
#summary-notification-stack-scrollview {
 
1424
.summary-notification-stack-scrollview {
1249
1425
    max-height: 18em;
1250
 
    padding-top: 6px;
1251
 
    padding-bottom: 6px;
1252
 
}
1253
 
 
1254
 
#summary-notification-stack-scrollview > .top-shadow, #summary-notification-stack-scrollview > .bottom-shadow {
1255
 
    height: 1em;
1256
 
}
1257
 
 
1258
 
#summary-notification-stack-scrollview:ltr {
 
1426
    padding-top: 8px;
 
1427
    padding-bottom: 8px;
 
1428
}
 
1429
 
 
1430
.summary-notification-stack-scrollview:ltr {
1259
1431
    padding-right: 8px;
1260
1432
}
1261
1433
 
1262
 
#summary-notification-stack-scrollview:rtl {
 
1434
.summary-notification-stack-scrollview:rtl {
1263
1435
    padding-left: 8px;
1264
1436
}
1265
1437
 
1266
 
#notification-scrollview {
 
1438
.notification-scrollview {
1267
1439
    max-height: 10em;
1268
1440
    -st-vfade-offset: 24px;
1269
1441
}
1270
1442
 
1271
 
#notification-scrollview > .top-shadow, #notification-scrollview > .bottom-shadow {
1272
 
    height: 1em;
1273
 
}
1274
 
 
1275
 
#notification-scrollview:ltr > StScrollBar {
 
1443
.notification-scrollview:ltr > StScrollBar {
1276
1444
    padding-left: 6px;
1277
1445
}
1278
1446
 
1279
 
#notification-scrollview:rtl > StScrollBar {
 
1447
.notification-scrollview:rtl > StScrollBar {
1280
1448
    padding-right: 6px;
1281
1449
}
1282
1450
 
1283
 
#notification-body {
 
1451
.notification-body {
1284
1452
    spacing: 5px;
1285
1453
}
1286
1454
 
1287
 
#notification-actions {
 
1455
.notification-actions {
 
1456
    padding-top: 18px;
1288
1457
    spacing: 10px;
1289
1458
}
1290
1459
 
1291
1460
.notification-button {
1292
 
    border-radius: 18px;
1293
 
    padding: 4px 42px 5px;
 
1461
    -st-natural-width: 140px;
 
1462
    padding: 4px 4px 5px;
1294
1463
}
1295
1464
 
1296
1465
.notification-button:focus {
1297
 
    padding: 3px 41px 4px;
 
1466
    -st-natural-width: 138px;
 
1467
    padding: 3px 4px 4px;
1298
1468
}
1299
1469
 
1300
1470
.notification-icon-button {
1311
1481
    padding: 8px;
1312
1482
}
1313
1483
 
 
1484
.secondary-icon {
 
1485
    icon-size: 1.09em;
 
1486
}
 
1487
 
1314
1488
.hotplug-transient-box {
1315
1489
    spacing: 6px;
1316
1490
    padding: 2px 72px 2px 12px;
1318
1492
 
1319
1493
.hotplug-notification-item {
1320
1494
    padding: 2px 10px;
1321
 
    border-radius: 18px;
1322
1495
}
1323
1496
 
1324
1497
.hotplug-notification-item:focus {
1407
1580
    padding-right: 4px;
1408
1581
}
1409
1582
 
 
1583
.chat-notification-scrollview{
 
1584
        max-height: 22em;
 
1585
}
 
1586
 
1410
1587
.subscription-message {
1411
1588
    font-style: italic;
1412
1589
}
1413
1590
 
1414
 
#notification StEntry {
1415
 
    padding: 4px;
 
1591
.notification StEntry {
1416
1592
    border-radius: 4px;
1417
 
    color: #a8a8a8;
1418
 
    selected-color: black;
1419
 
    border: 1px solid rgba(245,245,245,0.2);
1420
 
    background-gradient-direction: vertical;
1421
 
    background-gradient-start: rgb(200,200,200);
1422
 
    background-gradient-end: white;
1423
 
    transition-duration: 300;
1424
 
    box-shadow: inset 0px 2px 4px rgba(0,0,0,0.6);
1425
 
 
1426
 
    caret-color: #a8a8a8;
1427
 
    caret-size: 1px;
1428
 
}
1429
 
 
1430
 
#notification StEntry:focus {
1431
 
    border: 1px solid #8b8b8b;
1432
 
    color: #333333;
1433
 
    background-gradient-direction: vertical;
1434
 
    background-gradient-start: rgb(200,200,200);
1435
 
    background-gradient-end: white;
1436
 
 
1437
 
    caret-color: #545454;
1438
 
    selection-background-color: #808080;
1439
 
}
1440
 
 
1441
 
/* The spacing and padding on the summary is tricky; we want to keep
1442
 
 * the icons from touching each other or the edges of the screen, but
1443
 
 * we also want them to be "Fitts"-y with respect to the edges, so the
1444
 
 * summary area's bottom and right padding must actually be part of
1445
 
 * the icons. However, we can't put *all* of the padding into the
1446
 
 * icons, because then the summary would be 0x0 when there were no
1447
 
 * icons in it, and so you wouldn't be able to hover over it to
1448
 
 * activate it.
1449
 
 *
1450
 
 * Also, the spacing between a summary-source's icon and title is
1451
 
 * actually specified as padding-left in source-title, because we
1452
 
 * want the spacing to collapse along with the title.
1453
 
 */
1454
 
#summary-mode {
1455
 
    padding: 2px 0px 0px 4px;
1456
 
    height: 36px;
1457
 
}
1458
 
 
1459
 
#summary-mode:rtl {
1460
 
    padding: 2px 4px 0px 0px;
1461
1593
}
1462
1594
 
1463
1595
.summary-source-button {
1464
 
    text-shadow: black 0px 2px 2px;
1465
 
}
1466
 
 
1467
 
.summary-source-button:ltr {
1468
 
    padding-right: 12px;
1469
 
}
1470
 
 
1471
 
.summary-source-button:selected .summary-source {
1472
 
    background-image: url("panel-button-highlight-narrow.svg");
1473
 
    background-size: contain;
1474
 
    border-image: url("source-button-border.svg") 10 10 0 1;
1475
 
}
1476
 
 
1477
 
.summary-source-button:expanded:selected .summary-source {
1478
 
    background-image: none;
1479
 
    border-image: none;
1480
 
}
1481
 
 
1482
 
.summary-source-button:expanded:selected {
1483
 
    background-image: url("panel-button-highlight-wide.svg");
1484
 
    background-size: contain;
1485
 
    border-image: url("source-button-border.svg") 10 10 0 1;
1486
 
}
1487
 
 
1488
 
.summary-source-button:rtl {
1489
 
    padding-left: 12px;
 
1596
    padding: 6px 3px 6px 3px;
1490
1597
}
1491
1598
 
1492
1599
.summary-source-button:last-child:ltr {
1493
 
    padding-right: 12px;
 
1600
    padding-right: 6px;
1494
1601
}
1495
1602
 
1496
1603
.summary-source-button:last-child:rtl {
1497
 
    padding-left: 12px;
 
1604
    padding-left: 6px;
 
1605
}
 
1606
 
 
1607
.summary-source-button:hover .summary-source {
 
1608
    background-color: rgba(255,255,255,0.1);
 
1609
}
 
1610
 
 
1611
.summary-source-button:focus .summary-source,
 
1612
.summary-source-button:selected .summary-source {
 
1613
    background-color: rgba(255,255,255,0.33);
1498
1614
}
1499
1615
 
1500
1616
.summary-source {
1501
 
    padding-right: 4px;
1502
 
    padding-left: 4px;
 
1617
    border-radius: 4px;
 
1618
    padding: 0 6px 0 6px;
 
1619
    transition-duration: 100ms;
1503
1620
}
1504
1621
 
1505
1622
.summary-source-counter {
1506
 
    color: white;
1507
 
    background-color: #3465A4;
1508
 
    text-shadow: black 1px 1px 0;
1509
 
    font-size: 9pt;
1510
 
    border-radius: 1em;
1511
 
    min-height: 1em;
1512
 
    min-width: 1em;
1513
 
}
1514
 
 
1515
 
.source-title {
1516
 
    padding-left: 4px;
1517
 
}
1518
 
 
1519
 
.source-title:rtl {
1520
 
    padding-left: 0px;
1521
 
    padding-right: 4px;
 
1623
    background-image: url("summary-counter.svg");
 
1624
    background-size: 2.4em;
 
1625
    font-size: 10pt;
 
1626
    font-weight: bold;
 
1627
    height: 2.4em;
 
1628
    width: 2.4em;
 
1629
    -shell-counter-overlap-x: 13px;
 
1630
    -shell-counter-overlap-y: 13px;
 
1631
}
 
1632
 
 
1633
/* OSD */
 
1634
.osd-window {
 
1635
    text-align: center;
 
1636
    font-weight: bold;
 
1637
    spacing: 1em;
 
1638
}
 
1639
 
 
1640
.osd-window .level {
 
1641
    height: 0.6em;
 
1642
    border-radius: 0.3em;
 
1643
    background-color: rgba(190,190,190,0.2);
1522
1644
}
1523
1645
 
1524
1646
/* App Switcher */
1525
 
#altTabPopup {
 
1647
.switcher-popup {
1526
1648
    padding: 8px;
1527
1649
    spacing: 16px;
1528
1650
}
1529
1651
 
 
1652
.osd-window,
1530
1653
.switcher-list {
1531
1654
    background: rgba(0,0,0,0.8);
1532
1655
    border: 1px solid rgba(128,128,128,0.40);
1631
1754
    height: 100px;
1632
1755
    border: 0px;
1633
1756
    background: rgba(255,255,255,0.5);
1634
 
    background-image: url("ws-switch-arrow-up.svg");
 
1757
    background-image: url("ws-switch-arrow-up.png");
1635
1758
    border-radius: 8px;
1636
1759
}
1637
1760
 
1639
1762
    height: 100px;
1640
1763
    border: 0px;
1641
1764
    background: rgba(255,255,255,0.5);
1642
 
    background-image: url("ws-switch-arrow-down.svg");
 
1765
    background-image: url("ws-switch-arrow-down.png");
1643
1766
    border-radius: 8px;
1644
1767
}
1645
1768
 
1678
1801
}
1679
1802
 
1680
1803
.modal-dialog-button {
1681
 
    border-radius: 18px;
1682
 
 
1683
1804
    margin-left: 10px;
1684
1805
    margin-right: 10px;
1685
1806
    padding: 4px 32px 5px;
1686
1807
}
1687
1808
 
1688
 
.modal-dialog-button:disabled {
1689
 
    color: rgb(60, 60, 60);
1690
 
}
1691
 
 
1692
1809
.modal-dialog-button:focus {
1693
1810
    padding: 3px 31px 4px;
1694
1811
}
1695
1812
 
1696
1813
/* Run Dialog */
1697
1814
 
 
1815
.run-dialog-label {
 
1816
    font-size: 12pt;
 
1817
    font-weight: bold;
 
1818
    color: #999999;
 
1819
    padding-bottom: .4em;
 
1820
}
 
1821
 
1698
1822
.run-dialog-error-box {
1699
1823
    padding-top: 15px;
1700
1824
    spacing: 5px;
1701
1825
}
1702
1826
 
1703
 
.run-dialog-entry {
1704
 
    font-weight: bold;
1705
 
    width: 23em;
1706
 
    selection-background-color: white;
1707
 
    selected-color: black;
1708
 
}
1709
 
 
1710
 
.run-dialog {
1711
 
    border-radius: 16px;
1712
 
 
1713
 
    padding-right: 21px;
1714
 
    padding-left: 21px;
1715
 
    padding-bottom: 15px;
1716
 
    padding-top: 15px;
 
1827
.modal-dialog .run-dialog-entry {
 
1828
    width: 20em;
1717
1829
}
1718
1830
 
1719
1831
.lightbox {
1720
 
    background-color: rgba(0, 0, 0, 0.4);
 
1832
    background-color: black;
1721
1833
}
1722
1834
 
1723
1835
.flashspot {
1753
1865
    border-radius: 5px;
1754
1866
    width: 32px;
1755
1867
    height: 32px;
 
1868
    background-size: contain;
1756
1869
}
1757
1870
 
1758
1871
.end-session-dialog-shutdown-icon {
1911
2024
    color: #666666;
1912
2025
}
1913
2026
 
1914
 
.prompt-dialog-password-label:ltr {
1915
 
    padding-right: 0.5em;
1916
 
}
1917
 
 
1918
 
.prompt-dialog-password-label:rtl {
1919
 
    padding-left: 0.5em;
1920
 
}
1921
 
 
1922
 
.prompt-dialog-password-entry {
1923
 
    background-gradient-start: rgb(236,236,236);
1924
 
    background-gradient-end: white;
1925
 
    background-gradient-direction: vertical;
1926
 
    color: black;
1927
 
    selected-color: white;
1928
 
    border-radius: 5px;
1929
 
    border: 2px solid #555753;
1930
 
}
1931
 
 
1932
 
.prompt-dialog-password-entry:focus {
1933
 
    border: 2px solid #3465a4;
1934
 
}
1935
 
 
1936
 
.prompt-dialog-password-entry .capslock-warning {
1937
 
    icon-size: 16px;
1938
 
    warning-color: #999;
1939
 
    padding: 0 4px;
 
2027
.prompt-dialog-password-box {
 
2028
    spacing: 1em;
 
2029
    padding-bottom: 1em;
1940
2030
}
1941
2031
 
1942
2032
.prompt-dialog-error-label {
1950
2040
    padding-bottom: 8px;
1951
2041
}
1952
2042
 
1953
 
/* intentionally left transparent to avoid dialog changing size */
 
2043
.hidden {
 
2044
    color: rgba(0,0,0,0);
 
2045
}
 
2046
 
1954
2047
.prompt-dialog-null-label {
1955
2048
    font-size: 10pt;
1956
 
    color: rgba(0,0,0,0);
1957
2049
    padding-bottom: 8px;
1958
2050
}
1959
2051
 
1973
2065
    color: #ff0000;
1974
2066
}
1975
2067
 
 
2068
.polkit-dialog-user-icon {
 
2069
    border: 2px solid #8b8b8b;
 
2070
    border-radius: 5px;
 
2071
    background-size: contain;
 
2072
    width: 48px;
 
2073
    height: 48px;
 
2074
}
 
2075
 
1976
2076
/* Network Agent Dialog */
1977
2077
 
1978
2078
.network-dialog-secret-table {
1979
2079
    spacing-rows: 15px;
 
2080
    spacing-columns: 1em;
1980
2081
}
1981
2082
 
1982
2083
.keyring-dialog-control-table {
1983
2084
    spacing-rows: 15px;
 
2085
    spacing-columns: 1em;
1984
2086
}
1985
2087
 
1986
2088
/* Magnifier */
2047
2149
    -arrow-rise: 10px;
2048
2150
    -boxpointer-gap: 5px;
2049
2151
}
 
2152
 
 
2153
/* IBus Candidate Popup */
 
2154
 
 
2155
.candidate-popup-content {
 
2156
    padding: 0.5em;
 
2157
    spacing: 0.3em;
 
2158
}
 
2159
 
 
2160
.candidate-index {
 
2161
    padding: 0 0.5em 0 0;
 
2162
    color: #cccccc;
 
2163
}
 
2164
 
 
2165
.candidate-box {
 
2166
    padding: 0.3em 0.5em 0.3em 0.5em;
 
2167
}
 
2168
 
 
2169
.candidate-box:selected {
 
2170
    border-radius: 4px;
 
2171
    background-color: rgba(255,255,255,0.2);
 
2172
}
 
2173
 
 
2174
.candidate-box:hover {
 
2175
    border-radius: 4px;
 
2176
    background-color: rgba(255,255,255,0.1);
 
2177
}
 
2178
.candidate-page-button-box {
 
2179
    height: 2em;
 
2180
    width: 80px;
 
2181
}
 
2182
 
 
2183
.vertical .candidate-page-button-box {
 
2184
    padding-top: 0.5em;
 
2185
}
 
2186
 
 
2187
.horizontal .candidate-page-button-box {
 
2188
    padding-left: 0.5em;
 
2189
}
 
2190
 
 
2191
.candidate-page-button-previous {
 
2192
    border-radius: 4px 0px 0px 4px;
 
2193
}
 
2194
 
 
2195
.candidate-page-button-next {
 
2196
    border-radius: 0px 4px 4px 0px;
 
2197
}
 
2198
 
 
2199
.candidate-page-button-icon {
 
2200
    icon-size: 1em;
 
2201
}
 
2202
 
 
2203
/* Login Dialog */
 
2204
 
 
2205
.login-dialog-banner {
 
2206
    font-size: 10pt;
 
2207
    font-weight: bold;
 
2208
    text-align: center;
 
2209
    color: #666666;
 
2210
    padding-bottom: 1em;
 
2211
}
 
2212
 
 
2213
.login-dialog-title {
 
2214
    font-size: 14pt;
 
2215
    font-weight: bold;
 
2216
    color: #666666;
 
2217
    padding-bottom: 2em;
 
2218
}
 
2219
 
 
2220
.login-dialog {
 
2221
    /* Reset border and background */
 
2222
    border: none;
 
2223
    background-color: transparent;
 
2224
 
 
2225
    padding-bottom: 80px;
 
2226
    padding-top: 80px;
 
2227
 
 
2228
    border-radius: 16px;
 
2229
    min-height: 150px;
 
2230
    max-height: 700px;
 
2231
    min-width: 350px;
 
2232
}
 
2233
 
 
2234
.login-dialog-prompt-login-hint-message {
 
2235
    font-size: 10.5pt;
 
2236
}
 
2237
 
 
2238
.login-dialog-user-list-view {
 
2239
    -st-vfade-offset: 1em;
 
2240
}
 
2241
 
 
2242
.login-dialog-user-list {
 
2243
    spacing: 12px;
 
2244
    padding: .2em;
 
2245
}
 
2246
 
 
2247
.login-dialog-user-list-item {
 
2248
    border-radius: 10px;
 
2249
    padding: .2em;
 
2250
}
 
2251
 
 
2252
.login-dialog-user-list-item:ltr {
 
2253
    padding-right: 1em;
 
2254
}
 
2255
 
 
2256
.login-dialog-user-list-item:rtl {
 
2257
    padding-left: 1em;
 
2258
}
 
2259
 
 
2260
.login-dialog-user-list-item .login-dialog-user-list-item-name {
 
2261
    font-size: 20pt;
 
2262
    padding-left: 1em;
 
2263
}
 
2264
 
 
2265
.login-dialog-user-list:expanded .login-dialog-user-list-item {
 
2266
    color: #666666;
 
2267
}
 
2268
 
 
2269
.login-dialog-user-list-item,
 
2270
.login-dialog-user-list-item:hover .login-dialog-user-list-item-name,
 
2271
.login-dialog-user-list:expanded .login-dialog-user-list-item:focus .login-dialog-user-list-item-name,
 
2272
.login-dialog-user-list:expanded .login-dialog-user-list-item:logged-in {
 
2273
    color: white;
 
2274
    text-shadow: black 0px 2px 2px;
 
2275
}
 
2276
 
 
2277
.login-dialog-user-list-item:hover {
 
2278
    background-color: rgba(255,255,255,0.1);
 
2279
}
 
2280
 
 
2281
.login-dialog-user-list:expanded .login-dialog-user-list-item:focus {
 
2282
    background-color: rgba(255,255,255,0.33);
 
2283
}
 
2284
 
 
2285
.login-dialog-user-list:expanded .login-dialog-user-list-item:logged-in {
 
2286
    background-image: url("logged-in-indicator.svg");
 
2287
    background-size: contain;
 
2288
}
 
2289
 
 
2290
.login-dialog-user-list-item-text-box {
 
2291
    padding: 0 0.5em;
 
2292
}
 
2293
 
 
2294
.login-dialog-user-list-item .login-dialog-timed-login-indicator {
 
2295
    background-color: rgba(0,0,0,0.0);
 
2296
    height: 2px;
 
2297
}
 
2298
 
 
2299
.login-dialog-user-list-item:focus .login-dialog-timed-login-indicator {
 
2300
    background-color: #8b8b8b;
 
2301
}
 
2302
 
 
2303
.login-dialog-user-list-item-icon {
 
2304
    border: 2px solid #8b8b8b;
 
2305
    border-radius: 8px;
 
2306
    width: 64px;
 
2307
    height: 64px;
 
2308
}
 
2309
 
 
2310
.login-dialog-not-listed-label {
 
2311
    font-size: 10.5pt;
 
2312
    font-weight: bold;
 
2313
    color: #666666;
 
2314
    padding-top: 1em;
 
2315
    padding-left: 2px;
 
2316
}
 
2317
 
 
2318
.login-dialog-not-listed-button:focus .login-dialog-not-listed-label,
 
2319
.login-dialog-not-listed-button:hover .login-dialog-not-listed-label {
 
2320
    color: #E8E8E8;
 
2321
}
 
2322
 
 
2323
.login-dialog-username {
 
2324
    font-size: 16pt;
 
2325
    font-weight: bold;
 
2326
    text-align: left;
 
2327
    padding-left: 15px;
 
2328
    text-shadow: black 0px 4px 3px 0px;
 
2329
}
 
2330
 
 
2331
.login-dialog-prompt-layout {
 
2332
    padding-top: 24px;
 
2333
    padding-bottom: 12px;
 
2334
    spacing: 8px;
 
2335
}
 
2336
 
 
2337
.login-dialog-prompt-label {
 
2338
    color: #eeeeee;
 
2339
    font-size: 14px;
 
2340
}
 
2341
 
 
2342
.login-dialog-prompt-entry {
 
2343
    width: 15em;
 
2344
}
 
2345
 
 
2346
.login-dialog-session-list,
 
2347
.login-dialog-session-list-item {
 
2348
    color: #babdb6;
 
2349
}
 
2350
 
 
2351
.login-dialog-session-list-button:focus,
 
2352
.login-dialog-session-list-button:active,
 
2353
.login-dialog-session-list-button:hover,
 
2354
.login-dialog-session-list-item:focus,
 
2355
.login-dialog-session-list-item:hover {
 
2356
    color: white;
 
2357
}
 
2358
 
 
2359
.login-dialog-session-list-button {
 
2360
    padding: 4px;
 
2361
}
 
2362
 
 
2363
.login-dialog-session-list-scroll-view {
 
2364
    padding: 6px;
 
2365
}
 
2366
 
 
2367
.login-dialog-session-list-item {
 
2368
    padding-bottom: 6px;
 
2369
}
 
2370
 
 
2371
.login-dialog-session-list-triangle {
 
2372
    padding-right: 6px;
 
2373
}
 
2374
 
 
2375
.login-dialog-session-list-item-box {
 
2376
    padding-left: 6px;
 
2377
    spacing: 6px;
 
2378
}
 
2379
 
 
2380
.login-dialog-session-list-item-dot {
 
2381
    width: 10px;
 
2382
    height: 10px;
 
2383
}
 
2384
 
 
2385
.login-dialog-logo-bin {
 
2386
    padding: 24px 0px;
 
2387
}
 
2388
 
 
2389
.login-dialog .modal-dialog-button-box {
 
2390
    spacing: 3px;
 
2391
}
 
2392
 
 
2393
.login-dialog .modal-dialog-button {
 
2394
    border-radius: 5px;
 
2395
    padding: 3px 18px;
 
2396
}
 
2397
 
 
2398
.login-dialog .modal-dialog-button:focus {
 
2399
    padding: 2px 17px;
 
2400
}
 
2401
 
 
2402
.login-dialog .modal-dialog-button:default {
 
2403
    background-gradient-start: #6793c4;
 
2404
    background-gradient-end: #335d8f;
 
2405
    background-gradient-direction: vertical;
 
2406
    border-color: #16335d;
 
2407
}
 
2408
 
 
2409
.login-dialog .modal-dialog-button:default:focus {
 
2410
    border: 2px solid #377fe7;
 
2411
}
 
2412
 
 
2413
.login-dialog .modal-dialog-button:default:hover {
 
2414
    background-gradient-start: #74a0d0;
 
2415
    background-gradient-end: #436d9f;
 
2416
}
 
2417
 
 
2418
.login-dialog .modal-dialog-button:default:active,
 
2419
.login-dialog .modal-dialog-button:default:pressed {
 
2420
    background-gradient-start: #436d9f;
 
2421
    background-gradient-end: #74a0d0;
 
2422
}
 
2423
 
 
2424
.login-dialog .modal-dialog-button:default:insensitive {
 
2425
    border-color: #666666;
 
2426
    color: #9f9f9f;
 
2427
    background-gradient-direction: none;
 
2428
    background-color: rgba(102, 102, 102, 0.15);
 
2429
}
 
2430
 
 
2431
.login-dialog-message-warning {
 
2432
    color: orange;
 
2433
}
 
2434
 
 
2435
.user-widget {
 
2436
    spacing: .4em;
 
2437
}
 
2438
 
 
2439
.user-widget-label {
 
2440
    font-size: 16pt;
 
2441
    font-weight: bold;
 
2442
    text-align: left;
 
2443
    padding-left: 15px;
 
2444
    text-shadow: black 0px 4px 3px 0px;
 
2445
}
 
2446
 
 
2447
/* Screen shield */
 
2448
 
 
2449
.screen-shield-background {
 
2450
    background: black;
 
2451
}
 
2452
 
 
2453
#lockDialogGroup {
 
2454
    background: #2e3436 url(noise-texture.png);
 
2455
    background-repeat: repeat;
 
2456
}
 
2457
 
 
2458
.screen-shield-arrows {
 
2459
    padding-bottom: 3em;
 
2460
}
 
2461
 
 
2462
.screen-shield-arrows Gjs_Arrow {
 
2463
    color: white;
 
2464
    width: 80px;
 
2465
    height: 48px;
 
2466
    -arrow-thickness: 12px;
 
2467
    -arrow-shadow: 0 1px 1px rgba(0,0,0,0.4);
 
2468
}
 
2469
 
 
2470
.screen-shield-contents-box {
 
2471
    spacing: 48px;
 
2472
}
 
2473
 
 
2474
.screen-shield-clock {
 
2475
    color: white;
 
2476
    text-shadow: 0px 1px 2px rgba(0,0,0,0.6);
 
2477
    font-weight: bold;
 
2478
    text-align: center;
 
2479
    padding-bottom: 1.5em;
 
2480
}
 
2481
 
 
2482
.screen-shield-clock-time {
 
2483
    font-size: 72pt;
 
2484
    text-shadow: 0px 2px 2px rgba(0,0,0,0.4);
 
2485
}
 
2486
 
 
2487
.screen-shield-clock-date {
 
2488
    font-size: 28pt;
 
2489
}
 
2490
 
 
2491
#screenShieldNotifications {
 
2492
    border-radius: 8px;
 
2493
    background-color: rgba(0.0, 0.0, 0.0, 0.9);
 
2494
    border: 2px solid #868686;
 
2495
    max-height: 500px;
 
2496
    padding: 18px 0;
 
2497
    box-shadow: .5em .5em 20px rgba(0, 0, 0, 0.5);
 
2498
}
 
2499
 
 
2500
.screen-shield-notifications-box {
 
2501
    spacing: 18px;
 
2502
    max-width: 34em;
 
2503
}
 
2504
 
 
2505
.screen-shield-notification-source {
 
2506
    padding: 13px 24px;
 
2507
    spacing: 5px;
 
2508
}
 
2509
 
 
2510
.screen-shield-notification-label {
 
2511
    font-size: 1.2em;
 
2512
    font-weight: bold;
 
2513
    padding: 0px 18px;
 
2514
    color: #babdb6;
 
2515
}
 
2516
 
 
2517
.screen-shield-notification-count-text {
 
2518
    padding: 0px 18px;
 
2519
}
 
2520
 
 
2521
/* Remove background from notifications, otherwise
 
2522
   opacity is doubled and they look darker
 
2523
*/
 
2524
.screen-shield-notifications-box .notification {
 
2525
    background-color: transparent;
 
2526
}
 
2527
 
 
2528
/* Override padding on resident notifications, since
 
2529
   the notifications box has its own spacing
 
2530
*/
 
2531
.screen-shield-notifications-box .summary-notification-stack-scrollview {
 
2532
    padding-top: 0px;
 
2533
    padding-bottom: 0px;
 
2534
}
 
2535
 
 
2536
.input-source-switcher-symbol {
 
2537
   font-size: 34pt;
 
2538
   width: 96px;
 
2539
   height: 96px;
 
2540
}
 
2541
 
 
2542
/* Background menu */
 
2543
 
 
2544
.background-menu {
 
2545
    -boxpointer-gap: 4px;
 
2546
}