matt
/
monacousa-portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix sidebar collapse functionality across all layouts
Build And Push Image / docker (push) Successful in 2m2s Details 

- Change from :mini-variant to :rail for Vue 3/Vuetify 3 compatibility
- Fix width prop to use numbers instead of strings
- Add missing loading ref in board members page
- Ensure consistent collapse behavior across admin, member, and board layouts
This commit is contained in:
Matt 2025-08-31 19:06:07 +02:00
parent c9e181e8a8
commit cbf97254a2
3 changed files with 38 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
layouts/admin.vue
View File

@ -3,8 +3,8 @@
<v-navigation-drawer <v-navigation-drawer
v-model="drawer" v-model="drawer"
app app
:width="miniVariant ? '64' : '280'" :width="miniVariant ? 64 : 280"
:mini-variant="miniVariant" :rail="miniVariant"
class="enhanced-glass-drawer" class="enhanced-glass-drawer"
> >
<!-- Enhanced Logo Section --> <!-- Enhanced Logo Section -->
@ -32,13 +32,22 @@
<!-- Enhanced Navigation Menu --> <!-- Enhanced Navigation Menu -->
<v-list nav density="comfortable" class="enhanced-glass-nav"> <v-list nav density="comfortable" class="enhanced-glass-nav">
<!-- Admin Overview --> <!-- Admin Overview -->
<v-list-item <v-tooltip
to="/admin/dashboard" :text="miniVariant ? 'Admin Dashboard' : ''"
prepend-icon="mdi-view-dashboard" location="end"
title="Admin Dashboard" :disabled="!miniVariant"
value="dashboard" >
class="glass-nav-item animated-nav-item" <template v-slot:activator="{ props }">
/> <v-list-item
v-bind="props"
to="/admin/dashboard"
prepend-icon="mdi-view-dashboard"
:title="!miniVariant ? 'Admin Dashboard' : undefined"
value="dashboard"
class="glass-nav-item animated-nav-item"
/>
</template>
</v-tooltip>
<!-- User Management --> <!-- User Management -->
<v-list-group value="users"> <v-list-group value="users">

27
layouts/board.vue
View File

@ -3,8 +3,8 @@
<v-navigation-drawer <v-navigation-drawer
v-model="drawer" v-model="drawer"
app app
:width="miniVariant ? '64' : '280'" :width="miniVariant ? 64 : 280"
:mini-variant="miniVariant" :rail="miniVariant"
class="enhanced-glass-drawer" class="enhanced-glass-drawer"
> >
<!-- Enhanced Logo Section --> <!-- Enhanced Logo Section -->
@ -32,13 +32,22 @@
<!-- Enhanced Navigation Menu --> <!-- Enhanced Navigation Menu -->
<v-list nav density="comfortable" class="enhanced-glass-nav"> <v-list nav density="comfortable" class="enhanced-glass-nav">
<!-- Board Overview --> <!-- Board Overview -->
<v-list-item <v-tooltip
to="/board/dashboard" :text="miniVariant ? 'Board Dashboard' : ''"
prepend-icon="mdi-view-dashboard" location="end"
title="Board Dashboard" :disabled="!miniVariant"
value="dashboard" >
class="glass-nav-item animated-nav-item" <template v-slot:activator="{ props }">
/> <v-list-item
v-bind="props"
to="/board/dashboard"
prepend-icon="mdi-view-dashboard"
:title="!miniVariant ? 'Board Dashboard' : undefined"
value="dashboard"
class="glass-nav-item animated-nav-item"
/>
</template>
</v-tooltip>
<!-- Member Management --> <!-- Member Management -->
<v-list-group value="members"> <v-list-group value="members">

4
layouts/member.vue
View File

@ -3,8 +3,8 @@
<v-navigation-drawer <v-navigation-drawer
v-model="drawer" v-model="drawer"
app app
:width="miniVariant ? '64' : '280'" :width="miniVariant ? 64 : 280"
:mini-variant="miniVariant" :rail="miniVariant"
class="enhanced-glass-drawer" class="enhanced-glass-drawer"
> >
<!-- Logo Section with Enhanced Glass Effect --> <!-- Logo Section with Enhanced Glass Effect -->