Invert md switcher icon color when selected; fix hover

StackExchange · Oct 26, 2023 · b70c8fd · b70c8fd
1 parent aaa1ea7
commit b70c8fd
Showing 1 changed file with 49 additions and 0 deletions.
diff --git a/src/styles/icons.css b/src/styles/icons.css
@@ -13,3 +13,52 @@
 .svg-icon-bg.iconEllipsisHorizontal {
     --bg-icon: url("~@stackoverflow/stacks-icons/src/Icon/EllipsisHorizontal.svg");
 }
+
+/* Override for icon color in HC mode */
+.theme-highcontrast
+    .s-btn-group.s-btn-group--radio
+    .s-btn--radio:checked
+    + .s-btn.s-btn__outlined
+    .svg-icon-bg.iconRichText:after,
+.theme-highcontrast
+    .s-btn-group.s-btn-group--radio
+    .s-btn--radio:checked
+    + .s-btn.s-btn__outlined
+    .svg-icon-bg.iconMarkdownPreview:after,
+.theme-highcontrast
+    .s-btn-group.s-btn-group--radio
+    .s-btn--radio:checked
+    + .s-btn.s-btn__outlined
+    .svg-icon-bg.iconMarkdown:after {
+    color: var(--white);
+}
+
+.theme-highcontrast
+    .s-btn-group.s-btn-group--radio
+    .s-btn--radio:checked
+    + .s-btn.s-btn__outlined,
+.theme-highcontrast
+    .s-btn-group.s-btn-group--radio
+    .s-btn--radio:checked
+    + .s-btn.s-btn__outlined,
+.theme-highcontrast
+    .s-btn-group.s-btn-group--radio
+    .s-btn--radio:checked
+    + .s-btn.s-btn__outlined {
+    background-color: var(--black-400) !important;
+}
+
+.theme-highcontrast
+    .s-btn-group.s-btn-group--radio
+    .s-btn--radio:checked
+    + .s-btn.s-btn__outlined:hover,
+.theme-highcontrast
+    .s-btn-group.s-btn-group--radio
+    .s-btn--radio:checked
+    + .s-btn.s-btn__outlined:hover,
+.theme-highcontrast
+    .s-btn-group.s-btn-group--radio
+    .s-btn--radio:checked
+    + .s-btn.s-btn__outlined:hover {
+    background-color: var(--black-500) !important;
+}