From 47c4cad9c5d5506138fa587cc9eb04fe5af49349 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 28 Nov 2023 16:06:32 +0300
Subject: [PATCH] Update MaskDoc.vue

---
 doc/inputmask/MaskDoc.vue | 34 +++++++++++++++++-----------------
 1 file changed, 17 insertions(+), 17 deletions(-)

diff --git a/doc/inputmask/MaskDoc.vue b/doc/inputmask/MaskDoc.vue
index be3422989..b03427290 100644
--- a/doc/inputmask/MaskDoc.vue
+++ b/doc/inputmask/MaskDoc.vue
@@ -7,17 +7,17 @@
     </DocSectionText>
     <div class="card p-fluid flex flex-wrap gap-3">
         <div class="flex-auto">
-            <label for="ssn">SSN</label>
+            <label for="ssn" class="font-bold block mb-2">SSN</label>
             <InputMask id="ssn" v-model="value1" mask="999-99-9999" placeholder="999-99-9999" />
         </div>
 
         <div class="flex-auto">
-            <label for="phone">Phone</label>
+            <label for="phone" class="font-bold block mb-2">Phone</label>
             <InputMask id="phone" v-model="value2" mask="(999) 999-9999" placeholder="(999) 999-9999" />
         </div>
 
         <div class="flex-auto">
-            <label for="serial">Serial</label>
+            <label for="serial" class="font-bold block mb-2">Serial</label>
             <InputMask id="serial" v-model="value3" mask="a*-999-a999" placeholder="a*-999-a999" />
         </div>
     </div>
@@ -34,17 +34,17 @@ export default {
             code: {
                 basic: `
 <div class="flex-auto">
-    <label for="ssn">SSN</label>
+    <label for="ssn" class="font-bold block mb-2">SSN</label>
     <InputMask id="ssn" v-model="value1" mask="999-99-9999" placeholder="999-99-9999" />
 </div>
 
 <div class="flex-auto">
-    <label for="phone">Phone</label>
-    <InputMask v-model="value2" date="phone" mask="(999) 999-9999" placeholder="(999) 999-9999" />
+    <label for="phone" class="font-bold block mb-2">Phone</label>
+    <InputMask id="phone" v-model="value2" mask="(999) 999-9999" placeholder="(999) 999-9999" />
 </div>
 
 <div class="flex-auto">
-    <label for="serial">Serial</label>
+    <label for="serial" class="font-bold block mb-2">Serial</label>
     <InputMask id="serial" v-model="value3" mask="a*-999-a999" placeholder="a*-999-a999" />
 </div>
 `,
@@ -52,18 +52,18 @@ export default {
 <template>
     <div class="card p-fluid flex flex-wrap gap-3">
         <div class="flex-auto">
-            <label for="ssn">SSN</label>
+            <label for="ssn" class="font-bold block mb-2">SSN</label>
             <InputMask id="ssn" v-model="value1" mask="999-99-9999" placeholder="999-99-9999" />
         </div>
 
         <div class="flex-auto">
-            <label for="phone">Phone</label>
-            <InputMask v-model="value2" date="phone" mask="(999) 999-9999" placeholder="(999) 999-9999" />
+            <label for="phone" class="font-bold block mb-2">Phone</label>
+            <InputMask id="phone" v-model="value2" mask="(999) 999-9999" placeholder="(999) 999-9999" />
         </div>
 
         <div class="flex-auto">
-            <label for="serial">Serial</label>
-            <InputMask id="serial" v-model="value2" mask="a*-999-a999" placeholder="a*-999-a999" />
+            <label for="serial" class="font-bold block mb-2">Serial</label>
+            <InputMask id="serial" v-model="value3" mask="a*-999-a999" placeholder="a*-999-a999" />
         </div>
     </div>
 </template>
@@ -79,23 +79,23 @@ export default {
     }
 }
 <\/script>
-        
+
 `,
                 composition: `
 <template>
     <div class="card p-fluid flex flex-wrap gap-3">
         <div class="flex-auto">
-            <label for="ssn">SSN</label>
+            <label for="ssn" class="font-bold block mb-2">SSN</label>
             <InputMask id="ssn" v-model="value1" mask="999-99-9999" placeholder="999-99-9999" />
         </div>
 
         <div class="flex-auto">
-            <label for="phone">Phone</label>
-            <InputMask v-model="value2" date="phone" mask="(999) 999-9999" placeholder="(999) 999-9999" />
+            <label for="phone" class="font-bold block mb-2">Phone</label>
+            <InputMask id="phone" v-model="value2" mask="(999) 999-9999" placeholder="(999) 999-9999" />
         </div>
 
         <div class="flex-auto">
-            <label for="serial">Serial</label>
+            <label for="serial" class="font-bold block mb-2">Serial</label>
             <InputMask id="serial" v-model="value3" mask="a*-999-a999" placeholder="a*-999-a999" />
         </div>
     </div>