From 1085170004fa80b9a5627c9a23e075ee91e01d9d Mon Sep 17 00:00:00 2001
From: Spythere <spythere@protonmail.com>
Date: Mon, 6 Oct 2025 14:32:02 +0200
Subject: [PATCH] fix: accessibility issues with form ids

---
 src/components/Order/OrderMainContent.vue | 2 +-
 src/components/Order/OrderRowCheckbox.vue | 6 +++++-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/Order/OrderMainContent.vue b/src/components/Order/OrderMainContent.vue
index d4a6bed..5d3c70c 100644
--- a/src/components/Order/OrderMainContent.vue
+++ b/src/components/Order/OrderMainContent.vue
@@ -108,7 +108,7 @@
                     <input
                       v-model="listItem.active"
                       type="checkbox"
-                      :id="`order-${instruction.key}-checkbox`"
+                      :id="`order-${instruction.key}-checkbox-${i}`"
                     />
                     &nbsp;
                     <b>{{ t(`order.${instruction.key}.bold`, [i + 1]) }}</b>
diff --git a/src/components/Order/OrderRowCheckbox.vue b/src/components/Order/OrderRowCheckbox.vue
index 49d9ff1..3eea949 100644
--- a/src/components/Order/OrderRowCheckbox.vue
+++ b/src/components/Order/OrderRowCheckbox.vue
@@ -1,6 +1,10 @@
 <template>
   <label class="order-instruction-checkbox">
-    <input type="checkbox" v-model="instructionObject.active" />
+    <input
+      type="checkbox"
+      v-model="instructionObject.active"
+      :id="`instruction-checkbox-${instructionObject.name}`"
+    />
     <div class="checkmark" :class="{ dark: store.orderDarkMode }"></div>
     <div class="text">{{ instructionObject.name }}</div>
   </label>