A fork of the Materia GTK theme.

By using this site, you agree to have cookies stored on your device, strictly for functional purposes, such as storing your session and preferences.

Dismiss

 gnome-shell.css

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