From b461149ac02170f935e6b53d302c34c43fd14827 Mon Sep 17 00:00:00 2001
From: Eliot Berriot <contact@eliotberriot.com>
Date: Wed, 28 Feb 2018 19:21:44 +0100
Subject: [PATCH] Moved step navigation buttons on top of import widget, see
 #78

---
 front/src/components/library/import/Main.vue | 23 ++++++++++----------
 1 file changed, 12 insertions(+), 11 deletions(-)

diff --git a/front/src/components/library/import/Main.vue b/front/src/components/library/import/Main.vue
index 0a1cc6df9..66e16b71f 100644
--- a/front/src/components/library/import/Main.vue
+++ b/front/src/components/library/import/Main.vue
@@ -23,6 +23,18 @@
           </div>
         </a>
       </div>
+      <div class="ui hidden divider"></div>
+      <div class="ui centered buttons">
+        <button @click="currentStep -= 1" :disabled="currentStep === 0" class="ui icon button"><i class="left arrow icon"></i> Previous step</button>
+        <button @click="currentStep += 1" v-if="currentStep < 2" class="ui icon button">Next step <i class="right arrow icon"></i></button>
+        <button
+          @click="$refs.import.launchImport()"
+          v-if="currentStep === 2"
+          :class="['ui', 'positive', 'icon', {'loading': isImporting}, 'button']"
+          :disabled="isImporting || importData.count === 0"
+          >Import {{ importData.count }} tracks <i class="check icon"></i></button>
+      </div>
+      <div class="ui hidden divider"></div>
       <div class="ui attached segment">
         <template v-if="currentStep === 0">
           <p>First, choose where you want to import the music from :</p>
@@ -101,17 +113,6 @@
             @import-state-changed="updateImportState"
             ></component>
         </div>
-        <div class="ui hidden divider"></div>
-        <div class="ui buttons">
-          <button @click="currentStep -= 1" :disabled="currentStep === 0" class="ui icon button"><i class="left arrow icon"></i> Previous step</button>
-          <button @click="currentStep += 1" v-if="currentStep < 2" class="ui icon button">Next step <i class="right arrow icon"></i></button>
-          <button
-            @click="$refs.import.launchImport()"
-            v-if="currentStep === 2"
-            :class="['ui', 'positive', 'icon', {'loading': isImporting}, 'button']"
-            :disabled="isImporting || importData.count === 0"
-            >Import {{ importData.count }} tracks <i class="check icon"></i></button>
-        </div>
       </div>
     </div>
     <div class="ui vertical stripe segment" v-if="currentRequest">