From 0570c885ccbbb91cbd8ca858420a9cd45a0e4728 Mon Sep 17 00:00:00 2001
From: HauNg <hau.nguyen145207@gmail.com>
Date: Wed, 9 Dec 2020 07:28:26 +0700
Subject: [PATCH] update menu component

---
 apollo/queries/Menus.gql         |   2 +-
 assets/css/main.css              |   2 +
 assets/scss/pages/checkout.scss  |   2 +-
 components/Menu/MenuNavItem.vue  |   4 +-
 pages/cart.vue                   |  47 +++++-----
 pages/checkout.vue               |  18 ++--
 pages/login.vue                  |   6 +-
 pages/my-account.vue             | 144 +------------------------------
 pages/product-category/index.vue |   6 +-
 pages/shop.vue                   |  26 +-----
 10 files changed, 52 insertions(+), 205 deletions(-)

diff --git a/apollo/queries/Menus.gql b/apollo/queries/Menus.gql
index 79903d1..e2aedf2 100644
--- a/apollo/queries/Menus.gql
+++ b/apollo/queries/Menus.gql
@@ -10,13 +10,13 @@ query GET_MENU($id: ID!) {
         key: id
         databaseId
         title
-        url
         cssClasses
         description
         label
         linkRelationship
         target
         parentId
+        path
       }
     }
   }
diff --git a/assets/css/main.css b/assets/css/main.css
index 06a057f..3c6212d 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -231,6 +231,7 @@ input[type='text']:-ms-clear {
 
 .shadow {
   position: relative;
+  z-index: 1;
 }
 
 .shadow:before {
@@ -248,6 +249,7 @@ input[type='text']:-ms-clear {
   -webkit-transition: background-color cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s !important;
   -o-transition: background-color cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s !important;
   transition: background-color cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s !important;
+  z-index: -1;
 }
 
 .shadow > * {
diff --git a/assets/scss/pages/checkout.scss b/assets/scss/pages/checkout.scss
index 1cd0b9a..9951771 100644
--- a/assets/scss/pages/checkout.scss
+++ b/assets/scss/pages/checkout.scss
@@ -25,7 +25,7 @@
         button {
           margin: 0;
           color: #222326;
-          background-color: transparent;
+          background-color: #fff;
           font-size: 1rem;
           line-height: 1.5;
         }
diff --git a/components/Menu/MenuNavItem.vue b/components/Menu/MenuNavItem.vue
index 6fe2309..69b0792 100644
--- a/components/Menu/MenuNavItem.vue
+++ b/components/Menu/MenuNavItem.vue
@@ -1,12 +1,12 @@
 <template>
   <li>
     <span v-if="menuItem.children && menuItem.children.length"
-      ><a :href="menuItem.url | formatURL" @click.prevent="handleItemClick">{{
+      ><a :href="menuItem.path" @click.prevent="handleItemClick">{{
         menuItem.label
       }}</a></span
     >
     <span v-else
-      ><a :href="menuItem.url | formatURL">{{ menuItem.label }}</a></span
+      ><a :href="menuItem.path">{{ menuItem.label }}</a></span
     >
     <ul v-if="menuItem.children && menuItem.children.length" class="sub-menu">
       <li class="back-link">
diff --git a/pages/cart.vue b/pages/cart.vue
index 5d62cd4..23b121c 100644
--- a/pages/cart.vue
+++ b/pages/cart.vue
@@ -69,7 +69,13 @@
                     class="product-quantity text-align_center"
                     data-title="Quantity"
                   >
-                    <div class="quantity">
+                    <ValidationProvider
+                      v-slot="{ errors }"
+                      name="E-mail"
+                      rules=""
+                      tag="div"
+                      class="quantity"
+                    >
                       <label
                         class="screen-reader-text"
                         for="quantity_5fc9011e68a38"
@@ -77,17 +83,16 @@
                       >
                       <input
                         type="number"
-                        class="input-text qty text"
                         step="1"
                         min="0"
-                        max=""
                         :value="product.qty"
-                        title="Qty"
+                        class="input-text qty text"
                         size="4"
                         pattern="[0-9]*"
                         inputmode="numeric"
                       />
-                    </div>
+                      <span class="error">{{ errors[0] }}</span>
+                    </ValidationProvider>
                   </td>
 
                   <td class="product-subtotal" data-title="Total">
@@ -121,30 +126,26 @@
                           placeholder="Coupon code"
                         />
                         <div class="button light-blue shadow normal">
-                          <span
-                            ><button
-                              type="submit"
-                              class="button flex"
-                              name="apply_coupon"
-                              value="Apply coupon"
-                              :disabled="invalid"
-                            >
-                              Apply coupon
-                            </button></span
+                          <button
+                            type="submit"
+                            class="button flex"
+                            name="apply_coupon"
+                            value="Apply coupon"
+                            :disabled="invalid"
                           >
+                            Apply coupon
+                          </button>
                         </div>
                       </div>
 
                       <div class="button light-blue shadow normal">
-                        <span
-                          ><button
-                            type="submit"
-                            class="button flex"
-                            name="update_cart"
-                          >
-                            Update cart
-                          </button></span
+                        <button
+                          type="submit"
+                          class="button flex"
+                          name="update_cart"
                         >
+                          Update cart
+                        </button>
                       </div>
                     </div>
                   </td>
diff --git a/pages/checkout.vue b/pages/checkout.vue
index 46a4d6d..531cc23 100644
--- a/pages/checkout.vue
+++ b/pages/checkout.vue
@@ -34,17 +34,15 @@
               <span class="error">{{ errors[0] }}</span>
             </ValidationProvider>
             <div class="button light-blue shadow normal">
-              <span
-                ><button
-                  type="submit"
-                  class="button flex"
-                  name="apply_coupon"
-                  value="Apply coupon"
-                  :disabled="invalid"
-                >
-                  Apply coupon
-                </button></span
+              <button
+                type="submit"
+                class="button flex"
+                name="apply_coupon"
+                value="Apply coupon"
+                :disabled="invalid"
               >
+                Apply coupon
+              </button>
             </div>
           </div>
         </ValidationObserver>
diff --git a/pages/login.vue b/pages/login.vue
index dc76abc..77707c6 100644
--- a/pages/login.vue
+++ b/pages/login.vue
@@ -1,6 +1,8 @@
 <template>
-  <div>
-    <h2>login</h2>
+  <div class="max-w-screen-xl flex-grow mx-auto">
+    <div class="md:pt-5 lg:pb-10 text-center checkout-title">
+      <h1 class="mb-0 heading-title">Coming Soon</h1>
+    </div>
   </div>
 </template>
 
diff --git a/pages/my-account.vue b/pages/my-account.vue
index 5d79182..77707c6 100644
--- a/pages/my-account.vue
+++ b/pages/my-account.vue
@@ -1,145 +1,7 @@
 <template>
-  <div class="container">
-    <div class="woocommerce">
-      <div class="row padding-top_md padding-bottom_xl">
-        <div class="padding-bottom_md col-12">
-          <h1 class="margin-bottom_0 d-flex justify-content-center">
-            <a id="login" href="#" class="active">Login</a><span>or</span
-            ><a id="register" href="#">Register</a>
-          </h1>
-        </div>
-
-        <div class="col-lg-10 offset-lg-1 col-xl-8 offset-xl-2">
-          <div class="forms-holder">
-            <form
-              class="woocommerce-form woocommerce-form-login login"
-              method="post"
-            >
-              <p
-                class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide"
-              >
-                <label for="username"
-                  >Username or email address
-                  <span class="required">*</span></label
-                >
-                <input
-                  id="username"
-                  type="text"
-                  class="woocommerce-Input woocommerce-Input--text input-text"
-                  name="username"
-                  value=""
-                />
-              </p>
-              <p
-                class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide"
-              >
-                <label for="password"
-                  >Password <span class="required">*</span></label
-                >
-                <input
-                  id="password"
-                  class="woocommerce-Input woocommerce-Input--text input-text"
-                  type="password"
-                  name="password"
-                />
-              </p>
-
-              <p class="form-row">
-                <input
-                  id="woocommerce-login-nonce"
-                  type="hidden"
-                  name="woocommerce-login-nonce"
-                  value="51bb2a0b64"
-                /><input
-                  type="hidden"
-                  name="_wp_http_referer"
-                  value="/soma/my-account/"
-                />
-                <button
-                  type="submit"
-                  class="woocommerce-Button shadow normal light-blue button"
-                  name="login"
-                  value="Login"
-                >
-                  <span>Login</span>
-                </button>
-              </p>
-              <div class="d-flex align-items-center">
-                <label
-                  class="woocommerce-form__label woocommerce-form__label-for-checkbox d-flex align-items-center"
-                >
-                  <input
-                    id="rememberme"
-                    class="woocommerce-form__input woocommerce-form__input-checkbox"
-                    name="rememberme"
-                    type="checkbox"
-                    value="forever"
-                  />
-                  <span>Remember me</span>
-                </label>
-                <p class="woocommerce-LostPassword lost_password">
-                  <a
-                    href="https://neuronthemes.com/soma/my-account/lost-password/"
-                    >Lost your password?</a
-                  >
-                </p>
-              </div>
-            </form>
-
-            <form method="post" class="register hide">
-              <p
-                class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide"
-              >
-                <label for="reg_email"
-                  >Email address <span class="required">*</span></label
-                >
-                <input
-                  id="reg_email"
-                  type="email"
-                  class="woocommerce-Input woocommerce-Input--text input-text"
-                  name="email"
-                  value=""
-                />
-              </p>
-
-              <p
-                class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide"
-              >
-                <label for="reg_password"
-                  >Password <span class="required">*</span></label
-                >
-                <input
-                  id="reg_password"
-                  type="password"
-                  class="woocommerce-Input woocommerce-Input--text input-text"
-                  name="password"
-                />
-              </p>
-
-              <p class="woocommerce-FormRow form-row">
-                <input
-                  id="woocommerce-register-nonce"
-                  type="hidden"
-                  name="woocommerce-register-nonce"
-                  value="7237236605"
-                /><input
-                  type="hidden"
-                  name="_wp_http_referer"
-                  value="/soma/my-account/"
-                />
-                <button
-                  type="submit"
-                  class="woocommerce-Button button shadow normal light-blue"
-                  name="register"
-                  value="Register"
-                >
-                  <span>Register</span>
-                </button>
-              </p>
-            </form>
-          </div>
-        </div>
-      </div>
+  <div class="max-w-screen-xl flex-grow mx-auto">
+    <div class="md:pt-5 lg:pb-10 text-center checkout-title">
+      <h1 class="mb-0 heading-title">Coming Soon</h1>
     </div>
   </div>
 </template>
diff --git a/pages/product-category/index.vue b/pages/product-category/index.vue
index a9ed192..77707c6 100644
--- a/pages/product-category/index.vue
+++ b/pages/product-category/index.vue
@@ -1,5 +1,9 @@
 <template>
-  <div></div>
+  <div class="max-w-screen-xl flex-grow mx-auto">
+    <div class="md:pt-5 lg:pb-10 text-center checkout-title">
+      <h1 class="mb-0 heading-title">Coming Soon</h1>
+    </div>
+  </div>
 </template>
 
 <script>
diff --git a/pages/shop.vue b/pages/shop.vue
index acfdf6e..fd57b40 100644
--- a/pages/shop.vue
+++ b/pages/shop.vue
@@ -1,29 +1,7 @@
 <template>
   <div class="max-w-screen-xl flex-grow mx-auto">
-    <div class="text-center lg:pt-14 pt-10 lg:pb-16 pb-14">
-      <h1 class="heading-title">The Shop</h1>
-    </div>
-    <div class="shop">
-      <Products />
-      <div class="ac-info-content-wrapper ac-parallax">
-        <div
-          class="ac-info-content ac-parallax-item"
-          data-y=".05"
-          data-speed="1"
-          data-max="-1"
-        >
-          <div>
-            <h3 class="ac-info-title ac-section-title">Insight + creativity</h3>
-          </div>
-          <div>
-            <p class="ac-info-text ac-section-text">
-              We’re adept at understanding what a project needs. Our designs
-              capture the essence of your business, so you can make a more
-              consistent and memorable impact, everywhere.
-            </p>
-          </div>
-        </div>
-      </div>
+    <div class="md:pt-5 lg:pb-10 text-center checkout-title">
+      <h1 class="mb-0 heading-title">Coming Soon</h1>
     </div>
   </div>
 </template>