[WEB-3422] fix: app sidebar fixes and improvements (#6633)

* chore: app sidebar improvements

* chore: overview icon updated
This commit is contained in:
Anmol Singh Bhatia 2025-02-18 20:49:17 +05:30 committed by GitHub
parent 1478e66dc4
commit 23b0d4339d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
12 changed files with 49 additions and 43 deletions

View file

@ -285,11 +285,9 @@ export const SidebarFavoritesMenu = observer(() => {
</Transition>
</Disclosure>
<hr
className={cn("flex-shrink-0 border-custom-sidebar-border-300 h-[0.5px] w-3/5 mx-auto my-1", {
"opacity-0": !sidebarCollapsed || favoriteIds.length === 0,
})}
/>
{sidebarCollapsed && favoriteIds.length > 0 && (
<hr className="flex-shrink-0 border-custom-sidebar-border-300 h-[0.5px] w-3/5 mx-auto my-1" />
)}
</>
);
});

View file

@ -238,7 +238,7 @@ export const SidebarProjectsListItem: React.FC<Props> = observer((props) => {
{
"cursor-not-allowed opacity-60": project.sort_order === null,
"cursor-grabbing": isDragging,
flex: isMenuActive,
flex: isMenuActive || renderInExtendedSidebar,
"!hidden": isSidebarCollapsed,
}
)}

View file

@ -51,19 +51,19 @@ export const SidebarMenuItems = observer(() => {
{sortedNavigationItems.map((item, _index) => (
<SidebarItem key={`dynamic_${_index}`} item={item} />
))}
<SidebarNavItem className={`${sidebarCollapsed ? "p-0 size-8 aspect-square justify-center mx-auto" : ""}`}>
<button
onClick={() => toggleExtendedSidebar()}
className={cn("flex items-center gap-1.5 text-sm font-medium flex-grow text-custom-text-350", {
"justify-center": sidebarCollapsed,
})}
id="extended-sidebar-toggle"
>
<Ellipsis className="size-4" />
{!sidebarCollapsed && <span>More</span>}
</button>
</SidebarNavItem>
</div>
<SidebarNavItem className={`${sidebarCollapsed ? "p-0 size-8 aspect-square justify-center mx-auto" : ""}`}>
<button
onClick={() => toggleExtendedSidebar()}
className={cn("flex items-center gap-1.5 text-sm font-medium flex-grow text-custom-text-350", {
"justify-center": sidebarCollapsed,
})}
id="extended-sidebar-toggle"
>
<Ellipsis className="size-4" />
{!sidebarCollapsed && <span>More</span>}
</button>
</SidebarNavItem>
</>
);
});