pangolin_mirror/pangolin
1
0
Fork 0
mirror of https://github.com/fosrl/pangolin.git synced 2026-03-03 09:16:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

improve alignment on sidebar

Browse Source
This commit is contained in:
miloschwartz
2026-02-19 21:52:47 -08:00
parent 7a01a4e090
commit 7d112aab27
1 changed files with 6 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/components/SidebarNav.tsx
View File

@@ -119,7 +119,7 @@ function CollapsibleNavItem({
<button <button
className={cn( className={cn(
"flex items-center w-full rounded-md transition-colors", "flex items-center w-full rounded-md transition-colors",
level === 0 ? "px-3 py-1.5" : "px-3 py-1", "px-3 py-1.5",
isActive isActive
? "bg-secondary font-medium" ? "bg-secondary font-medium"
: "text-muted-foreground hover:bg-secondary/80 dark:hover:bg-secondary/50 hover:text-foreground", : "text-muted-foreground hover:bg-secondary/80 dark:hover:bg-secondary/50 hover:text-foreground",
@@ -170,7 +170,7 @@ function CollapsibleNavItem({
<CollapsibleContent> <CollapsibleContent>
<div <div
className={cn( className={cn(
"border-l ml-3 pl-3 mt-0 space-y-0", "border-l ml-[22px] pl-[9px] mt-0 space-y-0",
"border-border" "border-border"
)} )}
> >
@@ -278,11 +278,7 @@ export function SidebarNav({
href={isDisabled ? "#" : hydratedHref} href={isDisabled ? "#" : hydratedHref}
className={cn( className={cn(
"flex items-center rounded-md transition-colors relative", "flex items-center rounded-md transition-colors relative",
isCollapsed isCollapsed ? "px-2 py-2 justify-center" : "px-3 py-1.5",
? "px-2 py-2 justify-center"
: level === 0
? "px-3 py-1.5"
: "px-3 py-1",
isActive isActive
? "bg-secondary font-medium" ? "bg-secondary font-medium"
: "text-muted-foreground hover:bg-secondary/80 dark:hover:bg-secondary/50 hover:text-foreground", : "text-muted-foreground hover:bg-secondary/80 dark:hover:bg-secondary/50 hover:text-foreground",
@@ -298,7 +294,7 @@ export function SidebarNav({
tabIndex={isDisabled ? -1 : undefined} tabIndex={isDisabled ? -1 : undefined}
aria-disabled={isDisabled} aria-disabled={isDisabled}
> >
{item.icon && ( {item.icon && level === 0 && (
<span <span
className={cn( className={cn(
"flex-shrink-0 w-5 h-5 flex items-center justify-center", "flex-shrink-0 w-5 h-5 flex items-center justify-center",
@@ -355,12 +351,12 @@ export function SidebarNav({
<div <div
className={cn( className={cn(
"flex items-center rounded-md transition-colors", "flex items-center rounded-md transition-colors",
level === 0 ? "px-3 py-1.5" : "px-3 py-1", "px-3 py-1.5",
"text-muted-foreground", "text-muted-foreground",
isDisabled && "cursor-not-allowed opacity-60" isDisabled && "cursor-not-allowed opacity-60"
)} )}
> >
{item.icon && ( {item.icon && level === 0 && (
<span className="flex-shrink-0 mr-3 w-5 h-5 flex items-center justify-center"> <span className="flex-shrink-0 mr-3 w-5 h-5 flex items-center justify-center">
{item.icon} {item.icon}
</span> </span>
@@ -480,11 +476,6 @@ export function SidebarNav({
} }
}} }}
> >
{childItem.icon && (
<span className="flex-shrink-0 mr-3 w-5 h-5 flex items-center justify-center">
{childItem.icon}
</span>
)}
<div className="flex items-center gap-2 flex-1 min-w-0"> <div className="flex items-center gap-2 flex-1 min-w-0">
<span className="truncate"> <span className="truncate">
{t(childItem.title)} {t(childItem.title)}