From 3067a84e2a66789d45834f8e97a8a397e1e6c413 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kevin=20Midb=C3=B8e?= <kevin.midboe@gmail.com>
Date: Fri, 7 Feb 2020 14:27:03 +0100
Subject: [PATCH 1/9] Only show rating if defined.

---
 src/components/TodaysPage.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/TodaysPage.vue b/src/components/TodaysPage.vue
index 8b19038..f57d838 100644
--- a/src/components/TodaysPage.vue
+++ b/src/components/TodaysPage.vue
@@ -10,8 +10,8 @@
             </div>
             <div class="right">
               <h3>{{ wine.name }}</h3>
-              <spam>{{ wine.rating }} rating</spam>
-              <spam class="wine-link">Les mer</spam>
+              <span v-if="wine.rating">{{ wine.rating }} rating</span>
+              <span class="wine-link">Les mer</span>
             </div>
           </div>
         </a>

From e90ff8e5f575a730e62876c2de71f1d3d0caa160 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kevin=20Midb=C3=B8e?= <kevin.midboe@gmail.com>
Date: Fri, 7 Feb 2020 14:28:10 +0100
Subject: [PATCH 2/9] Styling on todays wines more mobile friendly.

---
 src/components/TodaysPage.vue | 36 +++++++++++++++++++++++++++++++++--
 1 file changed, 34 insertions(+), 2 deletions(-)

diff --git a/src/components/TodaysPage.vue b/src/components/TodaysPage.vue
index f57d838..e40f960 100644
--- a/src/components/TodaysPage.vue
+++ b/src/components/TodaysPage.vue
@@ -41,6 +41,8 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+@import './src/styles/media-queries';
+
 .wine-image {
   height: 250px;
 }
@@ -50,22 +52,52 @@ h1 {
   margin-bottom: 25px;
 }
 
+.wines-container {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-evenly;
+  margin: 0 2rem;
+
+  @media (min-width: 1500px) {
+    max-width: 1500px;
+    margin: 0 auto;
+  }
+
+  @include mobile {
+    flex-direction: column;
+  }
+}
+
+h3 {
+  max-width: 30vw;
+
+  @include mobile {
+    max-width: 50vw;
+  }
+}
+
 .inner-wine-container {
   display: flex;
   flex-direction: row;
-  justify-content: center;
   margin: auto;
   width: 500px;
   font-family: Arial;
   margin-bottom: 30px;
+
+  @include desktop {
+    justify-content: center;
+  }
 }
 
 .right {
   display: flex;
   flex-direction: column;
-  justify-content: center;
   margin-bottom: 150px;
   margin-left: 50px;
+
+  @include mobile {
+    margin-left: 2rem;
+  }
 }
 
 a,

From 28f7e59da0ef1484adbd50b1820489ca7d0ba812 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kevin=20Midb=C3=B8e?= <kevin.midboe@gmail.com>
Date: Fri, 7 Feb 2020 14:29:46 +0100
Subject: [PATCH 3/9] Buttons should have pointer cursor.

---
 src/components/RegisterPage.vue | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/components/RegisterPage.vue b/src/components/RegisterPage.vue
index 118004d..63cac46 100644
--- a/src/components/RegisterPage.vue
+++ b/src/components/RegisterPage.vue
@@ -276,6 +276,10 @@ hr {
   align-items: center;
   flex-direction: column;
   justify-content: center;
+
+  button {
+    cursor: pointer;
+  }
 }
 
 .color-container {

From 7e8075e8033aa2beabbde189b09a92e327871979 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kevin=20Midb=C3=B8e?= <kevin.midboe@gmail.com>
Date: Fri, 7 Feb 2020 14:50:54 +0100
Subject: [PATCH 4/9] Update schema with image and id

---
 api/update.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/api/update.js b/api/update.js
index a604a68..c2961e3 100644
--- a/api/update.js
+++ b/api/update.js
@@ -66,7 +66,9 @@ router.route("/log").post(async (req, res) => {
         name: currentWinner.wine.name,
         vivinoLink: currentWinner.wine.vivinoLink,
         rating: currentWinner.wine.rating,
-        occurences: 1
+        occurences: 1,
+        image: currentWinner.wine.image,
+        id: currentWinner.wine.id
       });
       await newWonWine.save();
       wonWine = newWonWine;

From d82c431af5f8a4063b7bd3b5bc143ef70710182a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kevin=20Midb=C3=B8e?= <kevin.midboe@gmail.com>
Date: Fri, 7 Feb 2020 14:51:44 +0100
Subject: [PATCH 5/9] image and id

---
 api/update.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/api/update.js b/api/update.js
index c2961e3..4642cbe 100644
--- a/api/update.js
+++ b/api/update.js
@@ -74,6 +74,8 @@ router.route("/log").post(async (req, res) => {
       wonWine = newWonWine;
     } else {
       wonWine.occurences += 1;
+      wonWine.image = currentWinner.wine.image;
+      wonWine.id = currentWinner.wine.id;
       await wonWine.save();
     }
 

From 0ee2a5d4e1500d1f2936d8545eb826a97299261a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kevin=20Midb=C3=B8e?= <kevin.midboe@gmail.com>
Date: Fri, 7 Feb 2020 14:59:59 +0100
Subject: [PATCH 6/9] Better buttons for color

---
 src/components/RegisterPage.vue | 83 ++++++++++++++++++++++++++++++---
 1 file changed, 76 insertions(+), 7 deletions(-)

diff --git a/src/components/RegisterPage.vue b/src/components/RegisterPage.vue
index 63cac46..2fcbb44 100644
--- a/src/components/RegisterPage.vue
+++ b/src/components/RegisterPage.vue
@@ -33,12 +33,22 @@
               <input type="text" v-model="winner.name" placeholder="Navn" />
             </div>
             <div class="label-div">
-              <select v-model="winner.color">
-                <option value="blue">Blå</option>
-                <option value="red">Rød</option>
-                <option value="green">Grønn</option>
-                <option value="yellow">Gul</option>
-              </select>
+              <div class="color-selector">
+                <button class="blue"
+                        :class="{'active': winner.color == 'blue' }"
+                        @click="updateColorForWinner(winner, 'blue')"></button>
+                <button class="red"
+                        :class="{'active': winner.color == 'red' }"
+                        @click="updateColorForWinner(winner, 'red')"></button>
+                <button class="green"
+                        :class="{'active': winner.color == 'green' }"
+                        @click="updateColorForWinner(winner, 'green')"></button>
+                <button class="yellow"
+                        :class="{'active': winner.color == 'yellow' }"
+                        @click="updateColorForWinner(winner, 'yellow')"></button>
+              </div>
+
+              <span class="color-selected">Selected color: {{ winner.color ? winner.color : '(none)' }}</span>
             </div>
             <div class="label-div">
               <input
@@ -142,6 +152,12 @@ export default {
         image: ""
       });
     },
+    updateColorForWinner(winner, color) {
+      console.log('winner', winner)
+      console.log('color', color)
+
+      winner.color = color
+    },
     sendWines: async function() {
       let _response = await fetch("/api/log/wines", {
         headers: {
@@ -265,6 +281,10 @@ hr {
   justify-content: center;
   align-items: center;
   margin: auto;
+
+  @include mobile {
+    width: 80%;
+  }
 }
 
 .winner-element,
@@ -293,8 +313,8 @@ hr {
 
 .label-div {
   display: flex;
-  flex-direction: column;
   width: 50%;
+  flex-direction: column;
   padding-bottom: 20px;
   margin: auto;
   display: flex;
@@ -306,6 +326,47 @@ hr {
   }
 }
 
+.color-selector {
+  .active {
+    border: 2px solid black;
+  }
+
+  button {
+    border: 2px solid transparent;
+    color: #333;
+    padding: 10px 30px;
+    margin: 0;
+    font-size: 1.3rem;
+    height: calc(3rem + 18px);
+    display: inline-flex;
+    flex-wrap: wrap;
+    flex-direction: row;
+    max-height: calc(3rem + 18px);
+    max-width: calc(3rem + 18px);
+    margin: 10px;
+    // disable-dbl-tap-zoom
+    touch-action: manipulation;
+
+    &.green {
+      background: #c8f9df;
+    }&.blue {
+      background: #d4f2fe;
+    }&.red {
+      background: #fbd7de;
+    }&.yellow {
+      background: #fff6d6;
+    }
+  }
+}
+
+.color-selected {
+  @include mobile {
+    display: block;
+    width: 100%;
+    font-size: 1.5rem !important;
+  }
+}
+
 .label-div label {
   padding: 0 6px;
   display: flex;
@@ -317,6 +378,10 @@ hr {
 }
 
 .input-container {
+  @include mobile {
+    width: 100%;
+  }
+
   & .label-div {
     width: 100%;
   }
@@ -324,6 +389,10 @@ hr {
 
 .winnner-container-inner {
   display: flex;
+
+  @include mobile {
+    flex-direction: column;
+  }
 }
 
 .wine-image {

From 92544df3ce9d2d7aa5d8de28931c030b32aae212 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kevin=20Midb=C3=B8e?= <kevin.midboe@gmail.com>
Date: Fri, 7 Feb 2020 15:31:55 +0100
Subject: [PATCH 7/9] Moved wine image above winner name in dagens viner.

---
 src/components/RegisterPage.vue | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/src/components/RegisterPage.vue b/src/components/RegisterPage.vue
index 2fcbb44..d53a322 100644
--- a/src/components/RegisterPage.vue
+++ b/src/components/RegisterPage.vue
@@ -29,8 +29,11 @@
         <hr />
         <div class="winnner-container-inner">
           <div class="input-container">
+            <div class="wine-image">
+              <img :src="winner.wine.image" />
+            </div>
             <div class="label-div">
-              <input type="text" v-model="winner.name" placeholder="Navn" />
+              <input type="text" v-model="winner.name" placeholder="Navn vinner" />
             </div>
             <div class="label-div">
               <div class="color-selector">
@@ -72,11 +75,7 @@
               />
             </div>
           </div>
-          <div class="wine-image">
-            <img :src="winner.wine.image" />
-          </div>
         </div>
-        <hr />
       </div>
     </div>
     <div class="button-container">
@@ -329,6 +328,7 @@ hr {
 .color-selector {
   .active {
     border: 2px solid black;
+    margin-bottom: 1rem;
   }
 
   button {
@@ -337,7 +337,6 @@ hr {
     padding: 10px 30px;
     margin: 0;
     font-size: 1.3rem;
-    height: calc(3rem + 18px);
     display: inline-flex;
     flex-wrap: wrap;
     flex-direction: row;
@@ -347,6 +346,10 @@ hr {
     // disable-dbl-tap-zoom
     touch-action: manipulation;
 
+    @include mobile {
+      margin: 2px;
+    }
+
     &.green {
       background: #c8f9df;
     }&.blue {
@@ -360,6 +363,8 @@ hr {
 }
 
 .color-selected {
+  margin-bottom: 2rem;
+
   @include mobile {
     display: block;
     width: 100%;

From 74238494228b3fe28042ae2b9199ab3c835b3a8b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kevin=20Midb=C3=B8e?= <kevin.midboe@gmail.com>
Date: Fri, 7 Feb 2020 15:32:04 +0100
Subject: [PATCH 8/9] Upload to uncheck wines.

---
 src/components/RegisterPage.vue | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/src/components/RegisterPage.vue b/src/components/RegisterPage.vue
index d53a322..7218ea1 100644
--- a/src/components/RegisterPage.vue
+++ b/src/components/RegisterPage.vue
@@ -152,10 +152,7 @@ export default {
       });
     },
     updateColorForWinner(winner, color) {
-      console.log('winner', winner)
-      console.log('color', color)
-
-      winner.color = color
+      winner.color = winner.color == color ? null : color
     },
     sendWines: async function() {
       let _response = await fetch("/api/log/wines", {

From 9983735d734997928c25432150a78dac5bc1300e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kevin=20Midb=C3=B8e?= <kevin.midboe@gmail.com>
Date: Fri, 7 Feb 2020 15:51:05 +0100
Subject: [PATCH 9/9] vipps logo align to top not center of container.

---
 src/components/VinlottisPage.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/VinlottisPage.vue b/src/components/VinlottisPage.vue
index c786920..6d6f220 100644
--- a/src/components/VinlottisPage.vue
+++ b/src/components/VinlottisPage.vue
@@ -155,7 +155,7 @@ export default {
 
 .vipps-outer-container {
   display: flex;
-  align-items: center;
+  align-items: flex-start;
 
   @include desktop {
     margin-left: 20px;