fix(web): increase sidebar nav label vertical nudge to 1px

0.5px under-corrected the optical high-sitting of full-mode nav labels;
bump to 1px so text centers on its icon.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Oliver Kieselbach
2026-06-19 10:05:32 +02:00
parent e285e93b00
commit a60ef54a23
@@ -322,7 +322,7 @@ export function GlobalSidebar({ children }: { children: ReactNode }) {
<li key={item.id}>
<Link href={item.href} onClick={() => setMobileDrawerOpen(false)} className={`${base} px-3 py-1.5`}>
{renderIcon(item.icon, "w-4 h-4")}
<span className="truncate relative top-[0.5px]">{item.label}</span>
<span className="truncate relative top-px">{item.label}</span>
</Link>
</li>
);
@@ -367,7 +367,7 @@ export function GlobalSidebar({ children }: { children: ReactNode }) {
<li key={item.id}>
<Link href={item.href} onClick={() => setMobileDrawerOpen(false)} className={`${base} px-3 py-1.5`}>
{renderIcon(item.icon, "w-4 h-4")}
<span className="truncate relative top-[0.5px]">{item.label}</span>
<span className="truncate relative top-px">{item.label}</span>
</Link>
</li>
);
@@ -377,7 +377,7 @@ export function GlobalSidebar({ children }: { children: ReactNode }) {
<li key={item.id}>
<button onClick={() => scrollTo(item.id)} className={`${base} w-full text-left px-3 py-1.5`}>
{renderIcon(item.icon, "w-4 h-4")}
<span className="truncate relative top-[0.5px]">{item.label}</span>
<span className="truncate relative top-px">{item.label}</span>
</button>
</li>
);
@@ -514,7 +514,7 @@ export function GlobalSidebar({ children }: { children: ReactNode }) {
}`}
>
<span className="shrink-0 w-4 h-4">{expandItem.icon}</span>
<span className="truncate flex-1 text-left relative top-[0.5px]">{expandItem.label}</span>
<span className="truncate flex-1 text-left relative top-px">{expandItem.label}</span>
<svg
className={`w-3.5 h-3.5 shrink-0 text-gray-400 transition-transform duration-150 ${isExpanded ? "rotate-90" : ""}`}
fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}
@@ -655,7 +655,7 @@ export function GlobalSidebar({ children }: { children: ReactNode }) {
{group.icon ? group.icon : renderIcon(undefined, "w-4 h-4")}
</span>
{/* Group label */}
<span className="truncate flex-1 text-left relative top-[0.5px]">{group.name}</span>
<span className="truncate flex-1 text-left relative top-px">{group.name}</span>
{/* Chevron */}
<svg
className={`w-3.5 h-3.5 shrink-0 text-gray-400 transition-transform duration-150 ${isExpanded ? "rotate-90" : ""}`}