From e04cb4cdeaa5d1a60c9881123f62db403ba65694 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Thu, 11 Jul 2024 15:17:46 +0300
Subject: [PATCH] Update LoginDoc.vue

---
 apps/showcase/doc/divider/LoginDoc.vue | 48 +++++++++++++++-----------
 1 file changed, 27 insertions(+), 21 deletions(-)

diff --git a/apps/showcase/doc/divider/LoginDoc.vue b/apps/showcase/doc/divider/LoginDoc.vue
index 05860483e..9cf4d6764 100644
--- a/apps/showcase/doc/divider/LoginDoc.vue
+++ b/apps/showcase/doc/divider/LoginDoc.vue
@@ -37,15 +37,17 @@ export default {
                 basic: `
 <div class="flex flex-col md:flex-row">
     <div class="w-full md:w-5/12 flex flex-col items-center justify-center gap-3 py-5">
-        <div class="flex flex-wrap justify-center items-center gap-2">
-            <label class="w-[6rem]">Username</label>
-            <InputText id="username" type="text" class="w-[12rem]" />
+        <div class="flex flex-col gap-2">
+            <label for="username">Username</label>
+            <InputText id="username" type="text" />
         </div>
-        <div class="flex flex-wrap justify-center items-center gap-2">
-            <label class="w-[6rem]">Password</label>
-            <InputText id="password" type="password" class="w-[12rem]" />
+        <div class="flex flex-col gap-2">
+            <label for="password">Password</label>
+            <InputText id="password" type="password" />
+        </div>
+        <div class="flex">
+            <Button label="Login" icon="pi pi-user" class="w-full max-w-[17.35rem] mx-auto"></Button>
         </div>
-        <Button label="Login" icon="pi pi-user" class="w-full max-w-[17.35rem] mx-auto"></Button>
     </div>
     <div class="w-full md:w-2/12">
         <Divider layout="vertical" class="hidden md:flex"><b>OR</b></Divider>
@@ -61,15 +63,17 @@ export default {
     <div class="card">
         <div class="flex flex-col md:flex-row">
             <div class="w-full md:w-5/12 flex flex-col items-center justify-center gap-3 py-5">
-                <div class="flex flex-wrap justify-center items-center gap-2">
-                    <label class="w-[6rem]">Username</label>
-                    <InputText id="username" type="text" class="w-[12rem]" />
+                <div class="flex flex-col gap-2">
+                    <label for="username">Username</label>
+                    <InputText id="username" type="text" />
                 </div>
-                <div class="flex flex-wrap justify-center items-center gap-2">
-                    <label class="w-[6rem]">Password</label>
-                    <InputText id="password" type="password" class="w-[12rem]" />
+                <div class="flex flex-col gap-2">
+                    <label for="password">Password</label>
+                    <InputText id="password" type="password" />
+                </div>
+                <div class="flex">
+                    <Button label="Login" icon="pi pi-user" class="w-full max-w-[17.35rem] mx-auto"></Button>
                 </div>
-                <Button label="Login" icon="pi pi-user" class="w-full max-w-[17.35rem] mx-auto"></Button>
             </div>
             <div class="w-full md:w-2/12">
                 <Divider layout="vertical" class="hidden md:flex"><b>OR</b></Divider>
@@ -90,15 +94,17 @@ export default {
     <div class="card">
         <div class="flex flex-col md:flex-row">
             <div class="w-full md:w-5/12 flex flex-col items-center justify-center gap-3 py-5">
-                <div class="flex flex-wrap justify-center items-center gap-2">
-                    <label class="w-[6rem]">Username</label>
-                    <InputText id="username" type="text" class="w-[12rem]" />
+                <div class="flex flex-col gap-2">
+                    <label for="username">Username</label>
+                    <InputText id="username" type="text" />
                 </div>
-                <div class="flex flex-wrap justify-center items-center gap-2">
-                    <label class="w-[6rem]">Password</label>
-                    <InputText id="password" type="password" class="w-[12rem]" />
+                <div class="flex flex-col gap-2">
+                    <label for="password">Password</label>
+                    <InputText id="password" type="password" />
+                </div>
+                <div class="flex">
+                    <Button label="Login" icon="pi pi-user" class="w-full max-w-[17.35rem] mx-auto"></Button>
                 </div>
-                <Button label="Login" icon="pi pi-user" class="w-full max-w-[17.35rem] mx-auto"></Button>
             </div>
             <div class="w-full md:w-2/12">
                 <Divider layout="vertical" class="hidden md:flex"><b>OR</b></Divider>