mohs/sass-mohfarawati
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

POLISHED - Soften dock hover magnification and enlarge tooltip text

Browse Source
This commit is contained in:
moh
2026-09-20 19:40:02 +02:00
parent 70203732d2
commit 4017ba3b72
1 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/layout/site-dock.tsx
+4 -4
View File
@@ -62,8 +62,8 @@ export function SiteDock({ defaultLocale, isSuperAdmin = false }: SiteDockProps)
<Dock <Dock
direction="bottom" direction="bottom"
iconSize={52} iconSize={52}
iconMagnification={90} iconMagnification={72}
iconDistance={160} iconDistance={150}
className="pointer-events-auto h-[68px] gap-2.5 border-border/60 bg-background/70 shadow-panel" className="pointer-events-auto h-[68px] gap-2.5 border-border/60 bg-background/70 shadow-panel"
> >
{/* ── Logo (fixed src → no refresh flash) ── */} {/* ── Logo (fixed src → no refresh flash) ── */}
@@ -150,10 +150,10 @@ function DockTip({ label, soon }: { label: string; soon?: string }) {
return ( return (
<span <span
role="tooltip" role="tooltip"
className="pointer-events-none absolute bottom-[calc(100%+0.75rem)] left-1/2 -translate-x-1/2 translate-y-1 whitespace-nowrap rounded-lg border border-border/60 bg-background/90 px-2.5 py-1 text-xs font-semibold text-foreground opacity-0 shadow-md backdrop-blur-chrome transition-all duration-150 group-hover:translate-y-0 group-hover:opacity-100" className="pointer-events-none absolute bottom-[calc(100%+0.85rem)] left-1/2 -translate-x-1/2 translate-y-1 whitespace-nowrap rounded-lg border border-border/60 bg-background/90 px-3 py-1.5 text-sm font-semibold text-foreground opacity-0 shadow-md backdrop-blur-chrome transition-all duration-150 group-hover:translate-y-0 group-hover:opacity-100"
> >
{label} {label}
{soon ? <span className="ms-1.5 text-[0.625rem] tracking-wide text-primary">{soon}</span> : null} {soon ? <span className="ms-1.5 text-xs tracking-wide text-primary">{soon}</span> : null}
</span> </span>
); );
} }