From 60b78f7e98e8d40851effcad1f131b85d7a3d202 Mon Sep 17 00:00:00 2001
From: thackmaster <westhacker@icloud.com>
Date: Fri, 1 May 2026 20:32:45 -0600
Subject: [PATCH] added menu icons, updated header with help menu and dark
 mode, adjusted profile

---
 src/components/Header.vue | 38 +++++++++++++++++---------------------
 1 file changed, 17 insertions(+), 21 deletions(-)

diff --git a/src/components/Header.vue b/src/components/Header.vue
index 13d5946..784dece 100644
--- a/src/components/Header.vue
+++ b/src/components/Header.vue
@@ -3,11 +3,7 @@
         <v-app-bar-nav-icon @click.stop="drawer = !drawer" />
 
         <v-app-bar-title>PEX2 or something I have really no idea</v-app-bar-title>
-
-        <template>
-            <v-btn icon="mdi-help-box" />
-            <v-btn icon="mdi-account-circle" />
-        </template>
+        <v-btn icon="mdi-help-box" />
 
         <v-btn icon @click="toggleTheme">
                 <v-icon>
@@ -17,8 +13,8 @@
             <v-menu>
                 <template #activator="{ props }">
                 <v-btn icon v-bind="props">
-                    <v-avatar size="32">
-                    <img src="https://mohamedahmedali2023.github.io/fake_portofolio/assets/img/home-bg2.jpg" alt="Profile" />
+                    <v-avatar size="32" icon="mdi-account-circle">
+                        <!--<img src=""-->
                     </v-avatar>
                 </v-btn>
                 </template>
@@ -36,7 +32,7 @@
             <v-list-item title="Home" to="/" prepend-icon="mdi-home"/>
             <v-list-group value="pex">
                 <template #activator="{ props }">
-                    <v-list-item v-bind="props" title="My PEX Items" prepend-icon="mdi-account"/>
+                    <v-list-item v-bind="props" title="My PEX Items" prepend-icon="mdi-account" />
                 </template>
                     <v-list-item density="default" v-for="item in pexItems"
                         :key="item.title"
@@ -48,7 +44,7 @@
             </v-list-group>
             <v-list-group value="scheduling">
                 <template #activator="{ props }">
-                    <v-list-item v-bind="props" title="Scheduling" />
+                    <v-list-item v-bind="props" title="Scheduling" prepend-icon="mdi-clock" />
                 </template>
                     <v-list-item density="default" v-for="item in schedulingItems"
                         :key="item.title"
@@ -60,7 +56,7 @@
             </v-list-group>
             <v-list-group value="training">
                 <template #activator="{ props }">
-                    <v-list-item v-bind="props" title="Training" />
+                    <v-list-item v-bind="props" title="Training" prepend-icon="mdi-human-male-board" />
                 </template>
                     <v-list-item density="default" v-for="item in trainingItems"
                         :key="item.title"
@@ -72,7 +68,7 @@
             </v-list-group>
             <v-list-group value="staneval">
                 <template #activator="{ props }">
-                    <v-list-item v-bind="props" title="Stan/Eval" />
+                    <v-list-item v-bind="props" title="Stan/Eval" prepend-icon="mdi-clipboard-account" />
                 </template>
                     <v-list-item density="default" v-for="item in stanEvalItems"
                         :key="item.title"
@@ -84,7 +80,7 @@
             </v-list-group>
             <v-list-group value="admin">
                 <template #activator="{ props }">
-                    <v-list-item v-bind="props" title="Admin" />
+                    <v-list-item v-bind="props" title="Admin" prepend-icon="mdi-security" />
                 </template>
                     <v-list-item density="default" v-for="item in adminItems"
                         :key="item.title"
@@ -119,27 +115,27 @@
     const pexItems = [
         { title: 'Dashboard', to: '/dashboard', icon: 'mdi-view-dashboard' },
         { title: 'Calendar', to: '/calendar', icon: 'mdi-calendar' },
-        { title: 'My Folder', to: '/my-folder', icon: 'mdi-folder-outline' },
+        { title: 'My Folder', to: '/my-folder', icon: 'mdi-folder' },
     ]
 
     const schedulingItems = [
-        { title: 'Calendar', to: '/calendar', icon: 'mdi-folder-outline' },
-        { title: 'Scheduler', to: '/scheduler', icon: 'mdi-folder-outline' }
+        { title: 'Calendar', to: '/calendar', icon: 'mdi-calendar-multiple' },
+        { title: 'Scheduler', to: '/scheduler', icon: 'mdi-chart-gantt' }
     ]
 
     const trainingItems = [
-        { title: 'Courses', to: '/courses', icon: 'mdi-folder-outline' },
-        { title: 'Certifications', to: '/certs', icon: 'mdi-folder-outline' }
+        { title: 'Courses', to: '/courses', icon: 'mdi-account-school' },
+        { title: 'Certifications', to: '/certs', icon: 'mdi-file-certificate' }
     ]
 
     const stanEvalItems = [
-        { title: 'FCIF Admin', to: '/fcif-admin', icon: 'mdi-folder-outline' },
-        { title: 'Management', to: '/management', icon: 'mdi-folder-outline' },
+        { title: 'FCIF Admin', to: '/fcif-admin', icon: 'mdi-book-multiple' },
+        { title: 'Management', to: '/management', icon: 'mdi-book-account' },
     ]
 
     const adminItems = [
-        { title: 'Users', to: '/users', icon: 'mdi-folder-outline' },
-        { title: 'Settings', to: '/settings', icon: 'mdi-folder-outline' }
+        { title: 'Users', to: '/users', icon: 'mdi-account-multiple' },
+        { title: 'Settings', to: '/settings', icon: 'mdi-cog' }
     ]
 
     const theme = useTheme()