From 203ca83202e15c0fdae02b85970f5eaf74e45183 Mon Sep 17 00:00:00 2001
From: KevinMidboe <kevin.midboe@gmail.com>
Date: Tue, 10 Mar 2020 01:00:05 +0100
Subject: [PATCH] Input elements in wine edit view now have label-div styling..

---
 src/components/RegisterPage.vue | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/components/RegisterPage.vue b/src/components/RegisterPage.vue
index 761cbd5..fcae7d8 100644
--- a/src/components/RegisterPage.vue
+++ b/src/components/RegisterPage.vue
@@ -25,7 +25,7 @@
       <button class="vin-button" @click="addWine">Legg til en vin manuelt</button>
     </div>
 
-    <div class="wines-container" v-if="wines.length > 0">
+    <div v-if="wines.length > 0">
       <wine v-for="wine in wines" :wine="wine">
         <div class="button-container row">
           <button class="vin-button" @click="editWine = amIBeingEdited(wine) ? false : wine">
@@ -34,8 +34,8 @@
           <button class="red vin-button" @click="deleteWine(wine)">Slett</button>
         </div>
 
-        <div v-if="amIBeingEdited(wine)">
-          <div class="edit-div" v-for="key in Object.keys(wine)">
+        <div v-if="amIBeingEdited(wine)" class="wine-edit">
+          <div class="label-div" v-for="key in Object.keys(wine)">
             <label>{{ key }}</label>
             <input type="text" v-model="wine[key]" :placeholder="key" />
           </div>
@@ -405,6 +405,15 @@ hr {
   align-items: flex-start;
 }
 
+.wine-edit {
+  margin-top: 1.5rem;
+
+  label {
+    margin-top: 0.75rem;
+    margin-bottom: 0;
+  }
+}
+
 .color-selector {
   margin-bottom: 0.65rem;
   margin-right: 1rem;