ปรับ ui การประเมิน step 1-3

src/modules/06_evaluate/components/Stepper.vue

@@ -8,12 +8,12 @@ const store = useEvaluateStore();
 <template>
   <q-stepper
     v-model="store.step"
+    dense
     vertical
     animated
     flat
     ref="stepper"
-    :bordered="false"
-    header-nav
+    class="stepEva"
   >
     <q-step
       keep-alive
@@ -22,6 +22,7 @@ const store = useEvaluateStore();
       title="ตรวจสอบคุณสมบัติ"
       :done="store.currentStep >= 1"
       :disable="store.currentStep < 1"
+      class="subStep"
     >
     </q-step>
 
@@ -31,6 +32,7 @@ const store = useEvaluateStore();
       title="จัดเตรียมเอกสารเล่ม 1"
       :done="store.currentStep >= 2"
       :disable="store.currentStep < 2"
+      class="subStep"
     >
     </q-step>
 
@@ -40,6 +42,7 @@ const store = useEvaluateStore();
       title="ตรวจสอบเอกสารเล่ม 1"
       :done="store.currentStep >= 3"
       :disable="store.currentStep < 3"
+      class="subStep"
     >
     </q-step>
 
@@ -49,6 +52,7 @@ const store = useEvaluateStore();
       title="รอตรวจสอบคุณสมบัติ"
       :done="store.currentStep >= 4"
       :disable="store.currentStep < 4"
+      class="subStep"
     >
     </q-step>
 
@@ -58,6 +62,7 @@ const store = useEvaluateStore();
       title="ประกาศบนเว็บไซต์"
       :done="store.currentStep >= 5"
       :disable="store.currentStep < 5"
+      class="subStep"
     >
     </q-step>
 
@@ -67,6 +72,7 @@ const store = useEvaluateStore();
       title="จัดเตรียมเอกสารเล่ม 2"
       :done="store.currentStep >= 6"
       :disable="store.currentStep < 6"
+      class="subStep"
     >
     </q-step>
 
@@ -76,6 +82,7 @@ const store = useEvaluateStore();
       title="รอพิจารณาผลการประเมิน 2"
       :done="store.currentStep >= 7"
       :disable="store.currentStep < 7"
+      class="subStep"
     >
     </q-step>
 
@@ -85,6 +92,7 @@ const store = useEvaluateStore();
       title="ตรวจสอบความถูกต้องของเอกสารเล่ม 2"
       :done="store.currentStep >= 8"
       :disable="store.currentStep < 8"
+      class="subStep"
     >
     </q-step>
 
@@ -94,9 +102,17 @@ const store = useEvaluateStore();
       title="เสร็จสิ้น"
       :done="store.currentStep >= 9"
       :disable="store.currentStep < 9"
+      class="subStep"
     >
     </q-step>
   </q-stepper>
 </template>
 
-<style scoped></style>
+<style>
+.stepEva{
+  padding: 0px !important;
+}
+.subStep .q-stepper__tab{
+  padding: 12px 0px !important;
+}
+</style>