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