style changes (navbar, faq, login and resister)

public/css/style.css

 /*======================================
 //--//-->   FORM INPUT
 ======================================*/
+.login-page {
+    width: 360px;
+    padding: 8% 0 0;
+    margin: auto;
+}
+
+.form {
+    position: relative;
+    z-index: 1;
+    background: #FFFFFF;
+    max-width: 360px;
+    margin: 0 auto 100px;
+    padding: 45px;
+    text-align: center;
+    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
+}
+
 
 .form-a #sendmessage {
     color: #60CBEB;

src/components/shared/navBar.vue

             <div class="dropdown-menu" aria-labelledby="navbarDropdown">
               <a class="dropdown-item cursor-pointer" @click="routerGoTo('/timeshare/buy')">To Buy</a>
               <a class="dropdown-item cursor-pointer" @click="routerGoTo('/timeshare/sell')">To Sell</a>
+              <a
+                class="dropdown-item cursor-pointer"
+                @click="routerGoTo('/timeshare/sell')"
+              >My Timeshare Weeks</a>
               <a class="dropdown-item cursor-pointer" @click="routerGoTo('/timeshare/faq')">FAQ</a>
             </div>
           </li>
                 class="dropdown-item cursor-pointer"
                 @click="routerGoTo('/property/Residential/Sale')"
               >To Sell</div>
+              <div
+                class="dropdown-item cursor-pointer"
+                @click="routerGoTo('/property/Residential/Sale')"
+              >My Residential Properties</div>
+              <div
+                class="dropdown-item cursor-pointer"
+                @click="routerGoTo('/property/Residential/Sale')"
+              >Admin Residential Properties</div>
             </div>
           </li>
           <li class="nav-item dropdown">
                 class="dropdown-item cursor-pointer"
                 @click="routerGoTo('/property/Commercial/Sale')"
               >To Sell</a>
+              <a
+                class="dropdown-item cursor-pointer"
+                @click="routerGoTo('/property/Commercial/Sale')"
+              >My Commercial Properties</a>
+              <a
+                class="dropdown-item cursor-pointer"
+                @click="routerGoTo('/property/Commercial/Sale')"
+              >Admin Commercial Properties</a>
             </div>
           </li>
           <li class="nav-item dropdown">
             >Admin</a>
             <div class="dropdown-menu" aria-labelledby="navbarDropdown">
               <a class="dropdown-item cursor-pointer" @click="routerGoTo('/status/list')">Status</a>
+              <a
+                class="dropdown-item cursor-pointer"
+                @click="routerGoTo('/status/list')"
+              >Timeshare Week Admin</a>
+              <a
+                class="dropdown-item cursor-pointer"
+                @click="routerGoTo('/status/list')"
+              >Changes Logs</a>
+              <a
+                class="dropdown-item cursor-pointer"
+                @click="routerGoTo('/status/list')"
+              >User Management & Access</a>
+              <a
+                class="dropdown-item cursor-pointer"
+                @click="routerGoTo('/status/list')"
+              >Tender Week Management</a>
+              <a
+                class="dropdown-item cursor-pointer"
+                @click="routerGoTo('/status/list')"
+              >Timeshare Week Approval</a>
               <a
                 class="dropdown-item cursor-pointer"
                 @click="routerGoTo('/unitConfiguration/list')"
             <div class="dropdown-menu" aria-labelledby="navbarDropdown">
               <a class="dropdown-item cursor-pointer" @click="routerGoTo('/user/login')">Login</a>
               <a class="dropdown-item cursor-pointer">Logout</a>
-            </div>
-          </li>
-          <li class="nav-item dropdown">
-            <a
-              class="nav-link dropdown-toggle"
-              href="#"
-              id="navbarDropdown"
-              role="button"
-              data-toggle="dropdown"
-              aria-haspopup="true"
-              aria-expanded="false"
-            >Register</a>
-            <div class="dropdown-menu" aria-labelledby="navbarDropdown">
-              <a
-                class="dropdown-item cursor-pointer"
-                @click="routerGoTo('/user/register')"
-              >Private Individual</a>
+              <a class="dropdown-item cursor-pointer" @click="routerGoTo('/user/register')">Register</a>
               <a
                 class="dropdown-item cursor-pointer"
                 @click="routerGoTo('/user/registeragency')"

src/components/timeshare/faqPage.vue

   <section class="collapse-items">
     <section class="intro-single">
       <div class="container">
-        <div class="row">
-          <div class="col-md-12 col-lg-8">
-            <div class="title-single-box">
-              <h1 class="title-single" style="text-align:left;">Frequently Asked Questions</h1>
-            </div>
-          </div>
+        <div class="title-single-box">
+          <h3 class="title-single" style="text-align:left;">Frequently Asked Questions</h3>
         </div>
       </div>
     </section>

src/components/user/loginPage.vue

 <template>
   <!-- eslint-disable max-len -->
-  <div class="container">
-    <div class="goDown"></div>
-    <form id="mainForm">
-      <div class="form-group row"></div>
-      <h4>Login</h4>
-      <div class="form-group row"></div>
-      <div class="form-group row">
-        <div class="offset-md-1 col-md-5">
-          <div class="row">
-            <div class="col-md-1">
-              <eva-icon name="lock-outline" fill="#60CBEB"></eva-icon>
-            </div>
-            <div class="col-md-11">
-              <input
-                class="form-control"
-                v-model="username"
-                placeholder="Username"
-                type="text"
-                name="username"
-                value
-              />
-            </div>
-          </div>
+  <div class="login-page">
+    <form id="signIn" method="POST">
+      <div class="form">
+        <div>
+          <h4>Login</h4>
         </div>
-        <div class="col-md-5">
-          <div class="row">
-            <div class="col-md-11">
-              <input
-                class="form-control"
-                :type="isPasswordShown"
-                v-model="password"
-                id="password"
-                placeholder="Password"
-                name="password"
-                value
-              />
-            </div>
+        <div class="row">
+          <div>
+            <eva-icon name="lock-outline" fill="#60CBEB"></eva-icon>
+          </div>
+          <div class="col-md-11">
+            <input
+              class="form-control"
+              v-model="username"
+              placeholder="Username"
+              type="text"
+              name="username"
+              value
+            />
+          </div>
+          <div>
             <eva-icon v-if="!showPassword" name="eye-off" fill="#60CBEB" @click="togglePassword()"></eva-icon>
             <eva-icon v-else name="eye" fill="#60CBEB" @click="passwordToggled()"></eva-icon>
           </div>
+          <div class="col-md-11">
+            <input
+              class="form-control"
+              :type="isPasswordShown"
+              v-model="password"
+              id="password"
+              placeholder="Password"
+              name="password"
+              value
+            />
+          </div>
         </div>
+        <div class="form-group row"></div>
+        <button @click="Login" class="btn btn-b-n">Sign In</button>
+        <p v-if="user !== null">{{ user }}</p>
       </div>
-      <div class="form-group row"></div>
-      <eva-icon name="log-in-outline" fill="#60CBEB"></eva-icon>
-      <button @click="Login" class="btn btn-b-n">Sign In</button>
-      <p v-if="user !== null">{{ user }}</p>
     </form>
-    <br />
-    <br />
-    <br />
-    <form>
-      <h5>Trouble signing in?</h5>
-      <div class="form-group row"></div>
-      <div class="from-group row">
-        <div class="col-md-12">
-          <input class="form-control" placeholder="Your Email" type="text" name="email" value />
+
+    <form id="forgot" method="post">
+      <div class="form">
+        <h5>Trouble signing in?</h5>
+        <div>
+          <div class="row">
+            <eva-icon name="email" fill="#60CBEB"></eva-icon>
+
+            <div class="col-md-11">
+              <input class="form-control" placeholder="Your Email" type="text" name="email" value />
+            </div>
+          </div>
+        </div>
+        <div class="form-group row"></div>
+        <div class="offset-md-3 col-md-5">
+          <button class="btn btn-b-n">Get Help</button>
         </div>
       </div>
-      <div class="form-group row"></div>
-      <eva-icon name="question-mark-circle-outline" fill="#60CBEB"></eva-icon>
-      <button class="btn btn-b-n">Get Help</button>
     </form>
   </div>
 </template>