fix: Refine sidebar design and navigation
- Make 'Port Nimara CRM' single line with larger logo (40px) - Center logo perfectly in rail/collapsed mode - Remove Dashboard button from navigation - Make Interest List the first navigation item - Remove duplicate navigation entries - Improve visual alignment and spacing
This commit is contained in:
parent
1a24faa9db
commit
9f7aa99320
|
|
@ -10,12 +10,17 @@
|
||||||
<!-- Logo and Title -->
|
<!-- Logo and Title -->
|
||||||
<v-list>
|
<v-list>
|
||||||
<v-list-item
|
<v-list-item
|
||||||
class="px-2 cursor-pointer"
|
class="px-3 py-3 cursor-pointer"
|
||||||
prepend-avatar="/Port Nimara New Logo-Circular Frame.png"
|
|
||||||
:title="rail ? '' : 'Port Nimara'"
|
|
||||||
:subtitle="rail ? '' : 'CRM'"
|
|
||||||
@click="rail = !rail"
|
@click="rail = !rail"
|
||||||
>
|
>
|
||||||
|
<template v-slot:prepend>
|
||||||
|
<v-avatar size="40" class="me-3">
|
||||||
|
<v-img src="/Port Nimara New Logo-Circular Frame.png" alt="Port Nimara" />
|
||||||
|
</v-avatar>
|
||||||
|
</template>
|
||||||
|
<v-list-item-title v-if="!rail" class="text-subtitle-1 font-weight-medium">
|
||||||
|
Port Nimara CRM
|
||||||
|
</v-list-item-title>
|
||||||
</v-list-item>
|
</v-list-item>
|
||||||
</v-list>
|
</v-list>
|
||||||
|
|
||||||
|
|
@ -159,9 +164,9 @@ const pageTitle = computed(() => {
|
||||||
const navigationItems = computed(() => {
|
const navigationItems = computed(() => {
|
||||||
const items = [
|
const items = [
|
||||||
{
|
{
|
||||||
label: 'Dashboard',
|
label: 'Interest List',
|
||||||
icon: 'mdi-home',
|
icon: 'mdi-account-multiple',
|
||||||
to: '/dashboard',
|
to: '/dashboard/interest-list',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: 'Analytics',
|
label: 'Analytics',
|
||||||
|
|
@ -178,11 +183,6 @@ const navigationItems = computed(() => {
|
||||||
icon: 'mdi-map',
|
icon: 'mdi-map',
|
||||||
to: '/dashboard/interest-berth-status',
|
to: '/dashboard/interest-berth-status',
|
||||||
},
|
},
|
||||||
{
|
|
||||||
label: 'Interest List',
|
|
||||||
icon: 'mdi-account-multiple',
|
|
||||||
to: '/dashboard/interest-list',
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
label: 'Interest Status',
|
label: 'Interest Status',
|
||||||
icon: 'mdi-clipboard-check',
|
icon: 'mdi-clipboard-check',
|
||||||
|
|
@ -301,6 +301,17 @@ onMounted(() => {
|
||||||
margin-inline-end: 0;
|
margin-inline-end: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Center logo in rail mode */
|
||||||
|
.v-navigation-drawer--rail .v-list-item {
|
||||||
|
justify-content: center;
|
||||||
|
padding-inline-start: 16px !important;
|
||||||
|
padding-inline-end: 16px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.v-navigation-drawer--rail .v-list-item__prepend {
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
/* Smooth transitions */
|
/* Smooth transitions */
|
||||||
.v-navigation-drawer,
|
.v-navigation-drawer,
|
||||||
.v-list-item__content,
|
.v-list-item__content,
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue