Browse Source

Enhance CartItem component with non-selectable elements

- Added 'select-none' class to subtotal and remove button in CartItem.vue to prevent text selection during user interaction, improving the overall user experience.
main
Bastian Masanek 2 months ago
parent
commit
29f77afdcf
  1. 4
      app/components/Cart/CartItem.vue

4
app/components/Cart/CartItem.vue

@ -154,7 +154,7 @@ const placeholderImage = '/img/makerspace-jk-2025.jpg'
<!-- Subtotal + Remove Button --> <!-- Subtotal + Remove Button -->
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<!-- Subtotal --> <!-- Subtotal -->
<div class="flex flex-col text-right"> <div class="flex flex-col text-right select-none">
<div class="text-xs text-white/60 uppercase tracking-wide"> <div class="text-xs text-white/60 uppercase tracking-wide">
Summe Summe
</div> </div>
@ -164,7 +164,7 @@ const placeholderImage = '/img/makerspace-jk-2025.jpg'
</div> </div>
<!-- Remove Button (Mobile) --> <!-- Remove Button (Mobile) -->
<Button variant="ghost" size="icon" class="sm:hidden text-white/60 hover:text-red hover:bg-red/10 h-8 w-8" <Button variant="ghost" size="icon" class="sm:hidden text-white/60 hover:text-red hover:bg-red/10 h-8 w-8 select-none"
:disabled="loading" @click="handleRemove"> :disabled="loading" @click="handleRemove">
<Trash2 class="h-4 w-4" /> <Trash2 class="h-4 w-4" />
</Button> </Button>

Loading…
Cancel
Save