From 5a03f88b24c323341846f1b37d3911c1eb9b5fa3 Mon Sep 17 00:00:00 2001
From: Net <93821485+somnetsak123@users.noreply.github.com>
Date: Tue, 2 Apr 2024 11:39:10 +0700
Subject: [PATCH] =?UTF-8?q?fix:=20=E0=B9=81=E0=B8=81=E0=B9=89=E0=B9=84?=
 =?UTF-8?q?=E0=B8=82=20border?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/DrawerComponent.vue | 20 ++++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

diff --git a/src/components/DrawerComponent.vue b/src/components/DrawerComponent.vue
index 194b3e09..02d0d1a0 100644
--- a/src/components/DrawerComponent.vue
+++ b/src/components/DrawerComponent.vue
@@ -36,11 +36,13 @@ const leftDrawerOpen = defineModel<boolean>('leftDrawerOpen', {
         :key="v.label"
         clickable
         @click="currentRoute = v.label"
+        class="no-padding"
         :class="{ active: currentRoute === v.label, dark: $q.dark.isActive }"
       >
-        <q-item-section id="btn-drawer-back " class="test">
-          <q-item-label>
+        <q-item-section id="btn-drawer-back " style="border: 10px">
+          <q-item-label class="q-pl-lg">
             <!-- <q-icon :name="v.icon" size="sm" class="q-mr-xs" /> -->
+            <div class="box-border-left" />
             {{ v.label }}
           </q-item-label>
         </q-item-section>
@@ -52,14 +54,12 @@ const leftDrawerOpen = defineModel<boolean>('leftDrawerOpen', {
 <style lang="scss" scoped>
 #drawer-menu :deep(.q-item) {
   color: var(--gray-6);
-
   border-top-right-radius: 10px;
   border-bottom-right-radius: 10px;
 }
 #drawer-menu :deep(.q-item.active) {
   --_drawer-item-background-color: var(--brand-1) !important;
   background-color: var(--_drawer-item-background-color) !important;
-
   color: white;
   border-left: 10px solid $secondary;
 
@@ -67,10 +67,14 @@ const leftDrawerOpen = defineModel<boolean>('leftDrawerOpen', {
     --_drawer-item-background-color: var(--gray-10) !important;
     border: 1px solid var(--brand-1);
     border-left: 10px solid $secondary;
+    .box-border-left {
+      position: absolute;
+      width: 10px;
+      background: $secondary;
+      height: 48.5px;
+      top: -1px;
+      left: -10px;
+    }
   }
 }
-
-.test {
-  border: 1px solid blue;
-}
 </style>