From acf7986a414903b271a9842b1ef6d0d872d49977 Mon Sep 17 00:00:00 2001
From: waruneeauy <warunee.auy@gmail.com>
Date: Mon, 18 Nov 2024 23:32:26 +0700
Subject: [PATCH] updated menu

---
 src/views/MainView.vue | 82 ++++++++++++++++++++----------------------
 1 file changed, 39 insertions(+), 43 deletions(-)

diff --git a/src/views/MainView.vue b/src/views/MainView.vue
index a5a6468..8f12d7e 100644
--- a/src/views/MainView.vue
+++ b/src/views/MainView.vue
@@ -326,18 +326,17 @@ onMounted(async () => {
           icon="account_circle"
           style="font-size: 16px"
         >
-          <q-menu>
-            <div class="q-pa-md" style="max-width: 500px">
-              <div class="column items-center col-12 q-py-md" color="grey-3">
-                <!-- <q-avatar size="72px" color="grey-4"> -->
-                <q-icon color="primary" name="account_circle" size="32px" />
-                <!-- <img :src="require('@/assets/logo.png')" /> -->
-                <!-- </q-avatar> -->
-                <div class="text-subtitle2 q-mt-md q-mb-xs text-center">
-                  {{ fullName }}
-                </div>
+          <q-menu style="width: 250px">
+            <div class="column items-center col-12 q-py-md" color="grey-3">
+              <!-- <q-avatar size="72px" color="grey-4"> -->
+              <q-icon color="primary" name="account_circle" size="32px" />
+              <!-- <img :src="require('@/assets/logo.png')" /> -->
+              <!-- </q-avatar> -->
+              <div class="text-subtitle2 q-mt-md q-mb-xs text-center">
+                {{ fullName }}
               </div>
-              <!-- <q-list>
+            </div>
+            <!-- <q-list>
                 <q-item>
                   <q-item-section avatar>
                     <q-icon color="primary" name="account_circle" />
@@ -347,39 +346,36 @@ onMounted(async () => {
                 </q-item>
               </q-list> -->
 
-              <q-separator />
-              <q-list dense>
-                <q-item clickable :href="landingPageUrl">
-                  <q-item-section avatar>
-                    <q-avatar
-                      color="blue"
-                      text-color="white"
-                      icon="home"
-                      size="24px"
-                      font-size="14px"
-                    />
-                  </q-item-section>
-                  <q-item-section class="q-py-sm">
-                    Landing Page
-                  </q-item-section>
-                </q-item>
+            <q-separator />
+            <q-list dense class="q-py-sm">
+              <q-item clickable :href="landingPageUrl">
+                <q-item-section avatar>
+                  <q-avatar
+                    color="blue"
+                    text-color="white"
+                    icon="home"
+                    size="24px"
+                    font-size="14px"
+                  />
+                </q-item-section>
+                <q-item-section class="q-py-sm"> Landing Page </q-item-section>
+              </q-item>
 
-                <q-item clickable @click="onClickLogout">
-                  <q-item-section avatar>
-                    <q-avatar
-                      color="red"
-                      text-color="white"
-                      icon="logout"
-                      size="24px"
-                      font-size="14px"
-                    />
-                  </q-item-section>
-                  <q-item-section class="q-py-sm"> ออกจากระบบ </q-item-section>
-                </q-item>
-              </q-list>
-            </div>
-          </q-menu></q-btn
-        >
+              <q-item clickable @click="onClickLogout">
+                <q-item-section avatar>
+                  <q-avatar
+                    color="red"
+                    text-color="white"
+                    icon="logout"
+                    size="24px"
+                    font-size="14px"
+                  />
+                </q-item-section>
+                <q-item-section class="q-py-sm"> ออกจากระบบ </q-item-section>
+              </q-item>
+            </q-list>
+          </q-menu>
+        </q-btn>
       </q-toolbar>
     </q-header>
     <div