Skip to content

Commit 0601516

Browse files
btoprobtopro
committed
https://github.com/elmsln/issues/issues/1939
1 parent 2d0618e commit 0601516

File tree

20 files changed

+133
-486
lines changed

20 files changed

+133
-486
lines changed

‎elements/a11y-collapse/src/a11y-collapse.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -94,6 +94,7 @@ class A11yCollapse extends DDD {
9494
);
9595
margin: var(--a11y-collapse-margin);
9696
color: var(--a11y-collapse-heading-color);
97+
9798
background-color: var(--a11y-collapse-heading-background-color);
9899
}
99100
:host([disabled]) #heading {

‎elements/clean-one/clean-one.js

Lines changed: 14 additions & 193 deletions
Original file line numberDiff line numberDiff line change
@@ -90,6 +90,8 @@ class CleanOne extends PrintBranchMixin(
9090
padding: 8px 4px;
9191
}
9292
site-menu {
93+
background-color: light-dark(var(--ddd-accent-6), var(--ddd-primary-4));
94+
color: light-dark(black, var(--ddd-accent-6));
9395
height: var(--clean-one-site-menu-height, calc(100vh - 60px));
9496
--site-menu-active-color: var(
9597
--haxcms-user-styles-color-theme-color-3
@@ -100,10 +102,8 @@ class CleanOne extends PrintBranchMixin(
100102
);
101103
--haxcms-tooltip-color: var(--ddd-theme-default-infoLight);
102104
--haxcms-tooltip-background-color: var(--ddd-theme-default-info);
103-
--map-menu-item-a-active-background-color: var(
104-
--simple-colors-default-theme-grey-1,
105-
rgba(200, 200, 200, 0.1)
106-
);
105+
--map-menu-item-a-active-background-color: light-dark(var(--ddd-primary-4), var(--ddd-accent-6));
106+
--map-menu-item-a-active-color: light-dark(var(--ddd-accent-6), var(--ddd-primary-4));
107107
font-family: var(--ddd-font-navigation);
108108
--site-menu-font-size: var(--ddd-font-size-xs);
109109
}
@@ -124,7 +124,7 @@ class CleanOne extends PrintBranchMixin(
124124
site-rss-button,
125125
site-print-button,
126126
site-git-corner {
127-
color: var(--site-print-button-color, black);
127+
color: light-dark(var(--site-print-button-color, black), var(--ddd-accent-6));
128128
--site-git-corner-background: var(
129129
--haxcms-user-styles-color-theme-color-1
130130
);
@@ -150,10 +150,7 @@ class CleanOne extends PrintBranchMixin(
150150
--haxcms-user-styles-color-theme-color-1
151151
);
152152
--site-menu-button-link-decoration: none;
153-
--site-menu-button-button-hover-color: var(
154-
--ddd-theme-default-info,
155-
#383f45
156-
);
153+
--site-menu-button-button-hover-color: light-dark(var(--ddd-primary-4), var(--ddd-accent-6));
157154
--haxcms-tooltip-color: var(--ddd-theme-default-infoLight);
158155
--haxcms-tooltip-background-color: var(--ddd-theme-default-info);
159156
--site-menu-button-button-hover-background-color: var(
@@ -162,10 +159,9 @@ class CleanOne extends PrintBranchMixin(
162159
}
163160
scroll-button,
164161
site-breadcrumb {
165-
color: var(--haxcms-user-styles-color-theme-color-1);
166-
--site-breadcrumb-color: var(
167-
--haxcms-user-styles-color-theme-color-1
168-
);
162+
color: light-dark(black, var(--ddd-accent-6));
163+
--site-breadcrumb-color: light-dark(var(--ddd-theme-default-link), var(--ddd-theme-default-linkLight));
164+
--site-breadcrumb-last-color: light-dark(black , var(--ddd-accent-6));
169165
}
170166
171167
* {
@@ -191,8 +187,8 @@ class CleanOne extends PrintBranchMixin(
191187
z-index: 1;
192188
overflow-y: hidden;
193189
width: 300px;
194-
color: black;
195-
background: var(--ddd-theme-default-shrineMaxLight);
190+
background-color: light-dark(var(--ddd-accent-6), var(--ddd-primary-4));
191+
color: light-dark(black, var(--ddd-accent-6));
196192
border-right: var(--ddd-border-xs);
197193
transition: left 0.3s ease;
198194
}
@@ -534,142 +530,8 @@ class CleanOne extends PrintBranchMixin(
534530
color: var(--haxcms-user-styles-color-theme-color-color);
535531
background: var(--haxcms-user-styles-color-theme-color-background);
536532
}
537-
:host([color-theme="1"]) .site-header {
538-
color: #afa790;
539-
background: transparent;
540-
}
541-
:host([color-theme="1"]) .site-header .btn {
542-
color: black;
543-
}
544-
:host([color-theme="1"]) .site-header .btn:hover,
545-
:host([color-theme="1"]) .site-header .btn:focus,
546-
:host([color-theme="1"]) .site-header .btn:active {
547-
color: #704214;
548-
background: none;
549-
}
550-
:host([color-theme="0"]) site-menu {
551-
--map-menu-item-a-active-background-color: #4152a945;
552-
}
553-
:host([color-theme="1"]) site-menu {
554-
--map-menu-item-a-active-color: white;
555-
--map-menu-item-a-active-background-color: #70421445;
556-
--site-menu-item-active-item-color: #70421410;
557-
--map-menu-expanded-color-depth-1: rgba(200, 150, 100, 0.1);
558-
--map-menu-expanded-color-depth-2: rgba(200, 150, 100, 0.15);
559-
--map-menu-expanded-color-depth-3: rgba(200, 150, 100, 0.2);
560-
--map-menu-expanded-color-depth-4: rgba(200, 150, 100, 0.25);
561-
}
562-
:host([color-theme="2"]) site-menu {
563-
--map-menu-item-a-active-color: white;
564-
--map-menu-item-a-active-background-color: rgba(0, 0, 250, 0.1);
565-
--site-menu-item-active-item-color: rgba(0, 0, 250, 0.1);
566-
--map-menu-expanded-color-depth-1: rgba(0, 0, 100, 0.15);
567-
--map-menu-expanded-color-depth-2: rgba(0, 0, 100, 0.2);
568-
--map-menu-expanded-color-depth-3: rgba(0, 0, 100, 0.25);
569-
--map-menu-expanded-color-depth-4: rgba(0, 0, 100, 0.3);
570-
}
571-
:host([color-theme="1"]) site-active-title {
572-
color: #704214;
573-
}
574-
:host([color-theme="2"]) .site-header {
575-
color: #7e888b;
576-
background: transparent;
577-
}
578-
:host([color-theme="2"]) .site-header .btn {
579-
color: white;
580-
}
581-
:host([color-theme="2"]) .site-header .btn:hover,
582-
:host([color-theme="2"]) .site-header .btn:focus,
583-
:host([color-theme="2"]) .site-header .btn:active {
584-
color: #fffff5;
585-
background: none;
586-
}
587-
:host([color-theme="2"]) site-active-title {
588-
color: #cfd4e3;
589-
}
590-
:host([color-theme="1"]) .site-body .navigation {
591-
color: #afa790;
592-
}
593-
:host([color-theme="1"]) .site-body .navigation:hover,
594-
:host([color-theme="1"]) .site-body .navigation:focus,
595-
:host([color-theme="1"]) .site-body .navigation:active {
596-
color: #eee8e0;
597-
}
598-
:host([color-theme="2"]) .site-body .navigation {
599-
color: #383f52;
600-
}
601-
:host([color-theme="2"]) .site-body .navigation:hover,
602-
:host([color-theme="2"]) .site-body .navigation:focus,
603-
:host([color-theme="2"]) .site-body .navigation:active {
604-
color: #fffff5;
605-
}
606-
:host([color-theme="2"]) #site-search-input {
607-
color: #fffff5;
608-
background-color: #383f52;
609-
}
610533
611-
/*
612-
* Theme 1
613-
*/
614-
:host([color-theme="1"]) .menu-outline {
615-
color: #afa790;
616-
background: #111111;
617-
border-right: 1px solid rgba(0, 0, 0, 0.07);
618-
}
619-
:host([color-theme="1"]) .menu-outline ul.summary li.divider {
620-
background: #7e888b;
621-
box-shadow: none;
622-
}
623-
:host([color-theme="1"]) .menu-outline ul.summary li.done > a {
624-
color: #877f6a;
625-
}
626-
:host([color-theme="1"]) .menu-outline ul.summary li a,
627-
:host([color-theme="1"]) .menu-outline ul.summary li span {
628-
color: #877f6a;
629-
background: transparent;
630-
font-weight: normal;
631-
}
632-
:host([color-theme="1"]) .menu-outline ul.summary li.active > a,
633-
:host([color-theme="1"]) .menu-outline ul.summary li a:hover,
634-
:host([color-theme="1"]) .menu-outline ul.summary li a:focus,
635-
:host([color-theme="1"]) .menu-outline ul.summary li a:active {
636-
color: #704214;
637-
background: transparent;
638-
font-weight: normal;
639-
}
640-
:host([color-theme="1"]) #site-search-input {
641-
color: #afa790;
642-
background-color: #111111;
643-
}
644-
/*
645-
* Theme 2
646-
*/
647-
:host([color-theme="2"]) .menu-outline {
648-
color: #bcc1d2;
649-
background: #2d3143;
650-
border-right: none;
651-
}
652-
:host([color-theme="2"]) .menu-outline ul.summary li.divider {
653-
background: #272a3a;
654-
box-shadow: none;
655-
}
656-
:host([color-theme="2"]) .menu-outline ul.summary li.done > a {
657-
color: #62687f;
658-
}
659-
:host([color-theme="2"]) .menu-outline ul.summary li a,
660-
:host([color-theme="2"]) .menu-outline ul.summary li span {
661-
color: #c1c6d7;
662-
background: transparent;
663-
font-weight: 600;
664-
}
665-
:host([color-theme="2"]) .menu-outline ul.summary li.active > a,
666-
:host([color-theme="2"]) .menu-outline ul.summary li a:hover,
667-
:host([color-theme="2"]) .menu-outline ul.summary li a:focus,
668-
:host([color-theme="2"]) .menu-outline ul.summary li a:active {
669-
color: #f4f4f5;
670-
background: #252737;
671-
font-weight: 600;
672-
}
534+
673535
button,
674536
select {
675537
text-transform: none;
@@ -695,7 +557,6 @@ class CleanOne extends PrintBranchMixin(
695557
padding: 6px;
696558
background: 0 0;
697559
transition: top 0.5s ease;
698-
background: #fff;
699560
border-bottom: 1px solid rgba(0, 0, 0, 0.07);
700561
border-top: 1px solid rgba(0, 0, 0, 0.07);
701562
margin-bottom: 10px;
@@ -705,48 +566,8 @@ class CleanOne extends PrintBranchMixin(
705566
height: auto;
706567
width: auto;
707568
font-size: inherit;
708-
}
709-
:host([color-theme="0"]) #site-search-input {
710-
color: #252737;
711-
}
712-
:host([color-theme="0"]) site-search {
713-
color: #252737;
714-
--site-search-result-background-color: transparent;
715-
--site-search-result-background-color-hover: #f5f5f5;
716-
--site-search-link-color-hover: #252737;
717-
--site-search-link-text-color: #252737;
718-
--site-search-link-color: #252737;
719-
--site-search-result-color: #252737;
720-
}
721-
:host([color-theme="1"]) site-search {
722-
color: #704214;
723-
--site-search-result-background-color: transparent;
724-
--site-search-result-background-color-hover: transparent;
725-
--site-search-link-color-hover: #704214;
726-
--site-search-link-text-color: #704214;
727-
--site-search-link-color: #704214;
728-
--site-search-result-color: #704214;
729-
}
730-
:host([color-theme="2"]) site-search {
731-
color: var(--simple-colors-default-theme-light-blue-1, #cfd4e3);
732-
--site-search-result-background-color: transparent;
733-
--site-search-result-background-color-hover: transparent;
734-
--site-search-link-color-hover: var(
735-
--simple-colors-default-theme-light-blue-1,
736-
#cfd4e3
737-
);
738-
--site-search-link-text-color: var(
739-
--simple-colors-default-theme-light-blue-1,
740-
#cfd4e3
741-
);
742-
--site-search-link-color: var(
743-
--simple-colors-default-theme-light-blue-1,
744-
#cfd4e3
745-
);
746-
--site-search-result-color: var(
747-
--simple-colors-default-theme-light-blue-1,
748-
#cfd4e3
749-
);
569+
background-color: light-dark(var(--ddd-accent-6), var(--ddd-primary-4));
570+
color: light-dark(black, var(--ddd-accent-6));
750571
}
751572
`,
752573
];

0 commit comments

Comments
 (0)