From e72f4ab57e26405d9117da1c02c4efa6d4a6fa23 Mon Sep 17 00:00:00 2001
From: Gauthier Roebroeck <gauthier.roebroeck@gmail.com>
Date: Fri, 19 Jun 2020 22:13:12 +0800
Subject: [PATCH] fix(webui): drag series by handle when editing collection

closes #214
---
 komga-webui/src/components/ItemBrowser.vue | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/komga-webui/src/components/ItemBrowser.vue b/komga-webui/src/components/ItemBrowser.vue
index 78b44d8e..7f98b5c6 100644
--- a/komga-webui/src/components/ItemBrowser.vue
+++ b/komga-webui/src/components/ItemBrowser.vue
@@ -6,6 +6,7 @@
     >
       <draggable v-model="localItems"
                  class="d-flex flex-wrap"
+                 handle=".handle"
                  v-bind="dragOptions"
       >
         <transition-group type="transition" :name="!draggable ? 'flip-list' : null"
@@ -22,6 +23,7 @@
                    :class="draggable ? 'draggable-item' : undefined"
               >
                 <item-card
+                  class="item-card"
                   :item="item"
                   :width="itemWidth"
                   :selected="active"
@@ -33,6 +35,7 @@
 
                 <v-slide-y-reverse-transition>
                   <v-icon v-if="draggable"
+                          class="handle"
                           style="position: absolute; bottom: 0; left: 50%; margin-left: -12px;"
                   >
                     mdi-drag-horizontal
@@ -169,20 +172,16 @@ export default Vue.extend({
 </script>
 
 <style scoped>
-.ghost * {
+.ghost .item-card {
   opacity: 0.5;
   background: #c8ebfb;
 }
 
-.draggable-item * {
-  cursor: move;
+.handle {
+  cursor: grab;
 }
 
 .flip-list-move {
   transition: transform 0.4s;
 }
-
-.fab-delete * {
-  cursor: pointer;
-}
 </style>