From 1327650492291f1252e840173c96d50687d26a94 Mon Sep 17 00:00:00 2001
From: Adrian Thompson <adrianhthompson@gmail.com>
Date: Thu, 10 Sep 2020 15:10:53 +0200
Subject: [PATCH] rename grid areas

---
 src/components/RequestWine.vue | 12 ++++++------
 src/ui/RequestedWineCard.vue   | 16 ++++++++--------
 2 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/src/components/RequestWine.vue b/src/components/RequestWine.vue
index 453b008..22fa042 100644
--- a/src/components/RequestWine.vue
+++ b/src/components/RequestWine.vue
@@ -144,7 +144,7 @@ input[type="text"] {
   margin-top: 1rem;
   display: grid;
   grid: 1fr / .5fr 2fr .5fr .5fr;
-  grid-template-areas: "picture details button1 button2";
+  grid-template-areas: "picture details button-left button-right";
   justify-items: center;
   align-items: center;
   grid-gap: 1em;
@@ -156,11 +156,11 @@ input[type="text"] {
 
     grid: 1fr .5fr / .5fr 1fr;
     grid-template-areas: "picture details"
-                         "button1 button2";
+                         "button-left button-right";
     grid-gap: .5em;
 
     .vin-button{
-      grid-area: button2;
+      grid-area: button-right;
       padding: .5em;
       font-size: 1em;
       line-height: 1em;
@@ -168,7 +168,7 @@ input[type="text"] {
     }
 
     .wine-link{
-      grid-area: button1;
+      grid-area: button-left;
     }
 
     h2{
@@ -207,7 +207,7 @@ input[type="text"] {
     }
   }
   .wine-link {
-    grid-area: button1;
+    grid-area: button-left;
     color: #333333;
     font-family: Arial;
     text-decoration: none;
@@ -218,7 +218,7 @@ input[type="text"] {
   }
 
   .vin-button{
-    grid-area: button2;
+    grid-area: button-right;
   }
   
   @include tablet{
diff --git a/src/ui/RequestedWineCard.vue b/src/ui/RequestedWineCard.vue
index cbac483..04d560f 100644
--- a/src/ui/RequestedWineCard.vue
+++ b/src/ui/RequestedWineCard.vue
@@ -76,10 +76,10 @@ export default {
   display: grid;
   grid: auto-flow min-content / 2fr 1fr;
   grid-template-areas: "top top"
-                       "middle-left middle-right1"
-                       "middle-left middle-right2"
-                       "bottom1 bottom1"
-                       "bottom2 bottom2";
+                       "middle-left middle-right-top"
+                       "middle-left middle-right-bot"
+                       "bottom-top bottom-top"
+                       "bottom-bot bottom-bot";
   grid-gap: 1em;
   justify-items: center;
   align-items: center;
@@ -97,13 +97,13 @@ export default {
   }
 
   .requested-amount{
-    grid-area: middle-right1;
+    grid-area: middle-right-top;
     width: 90%;
     word-break: keep-all;
   }
   
   .wine-link{
-    grid-area: middle-right2;
+    grid-area: middle-right-bot;
     color: #333333;
     font-family: Arial;
     text-decoration: none;
@@ -113,11 +113,11 @@ export default {
   }
 
   .vin-button{
-    grid-area: bottom1;
+    grid-area: bottom-top;
     margin-bottom: 1em;
 
     &.danger{
-      grid-area: bottom2;
+      grid-area: bottom-bot;
       background-color: $light-red;
       color: $red;
     }