From 7dc22774532872fc99aa7768cf299ab623e9d155 Mon Sep 17 00:00:00 2001
From: tusooa <tusooa@kazv.moe>
Date: Mon, 9 Jan 2023 13:02:16 -0500
Subject: Use stylelint

---
 src/components/font_control/font_control.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

(limited to 'src/components/font_control/font_control.vue')

diff --git a/src/components/font_control/font_control.vue b/src/components/font_control/font_control.vue
index 83c1cef7..bb7e64bc 100644
--- a/src/components/font_control/font_control.vue
+++ b/src/components/font_control/font_control.vue
@@ -50,17 +50,20 @@
 <script src="./font_control.js"></script>
 
 <style lang="scss">
-@import '../../_variables.scss';
+@import "../../variables";
+
 .font-control {
   input.custom-font {
     min-width: 10em;
   }
+
   &.custom {
     /* TODO Should make proper joiners... */
     .font-switcher {
       border-top-right-radius: 0;
       border-bottom-right-radius: 0;
     }
+
     .custom-font {
       border-top-left-radius: 0;
       border-bottom-left-radius: 0;
-- 
cgit v1.2.3-70-g09d2


From da46c30893a4ae5e3aaf2de2213e73281e87aaf2 Mon Sep 17 00:00:00 2001
From: tusooa <tusooa@kazv.moe>
Date: Fri, 3 Mar 2023 23:38:56 -0500
Subject: Fix display of theme checkboxes

---
 src/components/font_control/font_control.vue     | 5 ++++-
 src/components/range_input/range_input.vue       | 8 ++++++--
 src/components/shadow_control/shadow_control.vue | 3 ++-
 3 files changed, 12 insertions(+), 4 deletions(-)

(limited to 'src/components/font_control/font_control.vue')

diff --git a/src/components/font_control/font_control.vue b/src/components/font_control/font_control.vue
index bb7e64bc..e2ba74d1 100644
--- a/src/components/font_control/font_control.vue
+++ b/src/components/font_control/font_control.vue
@@ -4,6 +4,7 @@
     :class="{ custom: isCustom }"
   >
     <label
+      :id="name + '-label'"
       :for="preset === 'custom' ? name : name + '-font-switcher'"
       class="label"
     >
@@ -12,7 +13,8 @@
     <input
       v-if="typeof fallback !== 'undefined'"
       :id="name + '-o'"
-      class="opt exlcude-disabled"
+      :aria-labelledby="name + '-label'"
+      class="opt exlcude-disabled visible-for-screenreader-only"
       type="checkbox"
       :checked="present"
       @change="$emit('update:modelValue', typeof modelValue === 'undefined' ? fallback : undefined)"
@@ -21,6 +23,7 @@
       v-if="typeof fallback !== 'undefined'"
       class="opt-l"
       :for="name + '-o'"
+      :aria-hidden="true"
     />
     {{ ' ' }}
     <Select
diff --git a/src/components/range_input/range_input.vue b/src/components/range_input/range_input.vue
index 1e7e42d5..1e720105 100644
--- a/src/components/range_input/range_input.vue
+++ b/src/components/range_input/range_input.vue
@@ -4,6 +4,7 @@
     :class="{ disabled: !present || disabled }"
   >
     <label
+      :id="name + '-label'"
       :for="name"
       class="label"
     >
@@ -12,7 +13,8 @@
     <input
       v-if="typeof fallback !== 'undefined'"
       :id="name + '-o'"
-      class="opt"
+      :aria-labelledby="name + '-label'"
+      class="opt visible-for-screenreader-only"
       type="checkbox"
       :checked="present"
       @change="$emit('update:modelValue', !present ? fallback : undefined)"
@@ -21,6 +23,7 @@
       v-if="typeof fallback !== 'undefined'"
       class="opt-l"
       :for="name + '-o'"
+      :aria-hidden="true"
     />
     <input
       :id="name"
@@ -34,9 +37,10 @@
       @input="$emit('update:modelValue', $event.target.value)"
     >
     <input
-      :id="name"
+      :id="name + '-numeric'"
       class="input-number"
       type="number"
+      :aria-labelledby="name + '-label'"
       :value="modelValue || fallback"
       :disabled="!present || disabled"
       :max="hardMax"
diff --git a/src/components/shadow_control/shadow_control.vue b/src/components/shadow_control/shadow_control.vue
index 7546535d..1f3c26aa 100644
--- a/src/components/shadow_control/shadow_control.vue
+++ b/src/components/shadow_control/shadow_control.vue
@@ -129,12 +129,13 @@
           v-model="selected.inset"
           :disabled="!present"
           name="inset"
-          class="input-inset"
+          class="input-inset visible-for-screenreader-only"
           type="checkbox"
         >
         <label
           class="checkbox-label"
           for="inset"
+          :aria-hidden="true"
         />
       </div>
       <div
-- 
cgit v1.2.3-70-g09d2

