From 42be1b478c4bbf5ecf2c8c8393145d42a69ccd84 Mon Sep 17 00:00:00 2001
From: faiqahzaman <zmnfqh@gmail.com>
Date: Wed, 8 Mar 2023 10:39:02 +0800
Subject: [PATCH] update login page

---
 src/components/authentication/TheLogin.vue | 110 ++++-----------------
 1 file changed, 18 insertions(+), 92 deletions(-)

diff --git a/src/components/authentication/TheLogin.vue b/src/components/authentication/TheLogin.vue
index bdbd9ed..ce3f22d 100644
--- a/src/components/authentication/TheLogin.vue
+++ b/src/components/authentication/TheLogin.vue
@@ -1,36 +1,23 @@
 <template>
   <Toast :breakpoints="{ '767px': { width: '100%', right: '0', left: '0' } }" />
-  <div
-    class="flex main-container min-h-screen align-items-center justify-content-center"
-  >
-    <div
-      class="surface-card fadein p-4 shadow-8 border-round w-11 md:w-10 lg:w-8 xl:w-7"
-    >
+  <div class="flex main-container min-h-screen align-items-center justify-content-center">
+    <div class="surface-card fadein p-4 shadow-8 border-round w-11 md:w-10 lg:w-8 xl:w-7">
       <div>
         <div class="row">
-          <div
-            class="col-md-2 d-flex flex-column justify-content-center align-items-left"
-            style="margin-right: -85px"
-          >
+          <div class="col-md-2 d-flex flex-column justify-content-center align-items-left" style="margin-right: -85px">
             <img class="logo-img1" src="img/e-Rahn_Logo_FA-01.png" alt="erahn-logo" />
           </div>
-          <div
-            class="col-md-2 d-flex flex-column justify-content-center align-items-left"
-          >
+          <div class="col-md-2 d-flex flex-column justify-content-center align-items-left">
             <img class="logo-img2" src="img/Logo KoPKB_Final.png" alt="erahn-logo" />
           </div>
         </div>
       </div>
       <div class="text-center mb-5">
-        <img class="logo-img" src="img/e-rahn-lelong.png" alt="erahn-logo" />
+        <img class="logo-img3" src="img/e-rahn-lelong.png" alt="erahn-logo" />
         <div class="text-200 text-3xl font-semibold mb-3 mt-2">Log Masuk</div>
-        <span class="text-200 font-medium line-height-3"
-          >Belum punyai akaun?</span
-        >
-        <router-link
-          v-bind:to="{ name: 'register' }"
-          class="font-medium no-underline ml-2 text-white cursor-pointer"
-          >Daftar sekarang!
+        <span class="text-200 font-medium line-height-3">Belum punyai akaun?</span>
+        <router-link v-bind:to="{ name: 'register' }"
+          class="font-medium no-underline ml-2 text-white cursor-pointer">Daftar sekarang!
         </router-link>
       </div>
       <form @submit.prevent="submit">
@@ -41,35 +28,11 @@
             <div class="col">
               <span class="p-input-icon-right">
                 <i class="pi pi-user" />
-                <InputText
-                  class="mb-2"
-                  v-model="form.username"
-                  type="text"
-                  placeholder="ID Pengguna"
-                  required
-                ></InputText>
-                <InputText
-                  class="mb-2"
-                  v-model="form.username"
-                  type="text"
-                  placeholder="ID Pengguna"
-                  required
-                ></InputText>
-                <InputText
-                  class="mb-2"
-                  v-model="form.username"
-                  type="text"
-                  placeholder="ID Pengguna"
-                  required
-                ></InputText>
+                <InputText class="mb-2" v-model="form.username" type="text" placeholder="ID Pengguna" required>
+                </InputText>
               </span>
             </div>
-            <InlineMessage class="flex-auto" v-if="v$.form.username.$error"
-              >Username diperlukan</InlineMessage
-            >
-            <InlineMessage class="flex-auto" v-if="v$.form.username.$error"
-              >Username diperlukan</InlineMessage
-            >
+            <InlineMessage class="flex-auto" v-if="v$.form.username.$error">Username diperlukan</InlineMessage>
           </div>
           <div class="field grid">
             <!-- <label for="firstname3"
@@ -78,46 +41,14 @@
             <div class="col">
               <span class="p-input-icon-left">
                 <i class="pi pi-user" />
-                <Password
-                  class="mb-2"
-                  v-model="form.password"
-                  placeholder="Katalaluan"
-                  toggleMask
-                  :feedback="false"
-                />
-                <Password
-                  class="mb-2"
-                  v-model="form.password"
-                  placeholder="Katalaluan"
-                  toggleMask
-                  :feedback="false"
-                />
-                <Password
-                  class="mb-2"
-                  v-model="form.password"
-                  placeholder="Katalaluan"
-                  toggleMask
-                  :feedback="false"
-                />
+                <Password class="mb-2" v-model="form.password" placeholder="Katalaluan" toggleMask :feedback="false" />
               </span>
             </div>
-            <InlineMessage class="flex-auto" v-if="v$.form.password.$error"
-              >Kata laluan diperlukan</InlineMessage
-            >
-            <InlineMessage class="flex-auto" v-if="v$.form.password.$error"
-              >Kata laluan diperlukan</InlineMessage
-            >
+            <InlineMessage class="flex-auto" v-if="v$.form.password.$error">Kata laluan diperlukan</InlineMessage>
           </div>
           <div class="">
-            <Button
-              @click="doLogin()"
-              type="submit"
-              class="p-button-sm"
-              label="Log Masuk"
-              icon="pi pi-sign-in"
-              :loading="isLoading"
-              iconPos="right"
-            ></Button>
+            <Button @click="doLogin()" type="submit" class="p-button-sm" label="Log Masuk" icon="pi pi-sign-in"
+              :loading="isLoading" iconPos="right"></Button>
           </div>
           <div class="flex alin justify-content-center mt-4 text-hover">
             <div class="btn btn-warning btn-sm">
@@ -291,14 +222,9 @@ export default {
   height: 60px;
 }
 
-.logo-img1 {
-  width: 50px;
-  height: 50px;
-}
-
-.logo-img2 {
-  width: 50px;
-  height: 60px;
+.logo-img3 {
+  width: 150px;
+  height: 30px;
 }
 
 /* .border-round{