From 0b7098662bda59a16cd0db026b3fe9f71b30ee0c Mon Sep 17 00:00:00 2001
From: Bastian Masanek <bastian.masanek@experimenta.science>
Date: Mon, 3 Nov 2025 16:31:05 +0100
Subject: [PATCH] Enhance CartItem component with non-selectable elements

- Updated quantity control buttons and display in CartItem.vue to include the 'select-none' class, preventing text selection during user interaction.
---
 app/components/Cart/CartItem.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/app/components/Cart/CartItem.vue b/app/components/Cart/CartItem.vue
index 36313e6..02c7fbf 100644
--- a/app/components/Cart/CartItem.vue
+++ b/app/components/Cart/CartItem.vue
@@ -132,20 +132,20 @@ const placeholderImage = '/img/makerspace-jk-2025.jpg'
       <!-- Bottom Row: Quantity Controls (left) + Subtotal (right) -->
       <div class="flex items-center justify-between mt-4">
         <!-- Quantity Controls -->
-        <div class="flex items-center gap-2">
+        <div class="flex items-center gap-2 select-none">
           <!-- Decrease Button -->
-          <Button variant="outline" size="icon" class="h-8 w-8 text-white border-white/20 hover:bg-white/10"
+          <Button variant="outline" size="icon" class="h-8 w-8 text-white border-white/20 hover:bg-white/10 select-none"
             :disabled="loading || localQuantity <= 1" @click="decreaseQuantity">
             <Minus class="h-4 w-4" />
           </Button>
 
           <!-- Quantity Display -->
-          <div class="flex h-8 w-16 items-center justify-center rounded-md border border-white/20 bg-white/5 text-sm font-medium text-white">
+          <div class="flex h-8 w-16 items-center justify-center rounded-md border border-white/20 bg-white/5 text-sm font-medium text-white select-none">
             {{ localQuantity }}
           </div>
 
           <!-- Increase Button -->
-          <Button variant="outline" size="icon" class="h-8 w-8 text-white border-white/20 hover:bg-white/10"
+          <Button variant="outline" size="icon" class="h-8 w-8 text-white border-white/20 hover:bg-white/10 select-none"
             :disabled="loading || localQuantity >= item.product.stockQuantity" @click="increaseQuantity">
             <Plus class="h-4 w-4" />
           </Button>