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 • 54.29 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: 3px 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: 3px 6px; }
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.left .dash-item-container > StWidget,
1161
#dashtodockContainer.extended.right .dash-item-container > StWidget,
1162
#dashtodockContainer.extended.left .dash-item-container:last-child > StWidget .app-well-app,
1163
#dashtodockContainer.extended.right .dash-item-container:last-child > StWidget .app-well-app {
1164
padding: 3px 6px; }
1165
1166
#dashtodockContainer.extended.left .dash-item-container:first-child > StWidget,
1167
#dashtodockContainer.extended.right .dash-item-container:first-child > StWidget {
1168
padding: 6px 6px 3px 6px; }
1169
1170
#dashtodockContainer.extended.left .dash-item-container:last-child > StWidget,
1171
#dashtodockContainer.extended.right .dash-item-container:last-child > StWidget {
1172
padding: 3px 6px 6px 6px; }
1173
1174
#dashtodockContainer.extended.top .dash-item-container > StWidget,
1175
#dashtodockContainer.extended.bottom .dash-item-container > StWidget,
1176
#dashtodockContainer.extended.top .dash-item-container:last-child > StWidget .app-well-app,
1177
#dashtodockContainer.extended.bottom .dash-item-container:last-child > StWidget .app-well-app {
1178
padding: 6px 3px; }
1179
1180
#dashtodockContainer.extended.top .dash-item-container:first-child > StWidget,
1181
#dashtodockContainer.extended.bottom .dash-item-container:first-child > StWidget {
1182
padding: 6px 3px 6px 6px; }
1183
1184
#dashtodockContainer.extended.top .dash-item-container:last-child > StWidget,
1185
#dashtodockContainer.extended.bottom .dash-item-container:last-child > StWidget {
1186
padding: 6px 6px 6px 3px; }
1187
1188
#dashtodockContainer .app-well-app-running-dot {
1189
background-color: transparent; }
1190
1191
#dashtodockContainer .app-well-app .overview-icon {
1192
background-size: contain; }
1193
1194
#dashtodockContainer .app-well-app.running1 .overview-icon {
1195
background-image: url("running1.svg"); }
1196
1197
#dashtodockContainer .app-well-app.running1.focused .overview-icon {
1198
background-image: url("running1-focused.svg"); }
1199
1200
#dashtodockContainer .app-well-app.running2 .overview-icon {
1201
background-image: url("running2.svg"); }
1202
1203
#dashtodockContainer .app-well-app.running2.focused .overview-icon {
1204
background-image: url("running2-focused.svg"); }
1205
1206
#dashtodockContainer .app-well-app.running3 .overview-icon {
1207
background-image: url("running3.svg"); }
1208
1209
#dashtodockContainer .app-well-app.running3.focused .overview-icon {
1210
background-image: url("running3-focused.svg"); }
1211
1212
#dashtodockContainer .app-well-app.running4 .overview-icon {
1213
background-image: url("running4.svg"); }
1214
1215
#dashtodockContainer .app-well-app.running4.focused .overview-icon {
1216
background-image: url("running4-focused.svg"); }
1217
1218
/* Add Simple Dock Support */
1219
#dash:desktop {
1220
background-color: rgba(0, 0, 0, 0.5); }
1221
1222
/* App Vault/Grid */
1223
.icon-grid {
1224
spacing: 30px;
1225
-shell-grid-horizontal-item-size: 136px;
1226
-shell-grid-vertical-item-size: 136px; }
1227
.icon-grid .overview-icon {
1228
icon-size: 96px; }
1229
1230
.app-view-controls {
1231
width: 320px;
1232
padding-bottom: 32px; }
1233
1234
.app-view-control {
1235
padding: 7px 32px 8px;
1236
font-weight: bold;
1237
color: rgba(255, 255, 255, 0.8); }
1238
.app-view-control:hover {
1239
color: white;
1240
background-color: rgba(255, 255, 255, 0.2) !important; }
1241
.app-view-control:active {
1242
color: white;
1243
background-color: rgba(255, 255, 255, 0.4) !important; }
1244
.app-view-control:checked {
1245
color: white;
1246
background-color: rgba(0, 0, 0, 0.01) !important;
1247
box-shadow: inset 0 2px 0px rgba(255, 255, 255, 0.8); }
1248
.app-view-control:first-child {
1249
border-right-width: 0;
1250
border-radius: 2px; }
1251
.app-view-control:first-child:checked {
1252
border-radius: 0; }
1253
.app-view-control:last-child {
1254
border-radius: 2px; }
1255
.app-view-control:last-child:checked {
1256
border-radius: 0; }
1257
1258
.search-provider-icon:focus, .search-provider-icon:selected, .search-provider-icon:hover,
1259
.list-search-result:focus,
1260
.list-search-result:selected,
1261
.list-search-result:hover {
1262
background-color: rgba(255, 255, 255, 0.2);
1263
transition-duration: 0s; }
1264
.search-provider-icon:active, .search-provider-icon:checked,
1265
.list-search-result:active,
1266
.list-search-result:checked {
1267
background-color: rgba(255, 255, 255, 0.4);
1268
transition-duration: 0.2s; }
1269
1270
.app-well-app:hover .overview-icon, .app-well-app:focus .overview-icon, .app-well-app:selected .overview-icon,
1271
.app-well-app.app-folder:hover .overview-icon,
1272
.app-well-app.app-folder:focus .overview-icon,
1273
.app-well-app.app-folder:selected .overview-icon,
1274
.show-apps:hover .overview-icon,
1275
.show-apps:focus .overview-icon,
1276
.show-apps:selected .overview-icon,
1277
.grid-search-result:hover .overview-icon,
1278
.grid-search-result:focus .overview-icon,
1279
.grid-search-result:selected .overview-icon {
1280
background-color: rgba(255, 255, 255, 0.2);
1281
transition-duration: 0s;
1282
border-image: none;
1283
background-image: none; }
1284
.app-well-app:active .overview-icon, .app-well-app:checked .overview-icon,
1285
.app-well-app.app-folder:active .overview-icon,
1286
.app-well-app.app-folder:checked .overview-icon,
1287
.show-apps:active .overview-icon,
1288
.show-apps:checked .overview-icon,
1289
.grid-search-result:active .overview-icon,
1290
.grid-search-result:checked .overview-icon {
1291
background-color: rgba(255, 255, 255, 0.4);
1292
box-shadow: 0 0 transparent;
1293
transition-duration: 0.2s; }
1294
1295
.app-well-app-running-dot {
1296
width: 32px;
1297
height: 2px;
1298
background-color: rgba(255, 255, 255, 0.8);
1299
margin-bottom: 0; }
1300
1301
.search-provider-icon,
1302
.list-search-result, .app-well-app .overview-icon,
1303
.app-well-app.app-folder .overview-icon,
1304
.show-apps .overview-icon,
1305
.grid-search-result .overview-icon {
1306
color: white;
1307
border-radius: 2px;
1308
padding: 6px;
1309
border: none;
1310
transition-duration: 0.2s;
1311
text-align: center; }
1312
1313
.app-well-app.app-folder > .overview-icon {
1314
background-color: rgba(255, 255, 255, 0.1); }
1315
1316
.show-apps .show-apps-icon {
1317
color: rgba(255, 255, 255, 0.8); }
1318
1319
.show-apps:hover .show-apps-icon,
1320
.show-apps:active .show-apps-icon,
1321
.show-apps:checked .show-apps-icon,
1322
.show-apps:focus .show-apps-icon {
1323
color: white;
1324
transition-duration: 0.2s; }
1325
1326
.app-folder-popup {
1327
-arrow-border-radius: 2px;
1328
-arrow-background-color: rgba(255, 255, 255, 0.1);
1329
-arrow-base: 24px;
1330
-arrow-rise: 12px; }
1331
1332
.app-folder-popup-bin {
1333
padding: 5px; }
1334
1335
.app-folder-icon {
1336
padding: 5px;
1337
spacing-rows: 5px;
1338
spacing-columns: 5px; }
1339
1340
.page-indicator {
1341
padding: 15px 20px; }
1342
.page-indicator .page-indicator-icon {
1343
width: 12px;
1344
height: 12px;
1345
border-radius: 12px;
1346
background-image: none;
1347
background-color: rgba(255, 255, 255, 0.3); }
1348
.page-indicator:hover .page-indicator-icon {
1349
background-image: none;
1350
background-color: rgba(255, 255, 255, 0.4); }
1351
.page-indicator:active .page-indicator-icon {
1352
background-image: none;
1353
background-color: rgba(255, 255, 255, 0.5); }
1354
.page-indicator:checked .page-indicator-icon, .page-indicator:checked:active {
1355
background-image: none;
1356
background-color: white; }
1357
1358
.app-well-app > .overview-icon.overview-icon-with-label,
1359
.grid-search-result .overview-icon.overview-icon-with-label {
1360
padding: 10px 8px 5px 8px;
1361
spacing: 4px; }
1362
1363
.workspace-thumbnails {
1364
visible-width: 32px;
1365
spacing: 12px;
1366
padding: 12px;
1367
border-radius: 2px 0 0 2px; }
1368
.workspace-thumbnails:rtl {
1369
border-radius: 0 2px 2px 0; }
1370
1371
.workspace-thumbnail-indicator {
1372
border: 0 solid rgba(255, 255, 255, 0.8);
1373
border-left-width: 2px;
1374
padding: 6px;
1375
border-radius: 0; }
1376
1377
.search-display > StBoxLayout,
1378
.all-apps,
1379
.frequent-apps > StBoxLayout {
1380
padding: 0px 88px 10px 88px; }
1381
1382
.workspace-thumbnails {
1383
color: white;
1384
background-color: rgba(255, 255, 255, 0.1);
1385
border: none; }
1386
1387
.search-statustext, .no-frequent-applications-label {
1388
font-size: 2em;
1389
font-weight: bold;
1390
color: rgba(255, 255, 255, 0.5); }
1391
1392
/* Add Dash to Dock Support */
1393
#workspacestodockContainer .workspace-thumbnails {
1394
background-color: rgba(0, 0, 0, 0.5); }
1395
1396
#workspacestodockContainer:overview .workspace-thumbnails {
1397
background-color: rgba(255, 255, 255, 0.1); }
1398
1399
#workspacestodockContainer.fullheight:overview .workspace-thumbnails {
1400
background-color: transparent; }
1401
1402
#workspacestodockContainer.right .workspace-thumbnails {
1403
border-radius: 2px 0 0 2px; }
1404
1405
#workspacestodockContainer.left .workspace-thumbnails {
1406
border-radius: 0 2px 2px 0; }
1407
1408
/* NOTIFICATIONS & MESSAGE TRAY */
1409
.url-highlighter {
1410
link-color: #3498db; }
1411
1412
.notification-banner {
1413
font-size: 11pt;
1414
width: 34em;
1415
margin: 5px;
1416
border-radius: 2px;
1417
color: rgba(0, 0, 0, 0.8);
1418
background-color: rgba(255, 255, 255, 0.95);
1419
border: none;
1420
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.24), 0 3px 6px rgba(0, 0, 0, 0.345); }
1421
.notification-banner:hover {
1422
background-color: rgba(255, 255, 255, 0.95); }
1423
.notification-banner:focus {
1424
background-color: rgba(255, 255, 255, 0.95); }
1425
.notification-banner .notification-icon {
1426
padding: 5px; }
1427
.notification-banner .notification-content {
1428
padding: 5px;
1429
spacing: 5px; }
1430
.notification-banner .secondary-icon {
1431
icon-size: 1.09em; }
1432
.notification-banner .notification-actions {
1433
background-color: transparent;
1434
padding-top: 0;
1435
border-top: 1px solid rgba(0, 0, 0, 0.16);
1436
spacing: 1px; }
1437
.notification-banner .notification-button {
1438
padding: 9px 4px 10px;
1439
background-color: transparent;
1440
color: rgba(0, 0, 0, 0.64);
1441
font-weight: 500; }
1442
.notification-banner .notification-button:first-child {
1443
border-radius: 0 0 0 2px; }
1444
.notification-banner .notification-button:last-child {
1445
border-radius: 0 0 2px 0; }
1446
.notification-banner .notification-button:hover, .notification-banner .notification-buttonfocus {
1447
background-color: rgba(0, 0, 0, 0.08);
1448
color: rgba(0, 0, 0, 0.8); }
1449
.notification-banner .notification-button:active {
1450
background-color: rgba(0, 0, 0, 0.16);
1451
color: rgba(0, 0, 0, 0.8); }
1452
1453
.summary-source-counter {
1454
font-size: 10pt;
1455
font-weight: bold;
1456
height: 1.6em;
1457
width: 1.6em;
1458
-shell-counter-overlap-x: 3px;
1459
-shell-counter-overlap-y: 3px;
1460
background-color: #3498db;
1461
color: white;
1462
border: 2px solid white;
1463
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5);
1464
border-radius: 0.9em; }
1465
1466
.secondary-icon {
1467
icon-size: 1.09em; }
1468
1469
.chat-body {
1470
spacing: 5px; }
1471
1472
.chat-response {
1473
margin: 5px; }
1474
1475
.chat-log-message {
1476
color: rgba(0, 0, 0, 0.8); }
1477
1478
.chat-new-group {
1479
padding-top: 1em; }
1480
1481
.chat-received {
1482
padding-left: 4px; }
1483
.chat-received:rtl {
1484
padding-left: 0px;
1485
padding-right: 4px; }
1486
1487
.chat-sent {
1488
padding-left: 18pt;
1489
color: rgba(0, 0, 0, 0.6); }
1490
.chat-sent:rtl {
1491
padding-left: 0;
1492
padding-right: 18pt; }
1493
1494
.chat-meta-message {
1495
padding-left: 4px;
1496
font-size: 9pt;
1497
font-weight: bold;
1498
color: rgba(0, 0, 0, 0.4); }
1499
.chat-meta-message:rtl {
1500
padding-left: 0;
1501
padding-right: 4px; }
1502
1503
.hotplug-transient-box {
1504
spacing: 6px;
1505
padding: 2px 72px 2px 12px; }
1506
1507
.hotplug-notification-item {
1508
padding: 2px 10px; }
1509
.hotplug-notification-item:focus {
1510
padding: 1px 71px 1px 11px; }
1511
1512
.hotplug-notification-item-icon {
1513
icon-size: 24px;
1514
padding: 2px 5px; }
1515
1516
.hotplug-resident-box {
1517
spacing: 8px; }
1518
1519
.hotplug-resident-mount {
1520
spacing: 8px;
1521
border-radius: 2px; }
1522
.hotplug-resident-mount:hover {
1523
background-color: rgba(0, 0, 0, 0.08); }
1524
.hotplug-resident-mount:active {
1525
background-color: rgba(0, 0, 0, 0.16); }
1526
1527
.hotplug-resident-mount-label {
1528
color: inherit;
1529
padding-left: 6px; }
1530
1531
.hotplug-resident-mount-icon {
1532
icon-size: 24px;
1533
padding-left: 6px; }
1534
1535
.hotplug-resident-eject-icon {
1536
icon-size: 16px; }
1537
1538
.hotplug-resident-eject-button {
1539
padding: 7px;
1540
border-radius: 2px;
1541
color: rgba(0, 0, 0, 0.8); }
1542
1543
/* Eeeky things */
1544
.legacy-tray {
1545
background-color: rgba(255, 255, 255, 0.95);
1546
border: none;
1547
border-bottom-width: 0;
1548
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.24), 0 3px 6px rgba(0, 0, 0, 0.345); }
1549
.legacy-tray:ltr {
1550
border-radius: 0 2px 0 0;
1551
border-left-width: 0; }
1552
.legacy-tray:rtl {
1553
border-radius: 2px 0 0 0;
1554
border-right-width: 0; }
1555
1556
.legacy-tray-handle,
1557
.legacy-tray-icon {
1558
padding: 6px; }
1559
.legacy-tray-handle StIcon,
1560
.legacy-tray-icon StIcon {
1561
icon-size: 24px; }
1562
.legacy-tray-handle:hover, .legacy-tray-handle:focus,
1563
.legacy-tray-icon:hover,
1564
.legacy-tray-icon:focus {
1565
background-color: rgba(0, 0, 0, 0.08); }
1566
.legacy-tray-handle:active,
1567
.legacy-tray-icon:active {
1568
background-color: rgba(0, 0, 0, 0.16); }
1569
1570
.legacy-tray-icon-box {
1571
spacing: 12px; }
1572
.legacy-tray-icon-box:ltr {
1573
padding-left: 12px; }
1574
.legacy-tray-icon-box:rtl {
1575
padding-right: 12px; }
1576
.legacy-tray-icon-box StButton {
1577
width: 24px;
1578
height: 24px; }
1579
1580
.magnifier-zoom-region {
1581
border: 2px solid #3498db; }
1582
.magnifier-zoom-region.full-screen {
1583
border-width: 0; }
1584
1585
/* On-screen Keyboard */
1586
#keyboard {
1587
background-color: rgba(0, 0, 0, 0.2); }
1588
1589
.keyboard-layout {
1590
spacing: 10px;
1591
padding: 10px; }
1592
1593
.keyboard-row {
1594
spacing: 15px; }
1595
1596
.keyboard-key {
1597
min-height: 2em;
1598
min-width: 2em;
1599
font-size: 2em;
1600
font-weight: bold;
1601
border-radius: 2px;
1602
border: none;
1603
color: inherit;
1604
color: rgba(0, 0, 0, 0.64);
1605
background-color: rgba(255, 255, 255, 0.95);
1606
border-color: transparent;
1607
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1608
text-shadow: none;
1609
icon-shadow: none; }
1610
.keyboard-key:focus {
1611
color: rgba(0, 0, 0, 0.8);
1612
text-shadow: none;
1613
icon-shadow: none;
1614
box-shadow: 0 0 transparent; }
1615
.keyboard-key:hover, .keyboard-key:checked {
1616
color: rgba(0, 0, 0, 0.8);
1617
background-color: rgba(255, 255, 255, 0.95);
1618
border-color: transparent;
1619
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.24), 0 3px 6px rgba(0, 0, 0, 0.345);
1620
text-shadow: none;
1621
icon-shadow: none; }
1622
.keyboard-key:active {
1623
color: rgba(0, 0, 0, 0.8);
1624
background-color: rgba(215, 215, 215, 0.92);
1625
border-color: transparent;
1626
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.24), 0 3px 6px rgba(0, 0, 0, 0.345);
1627
text-shadow: none;
1628
icon-shadow: none; }
1629
.keyboard-key:grayed {
1630
background-color: rgba(0, 0, 0, 0.5);
1631
color: white;
1632
border-color: rgba(0, 0, 0, 0.7); }
1633
1634
.keyboard-subkeys {
1635
color: inherit;
1636
padding: 5px;
1637
-arrow-border-radius: 0;
1638
-arrow-background-color: transparent;
1639
-arrow-border-width: 0;
1640
-arrow-border-color: transparent;
1641
-arrow-base: 0;
1642
-arrow-rise: 0;
1643
-boxpointer-gap: 5px;
1644
background-color: rgba(255, 255, 255, 0.95);
1645
border-radius: 2px;
1646
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.24), 0 3px 6px rgba(0, 0, 0, 0.345); }
1647
1648
.candidate-popup-content {
1649
padding: 0.5em;
1650
spacing: 0.3em; }
1651
1652
.candidate-index {
1653
padding: 0 0.5em 0 0;
1654
color: rgba(0, 0, 0, 0.4); }
1655
1656
.candidate-box {
1657
transition-duration: 0s;
1658
padding: 0.3em 0.5em 0.3em 0.5em;
1659
border-radius: 2px; }
1660
.candidate-box:hover {
1661
background-color: rgba(0, 0, 0, 0.08);
1662
color: rgba(0, 0, 0, 0.8); }
1663
.candidate-box:active {
1664
background-color: rgba(0, 0, 0, 0.16);
1665
color: rgba(0, 0, 0, 0.8); }
1666
.candidate-box:selected {
1667
background-color: #3498db;
1668
color: white; }
1669
1670
.candidate-page-button-box {
1671
height: 2em; }
1672
.vertical .candidate-page-button-box {
1673
padding-top: 0.5em; }
1674
.horizontal .candidate-page-button-box {
1675
padding-left: 0.5em; }
1676
1677
.candidate-page-button {
1678
padding: 4px; }
1679
1680
.candidate-page-button-previous {
1681
border-radius: 2px;
1682
border-right-width: 0; }
1683
1684
.candidate-page-button-next {
1685
border-radius: 2px; }
1686
1687
.candidate-page-button-icon {
1688
icon-size: 1.09em; }
1689
1690
/* Auth Dialogs & Screen Shield */
1691
.framed-user-icon {
1692
background-size: contain;
1693
border: none;
1694
color: white;
1695
border-radius: 2px; }
1696
.framed-user-icon:hover {
1697
border-color: white;
1698
color: white; }
1699
1700
.login-dialog-banner-view {
1701
padding-top: 24px;
1702
max-width: 23em; }
1703
1704
.login-dialog {
1705
border: none;
1706
background-color: transparent; }
1707
.login-dialog StEntry {
1708
color: white;
1709
selection-background-color: rgba(255, 255, 255, 0.4);
1710
selected-color: white;
1711
background-color: rgba(0, 0, 0, 0.01);
1712
border-color: transparent;
1713
box-shadow: inset 0 -1px rgba(255, 255, 255, 0.2); }
1714
.login-dialog StEntry:focus {
1715
border-color: transparent;
1716
box-shadow: inset 0 -2px rgba(255, 255, 255, 0.8); }
1717
.login-dialog StEntry:insensitive {
1718
color: rgba(0, 0, 0, 0.32);
1719
border-color: transparent;
1720
box-shadow: inset 0 -1px rgba(255, 255, 255, 0.16);
1721
color: rgba(255, 255, 255, 0.4); }
1722
.login-dialog .modal-dialog-button-box {
1723
spacing: 3px; }
1724
.login-dialog .modal-dialog-button {
1725
padding: 7px 16px 8px;
1726
color: rgba(255, 255, 255, 0.8);
1727
background-color: transparent;
1728
border-color: transparent;
1729
box-shadow: 0 0 transparent;
1730
text-shadow: none;
1731
icon-shadow: none; }
1732
.login-dialog .modal-dialog-button:hover, .login-dialog .modal-dialog-button:focus {
1733
color: white;
1734
background-color: rgba(255, 255, 255, 0.2);
1735
border-color: transparent;
1736
box-shadow: 0 0 transparent;
1737
text-shadow: none;
1738
icon-shadow: none; }
1739
.login-dialog .modal-dialog-button:active {
1740
color: white;
1741
background-color: rgba(255, 255, 255, 0.4);
1742
border-color: transparent;
1743
box-shadow: 0 0 transparent;
1744
text-shadow: none;
1745
icon-shadow: none; }
1746
.login-dialog .modal-dialog-button:insensitive {
1747
color: rgba(255, 255, 255, 0.32);
1748
background-color: transparent;
1749
border-color: transparent;
1750
box-shadow: 0 0 transparent;
1751
text-shadow: none;
1752
icon-shadow: none; }
1753
.login-dialog .modal-dialog-button:default {
1754
color: white;
1755
background-color: #3498db;
1756
border-color: transparent;
1757
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1758
text-shadow: none;
1759
icon-shadow: none; }
1760
.login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus {
1761
color: white;
1762
background-color: #3498db;
1763
border-color: transparent;
1764
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.24), 0 3px 6px rgba(0, 0, 0, 0.345);
1765
text-shadow: none;
1766
icon-shadow: none; }
1767
.login-dialog .modal-dialog-button:default:active {
1768
color: white;
1769
background-color: #5dade2;
1770
border-color: transparent;
1771
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.24), 0 3px 6px rgba(0, 0, 0, 0.345);
1772
text-shadow: none;
1773
icon-shadow: none; }
1774
.login-dialog .modal-dialog-button:default:insensitive {
1775
color: rgba(255, 255, 255, 0.4);
1776
background-color: rgba(255, 255, 255, 0.16);
1777
border-color: transparent;
1778
box-shadow: 0 0 transparent;
1779
text-shadow: none;
1780
icon-shadow: none; }
1781
1782
.login-dialog-logo-bin {
1783
padding: 24px 0px; }
1784
1785
.login-dialog-banner {
1786
color: rgba(255, 255, 255, 0.8); }
1787
1788
.login-dialog-button-box {
1789
spacing: 5px; }
1790
1791
.login-dialog-message-warning {
1792
color: #e67e22; }
1793
1794
.login-dialog-message-hint {
1795
padding-top: 0;
1796
padding-bottom: 20px; }
1797
1798
.login-dialog-user-selection-box {
1799
padding: 100px 0px; }
1800
.login-dialog-user-selection-box .login-dialog-not-listed-label {
1801
padding-left: 2px; }
1802
.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 {
1803
color: white; }
1804
1805
.login-dialog-not-listed-label {
1806
font-size: 90%;
1807
font-weight: bold;
1808
color: rgba(255, 255, 255, 0.8);
1809
padding-top: 1em; }
1810
.login-dialog-not-listed-label:hover {
1811
color: white; }
1812
.login-dialog-not-listed-label:focus {
1813
background-color: rgba(255, 255, 255, 0.2); }
1814
1815
.login-dialog-user-list-view {
1816
-st-vfade-offset: 1em; }
1817
1818
.login-dialog-user-list {
1819
spacing: 12px;
1820
padding: .2em;
1821
width: 23em; }
1822
.login-dialog-user-list:expanded .login-dialog-user-list-item:focus {
1823
background-color: rgba(255, 255, 255, 0.2);
1824
color: white; }
1825
.login-dialog-user-list:expanded .login-dialog-user-list-item:hover {
1826
background-color: rgba(255, 255, 255, 0.2);
1827
color: white; }
1828
.login-dialog-user-list:expanded .login-dialog-user-list-item:active {
1829
background-color: rgba(255, 255, 255, 0.4);
1830
color: white; }
1831
.login-dialog-user-list:expanded .login-dialog-user-list-item:logged-in {
1832
border-right: 2px solid rgba(255, 255, 255, 0.8); }
1833
1834
.login-dialog-user-list-item {
1835
border-radius: 2px;
1836
padding: .2em;
1837
color: rgba(255, 255, 255, 0.8); }
1838
.login-dialog-user-list-item:ltr {
1839
padding-right: 1em; }
1840
.login-dialog-user-list-item:rtl {
1841
padding-left: 1em; }
1842
.login-dialog-user-list-item:hover {
1843
background-color: rgba(255, 255, 255, 0.2);
1844
color: white; }
1845
.login-dialog-user-list-item:active {
1846
background-color: rgba(255, 255, 255, 0.4);
1847
color: white; }
1848
.login-dialog-user-list-item .login-dialog-timed-login-indicator {
1849
height: 2px;
1850
margin: 2px 0 0 0;
1851
background-color: white; }
1852
.login-dialog-user-list-item:focus .login-dialog-timed-login-indicator {
1853
background-color: white; }
1854
1855
.login-dialog-username,
1856
.user-widget-label {
1857
color: white;
1858
font-size: 120%;
1859
font-weight: bold;
1860
text-align: left;
1861
padding-left: 15px; }
1862
1863
.user-widget-label:ltr {
1864
padding-left: 18px; }
1865
.user-widget-label:rtl {
1866
padding-right: 18px; }
1867
1868
.login-dialog-prompt-layout {
1869
padding-top: 24px;
1870
padding-bottom: 12px;
1871
spacing: 8px;
1872
width: 23em; }
1873
1874
.login-dialog-prompt-label {
1875
color: rgba(255, 255, 255, 0.5);
1876
font-size: 1em;
1877
padding-top: 1em; }
1878
1879
.login-dialog-session-list-button StIcon {
1880
icon-size: 1.25em; }
1881
1882
.login-dialog-session-list-button {
1883
color: rgba(255, 255, 255, 0.8); }
1884
.login-dialog-session-list-button:hover, .login-dialog-session-list-button:focus {
1885
color: white; }
1886
.login-dialog-session-list-button:active {
1887
color: white; }
1888
1889
.screen-shield-arrows {
1890
padding-bottom: 3em; }
1891
1892
.screen-shield-arrows Gjs_Arrow {
1893
color: white;
1894
width: 80px;
1895
height: 48px;
1896
-arrow-thickness: 12px;
1897
-arrow-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1898
1899
.screen-shield-clock {
1900
color: white;
1901
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
1902
font-weight: normal;
1903
text-align: center;
1904
padding-bottom: 1.5em; }
1905
1906
.screen-shield-clock-time {
1907
font-size: 112px;
1908
font-weight: 300;
1909
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
1910
1911
.screen-shield-clock-date {
1912
font-size: 45px; }
1913
1914
.screen-shield-notifications-container {
1915
spacing: 6px;
1916
width: 30em;
1917
background-color: transparent;
1918
max-height: 500px; }
1919
.screen-shield-notifications-container .summary-notification-stack-scrollview {
1920
padding-top: 0;
1921
padding-bottom: 0; }
1922
.screen-shield-notifications-container .notification,
1923
.screen-shield-notifications-container .screen-shield-notification-source {
1924
padding: 12px 6px;
1925
border: none;
1926
background-color: rgba(0, 0, 0, 0.5);
1927
color: white;
1928
border-radius: 2px; }
1929
.screen-shield-notifications-container .notification {
1930
margin-right: 15px; }
1931
1932
.screen-shield-notification-label {
1933
font-weight: bold;
1934
padding: 0px 0px 0px 12px; }
1935
1936
.screen-shield-notification-count-text {
1937
padding: 0px 0px 0px 12px; }
1938
1939
#panel.lock-screen {
1940
background-color: rgba(0, 0, 0, 0.5); }
1941
1942
.screen-shield-background {
1943
background: black;
1944
box-shadow: 0 19px 38px rgba(0, 0, 0, 0.45), 0 15px 12px rgba(0, 0, 0, 0.33); }
1945
1946
#lockDialogGroup {
1947
background: #333333 url(noise-texture.png);
1948
background-repeat: repeat; }
1949
1950
#screenShieldNotifications StButton#vhandle, #screenShieldNotifications StButton#hhandle {
1951
background-color: rgba(255, 255, 255, 0.6); }
1952
#screenShieldNotifications StButton#vhandle:hover, #screenShieldNotifications StButton#vhandle:focus, #screenShieldNotifications StButton#hhandle:hover, #screenShieldNotifications StButton#hhandle:focus {
1953
background-color: rgba(255, 255, 255, 0.8); }
1954
#screenShieldNotifications StButton#vhandle:active, #screenShieldNotifications StButton#hhandle:active {
1955
background-color: white; }
1956
1957
#LookingGlassDialog {
1958
background-color: rgba(255, 255, 255, 0.95);
1959
spacing: 4px;
1960
padding: 0;
1961
border: none;
1962
border-radius: 2px;
1963
box-shadow: 0 14px 28px rgba(0, 0, 0, 0.375), 0 10px 10px rgba(0, 0, 0, 0.33); }
1964
#LookingGlassDialog > #Toolbar {
1965
padding: 0 8px;
1966
border: none;
1967
border-radius: 0;
1968
background-color: rgba(0, 0, 0, 0.01);
1969
box-shadow: inset 0 -1px 0px rgba(0, 0, 0, 0.1); }
1970
#LookingGlassDialog .labels {
1971
spacing: 0; }
1972
#LookingGlassDialog .notebook-tab {
1973
-natural-hpadding: 12px;
1974
-minimum-hpadding: 6px;
1975
font-weight: bold;
1976
color: rgba(0, 0, 0, 0.4);
1977
transition-duration: 0.2s;
1978
padding-left: .3em;
1979
padding-right: .3em;
1980
padding: 7px 32px 8px; }
1981
#LookingGlassDialog .notebook-tab:hover {
1982
color: rgba(0, 0, 0, 0.8);
1983
text-shadow: none; }
1984
#LookingGlassDialog .notebook-tab:selected {
1985
border-bottom-width: 0;
1986
border-color: transparent;
1987
background-color: rgba(0, 0, 0, 0.01);
1988
box-shadow: inset 0 -2px 0px #3498db;
1989
color: rgba(0, 0, 0, 0.8);
1990
text-shadow: none; }
1991
#LookingGlassDialog StBoxLayout#EvalBox {
1992
padding: 4px;
1993
spacing: 4px; }
1994
#LookingGlassDialog StBoxLayout#ResultsArea {
1995
spacing: 4px; }
1996
1997
.lg-dialog StEntry {
1998
selection-background-color: #3498db;
1999
selected-color: white; }
2000
.lg-dialog .shell-link {
2001
color: #3498db; }
2002
.lg-dialog .shell-link:hover {
2003
color: #3498db; }
2004
2005
.lg-completions-text {
2006
font-size: .9em;
2007
font-style: italic; }
2008
2009
.lg-obj-inspector-title {
2010
spacing: 4px; }
2011
2012
.lg-obj-inspector-button {
2013
border: 1px solid gray;
2014
padding: 4px;
2015
border-radius: 2px; }
2016
.lg-obj-inspector-button:hover {
2017
border: 1px solid #ffffff; }
2018
2019
#lookingGlassExtensions {
2020
padding: 4px; }
2021
2022
.lg-extensions-list {
2023
padding: 4px;
2024
spacing: 6px; }
2025
2026
.lg-extension {
2027
border: none;
2028
border-radius: 2px;
2029
padding: 4px; }
2030
2031
.lg-extension-name {
2032
font-weight: bold;
2033
font-size: 1.5em; }
2034
2035
.lg-extension-meta {
2036
spacing: 6px; }
2037
2038
#LookingGlassPropertyInspector {
2039
background: rgba(255, 255, 255, 0.95);
2040
border: none;
2041
border-radius: 2px;
2042
padding: 6px;
2043
box-shadow: 0 14px 28px rgba(0, 0, 0, 0.375), 0 10px 10px rgba(0, 0, 0, 0.33); }
2044