From f8cb80ed7fa9f9b3c86332f935ccc913dc2b4d28 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mario=20D=C5=BEoi=C4=87?=
 <37804613+mariodz95@users.noreply.github.com>
Date: Mon, 28 Jul 2025 15:09:00 +0200
Subject: [PATCH] fix: make only checkbox reactive (#5739)

Co-authored-by: Kuchenpirat <24235032+Kuchenpirat@users.noreply.github.com>
---
 .../Domain/ShoppingList/ShoppingListItem.vue  | 38 ++++++++++---------
 1 file changed, 20 insertions(+), 18 deletions(-)

diff --git a/frontend/components/Domain/ShoppingList/ShoppingListItem.vue b/frontend/components/Domain/ShoppingList/ShoppingListItem.vue
index 2d2bca96d..bbb71aa32 100644
--- a/frontend/components/Domain/ShoppingList/ShoppingListItem.vue
+++ b/frontend/components/Domain/ShoppingList/ShoppingListItem.vue
@@ -8,24 +8,26 @@
       class="flex-nowrap align-center"
     >
       <v-col :cols="itemLabelCols">
-        <v-checkbox
-          v-model="listItem.checked"
-          class="mt-0"
-          color="null"
-          hide-details
-          density="compact"
-          :label="listItem.note!"
-          @change="$emit('checked', listItem)"
-        >
-          <template #label>
-            <div :class="listItem.checked ? 'strike-through' : ''">
-              <RecipeIngredientListItem
-                :ingredient="listItem"
-                :disable-amount="!(listItem.isFood || listItem.quantity !== 1)"
-              />
-            </div>
-          </template>
-        </v-checkbox>
+        <div class="d-flex align-center flex-nowrap">
+          <v-checkbox
+            v-model="listItem.checked"
+            hide-details
+            density="compact"
+            class="mt-0"
+            color="null"
+            @change="$emit('checked', listItem)"
+          />
+          <div
+            class="ml-2 text-truncate"
+            :class="listItem.checked ? 'strike-through' : ''"
+            style="min-width: 0;"
+          >
+            <RecipeIngredientListItem
+              :ingredient="listItem"
+              :disable-amount="!(listItem.isFood || listItem.quantity !== 1)"
+            />
+          </div>
+        </div>
       </v-col>
       <v-spacer />
       <v-col