From a044dc377e77aade4696984fb42f7aa5db8c2561 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 12 Sep 2024 15:47:48 +0300
Subject: Massively upgraded shadow control, added sorting by specificity in
 themes3, added/fixed disabled inputs

---
 src/components/checkbox/checkbox.vue | 32 +++++++++++++++++++++-----------
 1 file changed, 21 insertions(+), 11 deletions(-)

(limited to 'src/components/checkbox')

diff --git a/src/components/checkbox/checkbox.vue b/src/components/checkbox/checkbox.vue
index 6261bf3a..494605cf 100644
--- a/src/components/checkbox/checkbox.vue
+++ b/src/components/checkbox/checkbox.vue
@@ -3,6 +3,13 @@
     class="checkbox"
     :class="{ disabled, indeterminate, 'indeterminate-fix': indeterminateTransitionFix }"
   >
+    <span
+      v-if="!!$slots.before"
+      class="label -before"
+      :class="{ faint: disabled }"
+    >
+      <slot name="before"/>
+    </span>
     <input
       type="checkbox"
       class="visible-for-screenreader-only"
@@ -14,11 +21,13 @@
     <i
       class="input -checkbox checkbox-indicator"
       :aria-hidden="true"
+      :class="{ disabled }"
       @transitionend.capture="onTransitionEnd"
     />
     <span
       v-if="!!$slots.default"
-      class="label"
+      class="label -after"
+      :class="{ faint: disabled }"
     >
       <slot />
     </span>
@@ -93,14 +102,9 @@ export default {
     box-sizing: border-box;
   }
 
-  &.disabled {
-    .checkbox-indicator::before,
-    .label {
-      opacity: 0.5;
-    }
-
-    .label {
-      color: var(--text);
+  .disabled {
+    .checkbox-indicator::before {
+      background-color: var(--background);
     }
   }
 
@@ -121,8 +125,14 @@ export default {
     }
   }
 
-  & > span {
-    margin-left: 0.5em;
+  & > .label {
+    &.-after {
+      margin-left: 0.5em;
+    }
+
+    &.-before {
+      margin-right: 0.5em;
+    }
   }
 }
 </style>
-- 
cgit v1.2.3-70-g09d2


From 2b9968eacd6f45dc5ad39796f1b2f488e2a22cbb Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 12 Sep 2024 16:10:39 +0300
Subject: lint

---
 src/components/checkbox/checkbox.vue                       |  2 +-
 src/components/color_input/color_input.vue                 |  2 +-
 src/components/settings_modal/tabs/theme_tab/theme_tab.vue | 11 +++++++----
 src/components/shadow_control/shadow_control.vue           |  5 ++---
 4 files changed, 11 insertions(+), 9 deletions(-)

(limited to 'src/components/checkbox')

diff --git a/src/components/checkbox/checkbox.vue b/src/components/checkbox/checkbox.vue
index 494605cf..8ffcc63b 100644
--- a/src/components/checkbox/checkbox.vue
+++ b/src/components/checkbox/checkbox.vue
@@ -8,7 +8,7 @@
       class="label -before"
       :class="{ faint: disabled }"
     >
-      <slot name="before"/>
+      <slot name="before" />
     </span>
     <input
       type="checkbox"
diff --git a/src/components/color_input/color_input.vue b/src/components/color_input/color_input.vue
index 200b8631..6725fcda 100644
--- a/src/components/color_input/color_input.vue
+++ b/src/components/color_input/color_input.vue
@@ -20,7 +20,7 @@
     <div
       class="input color-input-field"
       :class="{ disabled: !present || disabled }"
-      >
+    >
       <input
         :id="name + '-t'"
         class="textColor unstyled"
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
index 4498c143..d975c61d 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
+++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
@@ -123,10 +123,13 @@
       </div>
     </div>
 
-    <!-- eslint-disable vue/no-v-text-v-html-on-component -->
-    <component :is="'style'" v-html="themeV3Preview"/>
-    <!-- eslint-enable vue/no-v-text-v-html-on-component -->
-    <preview id="theme-preview"/>
+    <!-- eslint-disable vue/no-v-html vue/no-v-text-v-html-on-component -->
+    <component
+      :is="'style'"
+      v-html="themeV3Preview"
+    />
+    <!-- eslint-enable vue/no-v-html vue/no-v-text-v-html-on-component -->
+    <preview id="theme-preview" />
 
     <div>
       <button
diff --git a/src/components/shadow_control/shadow_control.vue b/src/components/shadow_control/shadow_control.vue
index 77d7c15a..b867d6e0 100644
--- a/src/components/shadow_control/shadow_control.vue
+++ b/src/components/shadow_control/shadow_control.vue
@@ -60,21 +60,20 @@
       >
         {{ $t('settings.style.shadows.light_grid') }}
       </Checkbox>
-
     </div>
     <div class="shadow-switcher">
       <Select
-        class="shadow-list"
         id="shadow-list"
         v-model="selectedId"
+        class="shadow-list"
         size="10"
         :disabled="!ready || usingFallback"
       >
         <option
           v-for="(shadow, index) in cValue"
+          :key="index"
           :value="index"
           :class="{ '-active': index === Number(selectedId) }"
-          :key="index"
         >
           {{ shadow.name ?? $t('settings.style.shadows.shadow_id', { value: index }) }}
         </option>
-- 
cgit v1.2.3-70-g09d2