test/crm
1
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: handle style for collapsed sidebar

Browse Source
This commit is contained in:
Shariq Ansari 2024-01-01 19:27:30 +05:30
parent a7f9859b89
commit 100fbeb109
1 changed files with 17 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
frontend/src/components/AppSidebar.vue
View File

@ -3,7 +3,7 @@
class="flex h-full flex-col justify-between transition-all duration-300 ease-in-out" class="flex h-full flex-col justify-between transition-all duration-300 ease-in-out"
:class="isSidebarCollapsed ? 'w-12' : 'w-56'" :class="isSidebarCollapsed ? 'w-12' : 'w-56'"
> >
<div class="flex flex-col overflow-hidden"> <div class="flex flex-1 flex-col overflow-hidden">
<UserDropdown class="p-2" :isCollapsed="isSidebarCollapsed" /> <UserDropdown class="p-2" :isCollapsed="isSidebarCollapsed" />
<div class="flex flex-col overflow-y-auto"> <div class="flex flex-col overflow-y-auto">
<SidebarLink <SidebarLink
@ -15,11 +15,25 @@
class="mx-2 my-0.5" class="mx-2 my-0.5"
/> />
</div> </div>
<div
v-if="isSidebarCollapsed && getPinnedViews().length"
class="mx-2 my-2 h-1 border-b"
/>
<div <div
v-if="getPinnedViews().length" v-if="getPinnedViews().length"
class="mt-4 flex flex-col overflow-y-auto" class="flex flex-col overflow-y-auto"
:class="isSidebarCollapsed ? 'mt-0' : 'mt-4'"
> >
<div class="h-7 px-3 text-base text-gray-600">Pinned Views</div> <div
class="h-7 px-3 text-base text-gray-600 transition-all duration-300 ease-in-out"
:class="
isSidebarCollapsed
? 'ml-0 h-0 overflow-hidden opacity-0'
: 'ml-2 w-auto opacity-100'
"
>
Pinned Views
</div>
<SidebarLink <SidebarLink
v-for="pinnedView in getPinnedViews()" v-for="pinnedView in getPinnedViews()"
:icon=" :icon="