From d5281e7d57278197199516fb38f790378af14b6b Mon Sep 17 00:00:00 2001
From: Arthur Lefebvre <artlef@protonmail.com>
Date: Tue, 28 Apr 2026 14:56:21 +0200
Subject: [PATCH] Collection form: small tweaks for mobile view

---
 front/src/CollectionFormElement.vue | 9 +++++----
 front/src/CollectionListElement.vue | 2 +-
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/front/src/CollectionFormElement.vue b/front/src/CollectionFormElement.vue
index 07c883c..f399880 100644
--- a/front/src/CollectionFormElement.vue
+++ b/front/src/CollectionFormElement.vue
@@ -58,7 +58,6 @@ function onPointerMove(e) {
   if (initialGrabPosition.value == null) {
     return
   }
-  e.preventDefault()
   draggedPosition.value = e.pageY - initialGrabPosition.value
   emit('grabbing', draggedPosition.value)
 }
@@ -75,13 +74,13 @@ function onPointerMove(e) {
       "
       ref="collectionitembox"
       class="collectionitembox"
-      @pointermove="onPointerMove"
+      @pointermove.prevent="onPointerMove"
       @pointerup="onPointerUp"
       @pointerleave="clearGrabVariables"
     >
       <BookListElement v-bind="props.book">
         <template v-slot:left>
-          <div class="is-hidden-desktop align-right">
+          <div class="is-hidden-desktop mobile-delete">
             <div @click="$emit('delete')" class="centered closebtn clickable">
               <b-icon-x />
             </div>
@@ -182,14 +181,16 @@ function onPointerMove(e) {
   font-size: 36px;
 }
 
-.align-right {
+.mobile-delete {
   display: flex;
   justify-content: flex-end;
+  height: 10px;
 }
 
 @media (max-width: 1024px) {
   .positionwidget {
     margin-bottom: 10px;
+    margin-left: 0px;
   }
 }
 </style>
diff --git a/front/src/CollectionListElement.vue b/front/src/CollectionListElement.vue
index e875c56..9d53f15 100644
--- a/front/src/CollectionListElement.vue
+++ b/front/src/CollectionListElement.vue
@@ -1,6 +1,6 @@
 <script setup>
 import { getImagePathOrDefault } from './api.js'
-import { useTemplateRef, onMounted } from 'vue'
+import { useTemplateRef } from 'vue'
 import { useRouter } from 'vue-router'
 
 const emit = defineEmits(['delete'])