fix: Adjust config user page for mobile

Author: matheusandre1

timeless-api/src/main/webui/src/app/pages/user-config/user-config.component.html

@@ -1,28 +1,31 @@
 <form
   [formGroup]="form"
   (ngSubmit)="update()"
-  class="flex flex-col items-center justify-center p-8"
+  class="flex flex-col items-center p-4 md:p-8 w-full"
 >
-  <p-card header="Dados pessoais">
-    <div class="flex flex-col gap-2">
-      <div class="flex flex-row gap-2">
-        <div class="flex flex-col">
+  <p-card header="Dados pessoais" class="w-full max-w-xl">
+    <div class="flex flex-col gap-4">
+      <div class="flex flex-col md:flex-row gap-4">
+        <div class="flex flex-col w-full">
           <label for="firstName">First name</label>
           <input
             pInputText
             pSize="small"
             id="firstName"
             formControlName="firstName"
+            class="w-full"
           />
         </div>
-        <div class="flex flex-col">
-          <label for="firstName">Last name</label>
+
+        <div class="flex flex-col w-full">
+          <label for="lastName">Last name</label>
           <input
             pInputText
             pSize="small"
             [disabled]="true"
             id="lastName"
             formControlName="lastName"
+            class="w-full"
           />
         </div>
       </div>
@@ -35,11 +38,12 @@
           [disabled]="true"
           id="email"
           formControlName="email"
+          class="w-full"
         />
       </div>
 
-      <div class="flex flex-row gap-2">
-        <div class="flex flex-col">
+      <div class="flex flex-col md:flex-row gap-4">
+        <div class="flex flex-col w-full">
           <label for="password">Password</label>
           <input
             pInputText
@@ -48,16 +52,18 @@
             id="password"
             type="password"
             value="******"
+            class="w-full"
           />
         </div>
 
-        <div class="flex flex-col">
-          <label for="firstName">Phone number</label>
+        <div class="flex flex-col w-full">
+          <label for="phoneNumber">Phone number</label>
           <p-inputmask
             mask="+55 (99) 99999-9999"
             size="small"
             placeholder="+55 (99) 99999-9999"
             formControlName="phoneNumber"
+            class="w-full"
           />
         </div>
       </div>
@@ -69,12 +75,12 @@
         icon="pi pi-save"
         size="small"
         iconPos="left"
-        [style]="{ width: '100%' }"
+        class="w-full"
         type="submit"
         label="Salvar"
       />
     </ng-template>
   </p-card>
 </form>
 
-<p-toast position="bottom-right" key="toast"> </p-toast>
+<p-toast position="bottom-right" key="toast"></p-toast>