feat: vanilla CSS color scheme changes (#3996)

* feat: vanilla CSS color scheme changes
* chore: scheme mixin
* chore: remove darkmode & colored header less variables
* feat: high contrast schemes

extensions/flags/less/forum.less

@@ -1,3 +1,11 @@
+[data-theme^=light] {
+  .light-contents-vars(@color: @body-bg-light; @control-color: @body-bg-light; @name: 'flagged-post');
+}
+
+[data-theme^=dark] {
+  .light-contents-vars(@color: @body-bg-dark; @control-color: @body-bg-dark; @name: 'flagged-post');
+}
+
 .Post--flagged {
   --border-width: 2px;
   padding-top: 0 !important;
@@ -16,7 +24,7 @@
   padding: 10px;
   border-radius: var(--border-radius) var(--border-radius) 0 0;
   overflow: hidden;
-  .light-contents(@color: @body-bg; @control-color: @body-bg);
+  .light-contents(@name: 'flagged-post');
 
   display: flex;
   align-items: center;

extensions/package-manager/less/admin.less

@@ -22,12 +22,6 @@
   background-color: transparent;
 }
 
-// @TODO add to core
-.Checkbox--switch.disabled {
-  opacity: 0.6;
-  cursor: not-allowed;
-}
-
 .ButtonGroup--full {
   width: 100%;
   display: flex;

extensions/subscriptions/less/forum.less

@@ -1,9 +1,26 @@
+@following-bg: #ffea7b;
+@following-color: #de8e00;
+
 :root {
-  --following-bg: #ffea7b;
-  --following-color: #de8e00;
+  --following-bg: @following-bg;
+  --following-color: @following-color;
   --ignoring-bg: #aaa;
 }
 
+[data-theme^=light] {
+  .Button--color-vars(@following-color, #fff2ae, 'button--follow');
+}
+
+[data-theme=light-hc], [data-theme=dark-hc] {
+  @following-color-hc: darken(@following-color, 23%);
+  --following-color: @following-color-hc;
+  .Button--color-vars(@following-color-hc, #fff2ae, 'button--follow');
+}
+
+[data-theme^=dark] {
+  .Button--color-vars(#784d00, #fbb94c, 'button--follow');
+}
+
 .Badge--following {
   --badge-bg: var(--following-bg);
   --badge-color: var(--following-color);
@@ -12,12 +29,7 @@
   --badge-bg: var(--ignoring-bg);
 }
 .SubscriptionMenu-button--follow {
-  & when (@config-dark-mode = false) {
-    .Button--color(#de8e00, #fff2ae);
-  }
-  & when (@config-dark-mode = true) {
-    .Button--color(#784d00, #fbb94c);
-  }
+  .Button--color-auto('button--follow');
 }
 .SubscriptionMenu .Dropdown-menu {
   min-width: 260px;

extensions/tags/less/forum/ToggleButton.less

@@ -1,5 +1,9 @@
-:root {
-  .Button--color-vars(@control-bg, @control-color, 'button-toggled');
+[data-theme^=light] {
+  .Button--color-vars(@control-bg-light, @control-color-light, 'button-toggled');
+}
+
+[data-theme^=dark] {
+  .Button--color-vars(@control-bg-dark, @control-color-dark, 'button-toggled');
 }
 
 .Button--toggled {