Merge branch 'feature/homepage-header' of...

Merge branch 'feature/homepage-header' of https://gitlab.kiaisoft.com/kiaisoft.anh.tran2/kiaisoft_tuananh_nuxt into feature/homepage-header

components/LoginModal.vue

 <template>
-  <v-row justify="center">
+  <v-row
+    justify="center"
+  >
     <v-dialog
       v-model="dialog"
       width="450px"
       @click:outside="closeDialog"
     >
-      <!-- <template #activator="{ on, attrs }">
-            <v-btn
-            color="primary"
-            dark
-            v-bind="attrs"
-            v-on="on"
-            >
-            Open Dialog
-            </v-btn>
-        </template> -->
       <v-card-title class="justify-center">
         <p class="font-weight-black" style="font-size: 35px">
           LOGIN
@@ -95,14 +87,10 @@ export default {
   }),
   computed: {
     dialog () {
-      return this.$props.status
+      return this.status
     }
   },
   methods: {
-    closeDialog () {
-      this.$props.status = false
-      console.log(this.$props.status)
-    },
     async login () {
       try {
         const resp = await this.$axios.post('/login',
@@ -126,13 +114,19 @@ export default {
         })
         this.$router.push('/login')
       }
+    },
+    closeDialog () {
+      this.$props.status = false
     }
   }
 }
 </script>
 
-<style>
+<style scoped>
 .formlogin {
     padding: 30px;
 }
+::v-deep .v-dialog{
+  background-color: #5ae2dc;
+}
 </style>

components/RegisterModal.vue

 <template>
-  <v-row v-if="dialog" justify="center">
+  <v-row justify="center">
     <v-dialog
       v-model="dialog"
       width="450px"
+      @click:outside="closeDialog"
     >
       <v-card-title class="justify-center">
         <p class="font-weight-black" style="font-size: 35px">
@@ -150,13 +151,19 @@ export default {
           duration: 2000
         })
       }
+    },
+    closeDialog () {
+      this.$props.status = false
     }
   }
 }
 </script>
 
-  <style>
+  <style scoped>
     .formlogin {
       padding: 30px;
     }
+    ::v-deep .v-dialog{
+      background-color: #5ae2dc;
+    }
   </style>

components/user/Header.vue

@@ -103,7 +103,7 @@
               plain
               v-bind="attrs"
               v-on="on"
-              @click="closeDialog"
+              @click="openDialogLogin"
             >
               <v-icon>mdi-account-outline</v-icon>
               <span>login</span>
@@ -113,7 +113,7 @@
               plain
               v-bind="attrs"
               v-on="on"
-              @click="activeRegister=true"
+              @click="openDialogSignUp"
             >
               <span>Signup</span>
             </v-btn>
@@ -157,7 +157,7 @@
         </v-col>
         <v-col
           cols="12"
-          md-4
+          md="4"
           class="d-flex"
         >
           <v-btn
@@ -245,55 +245,8 @@
     <!-- end header bottom -->
 
     <!-- show modal -->
-    <LoginModal :status="activeLogin" @click:outside="closeDialog" @close="activeLogin=false" />
+    <LoginModal :status="activeLogin" @close="activeLogin=false" />
     <SignupModal :status="activeRegister" @close="activeRegister=false" />
-    <!-- show drawer -->
-    <v-navigation-drawer
-      v-model="drawer"
-      width="300px"
-      right
-      temporary
-      class="favorite-modal"
-    >
-      <div class="d-flex justify-space-between modal_header">
-        <b>WISHLIST</b>
-        <v-btn plain @click="drawer = false">
-          Close
-          <v-icon>mdi-arrow-right</v-icon>
-        </v-btn>
-      </div>
-      <v-divider />
-      <v-list
-        three-line
-      >
-        <v-list-item
-          v-for="folder in files"
-          :key="folder.title"
-        >
-          <v-list-item-avatar>
-            <v-img :src="folder.prependAvatar" />
-          </v-list-item-avatar>
-
-          <v-list-item-content>
-            <v-list-item-title>
-              {{ folder.title }}
-            </v-list-item-title>
-
-            <v-list-item-subtitle>
-              {{ folder.subtitle }}
-            </v-list-item-subtitle>
-          </v-list-item-content>
-
-          <v-list-item-action>
-            <v-btn icon>
-              <v-icon color="grey lighten-1">
-                mdi-close-circle-outline
-              </v-icon>
-            </v-btn>
-          </v-list-item-action>
-        </v-list-item>
-      </v-list>
-    </v-navigation-drawer>
   </div>
 </template>
 
@@ -345,6 +298,14 @@ export default {
     closeDialog () {
       this.activeLogin = false
       this.activeLogin = true
+    },
+    openDialogLogin () {
+      this.activeLogin = false
+      this.activeLogin = true
+    },
+    openDialogSignUp () {
+      this.activeLogin = false
+      this.activeLogin = true
     }
   }
 }