responsive

components/FooterBar.vue

@@ -14,7 +14,7 @@
           />
         </v-col>
         <div class="flex-column">
-          <h3>Subscribe to our Newsletter</h3>
+          <h3 class="h3-title">Subscribe to our Newsletter</h3>
           <h4>Get all the latest information, Sales and Offers.</h4>
         </div>
         <div class="email">
@@ -237,7 +237,11 @@ export default {
     padding-left: 130px
   }
   .email {
-    width: 90%;
+    width: 94%;
+  }
+  .h3-title {
+    display: flex;
+    justify-content: center;
   }
 }
 </style>

components/user/Header.vue

@@ -142,7 +142,7 @@
                 mdi-cart-outline
               </v-icon>
             </v-badge>
-            <v-menu activator="#menu-activator" style="width: 300px">
+            <v-menu activator="#menu-activator" style="width: 300px; z-index: 50;">
               <v-list class="list-item no-scroll" dense three-line>
                 <v-list-item
                   v-for="(item, index) in products"
@@ -624,6 +624,8 @@ b {
   .header-middle-content {
     display: flex;
     flex-direction: column;
+    padding-left: 10px;
+    padding-right: 12px !important;
   }
   .header-middle-right {
     margin-top: 10px;
@@ -675,5 +677,8 @@ b {
   .header-top-right {
     justify-content: flex-end;
   }
+  .list-item {
+    height: 340px;
+  }
 }
 </style>

components/user/NavBar.vue

@@ -153,12 +153,12 @@ export default {
     cursor: pointer;
   }
   @media only screen and (max-width: 769px) {
-    .none-tag {
+  .none-tag {
       display: none !important;
   }
   .navbar-left {
     width:100%;
-    padding-left: 5px;
+    padding-left: 12px;
     padding-right: 5px;
   }
 }

pages/home-page/index.vue

@@ -216,6 +216,7 @@
           :key="i"
           cols="12"
           md="4"
+          class="feature-col"
         >
           <v-card
             :loading="loading"
@@ -464,5 +465,9 @@ export default {
   flex: 1 1 49%;
   max-width: 49%;
 }
+.feature-col {
+  padding-bottom: 0px;
+  margin-bottom: -50px;
+}
 }
 </style>