From e97a327aec127cd616d6c8b8e0280d76e31e15f6 Mon Sep 17 00:00:00 2001
From: Vlad Stan <stan.v.vlad@gmail.com>
Date: Mon, 10 Jul 2023 10:37:38 +0300
Subject: [PATCH] feat: UI changes

---
 .../shopping-cart-checkout.html               | 73 +++++++++----------
 1 file changed, 35 insertions(+), 38 deletions(-)

diff --git a/static/components/shopping-cart-checkout/shopping-cart-checkout.html b/static/components/shopping-cart-checkout/shopping-cart-checkout.html
index c66fe73..b23cbdd 100644
--- a/static/components/shopping-cart-checkout/shopping-cart-checkout.html
+++ b/static/components/shopping-cart-checkout/shopping-cart-checkout.html
@@ -24,6 +24,39 @@
         </q-item>
 
         <q-separator />
+        <q-card-section>
+
+            <div class="row q-mt-md q-ml-md q-pr-md">
+                <div class="col-xs-12 col-sm-12 col-md-2 q-mt-md">
+                    <strong>Address:</strong>
+                </div>
+                <div class="col-xs-12 col-sm-12 col-md-10">
+                    <q-input v-model.trim="contactData.address" outlined
+                        label="Required for physical shipping"></q-input>
+                </div>
+            </div>
+
+            <div class="row q-mt-md q-ml-md q-pr-md">
+                <div class="col-xs-12 col-sm-12 col-md-2 q-mt-md">
+                    <strong>Email:</strong>
+                </div>
+                <div class="col-xs-12 col-sm-12 col-md-10">
+                    <q-input v-model.trim="contactData.address" outlined label="Email (optional)"></q-input>
+                </div>
+            </div>
+
+            <div class="row q-mt-md q-ml-md q-pr-md">
+                <div class="col-xs-12 col-sm-12 col-md-2 q-mt-md">
+                    <strong>Message:</strong>
+                </div>
+                <div class="col-xs-12 col-sm-12 col-md-10">
+                    <q-input v-model.trim="contactData.address" outlined type="textarea" rows="3"
+                        label="Message to Merchant (optional)"></q-input>
+                </div>
+            </div>
+        </q-card-section>
+
+        <q-separator class="q-mt-md" />
 
         <q-card-section horizontal>
             <q-card-section class="col-7">
@@ -47,8 +80,8 @@
                     </div>
                     <div class="col-xs-12 col-sm-12 col-md-4">
                         <q-btn-dropdown unelevated color="secondary" rounded :label="shippingZoneLabel">
-                            <q-item v-for="zone of stall.shipping" @click="selectShippingZone(zone)"
-                                :key="zone.id" clickable v-close-popup>
+                            <q-item v-for="zone of stall.shipping" @click="selectShippingZone(zone)" :key="zone.id"
+                                clickable v-close-popup>
                                 <q-item-section>
                                     <q-item-label><span v-text="zone.name"></span></q-item-label>
                                     <q-item-label caption><span
@@ -85,43 +118,7 @@
         <q-separator />
 
 
-        <q-card-section>
 
-            <div class="row q-mt-md q-ml-md q-pr-md">
-                <div class="col-xs-12 col-sm-12 col-md-2 q-mt-md">
-                    <strong>Address:</strong>
-                </div>
-                <div class="col-xs-12 col-sm-12 col-md-8">
-                    <q-input v-model.trim="contactData.address" outlined label="Required for physical shipping"></q-input>
-                </div>
-                <div class="col-xs-12 col-sm-12 col-md-2">
-                </div>
-            </div>
-
-            <div class="row q-mt-md q-ml-md q-pr-md">
-                <div class="col-xs-12 col-sm-12 col-md-2 q-mt-md">
-                    <strong>Email:</strong>
-                </div>
-                <div class="col-xs-12 col-sm-12 col-md-8">
-                    <q-input v-model.trim="contactData.address" outlined label="Email (optional)"></q-input>
-                </div>
-                <div class="col-xs-12 col-sm-12 col-md-2">
-                </div>
-            </div>
-
-            <div class="row q-mt-md q-ml-md q-pr-md">
-                <div class="col-xs-12 col-sm-12 col-md-2 q-mt-md">
-                    <strong>Message:</strong>
-                </div>
-                <div class="col-xs-12 col-sm-12 col-md-8">
-                    <q-input v-model.trim="contactData.address" outlined type="textarea" rows="3" label="Message to Merchant (optional)"></q-input>
-                </div>
-                <div class="col-xs-12 col-sm-12 col-md-2">
-                </div>
-            </div>
-        </q-card-section>
-
-        <q-separator class="q-mt-md" />
 
         <q-card-actions align="right">