From 7991f4fe4ba76ef4aeb8c777c6905388a80e46ec Mon Sep 17 00:00:00 2001
From: TZGyn <ca538901d@mozmail.com>
Date: Thu, 3 Aug 2023 09:43:02 +0800
Subject: [PATCH] Frontend: added class to userOption

---
 frontend/components/Sidebar.vue | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/frontend/components/Sidebar.vue b/frontend/components/Sidebar.vue
index 418314d..3e2b731 100644
--- a/frontend/components/Sidebar.vue
+++ b/frontend/components/Sidebar.vue
@@ -8,6 +8,7 @@ const openSetting = ref<Boolean>(false)
 type UserOption = {
 	title: string
 	icon?: string
+	class?: string
 	onClick: () => void
 }
 
@@ -19,19 +20,20 @@ const userOptions: Array<UserOption> = [
 			openUrl('https://github.com/TZGyn')
 		},
 	},
+	{
+		title: 'Profile',
+		icon: 'user',
+		onClick: () => openUserProfile(),
+	},
 	{
 		title: 'Log Out',
 		icon: 'mdi:logout',
+		class: 'hover:text-red-500',
 		onClick: async () => {
 			await userLogout()
 			useRouter().push('/login')
 		},
 	},
-	{
-		title: 'Profile',
-		icon: 'user',
-		onClick: () => openUserProfile(),
-	},
 ]
 
 onClickOutside(sidebar, () => {
@@ -72,6 +74,7 @@ onClickOutside(sidebar, () => {
 				<div
 					v-for="userOption in userOptions"
 					class="flex w-full items-center p-4 text-xl hover:cursor-pointer hover:bg-lightgray"
+					:class="userOption.class"
 					@click="userOption.onClick()">
 					<Icon
 						v-if="userOption.icon"