From 6158b8667e6c76c5a5a09b480b82d6f04b8e4885 Mon Sep 17 00:00:00 2001
From: tusooa <tusooa@kazv.moe>
Date: Sat, 28 Jan 2023 22:10:06 -0500
Subject: Make checkbox settings accessible

---
 src/components/checkbox/checkbox.vue | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

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

diff --git a/src/components/checkbox/checkbox.vue b/src/components/checkbox/checkbox.vue
index 7139d4fc..ac7acd52 100644
--- a/src/components/checkbox/checkbox.vue
+++ b/src/components/checkbox/checkbox.vue
@@ -10,7 +10,10 @@
       :indeterminate="indeterminate"
       @change="$emit('update:modelValue', $event.target.checked)"
     >
-    <i class="checkbox-indicator" />
+    <i
+      class="checkbox-indicator"
+      :aria-hidden="true"
+    />
     <span
       v-if="!!$slots.default"
       class="label"
@@ -33,6 +36,7 @@ export default {
 
 <style lang="scss">
 @import "../../variables";
+@import "../../mixins";
 
 .checkbox {
   position: relative;
@@ -81,7 +85,7 @@ export default {
   }
 
   input[type="checkbox"] {
-    display: none;
+    @include visible-for-screenreader-only;
 
     &:checked + .checkbox-indicator::before {
       color: $fallback--text;
-- 
cgit v1.2.3-70-g09d2