antialias
/
soroban-abacus-flashcards
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(nav): restrict transparent hero styling to home page only 

The HomeHeroProvider is provided site-wide, and isHeroVisible defaults to
true. This caused the navigation to use transparent "hero mode" styling on
all pages, not just the home page when the hero is visible.

Added pathname check to ensure transparent styling and hidden branding only
apply when actually on the home page (pathname === '/') with a visible hero.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Thomas Hallock 2025-11-04 18:54:03 -06:00
parent 11d0c341a8
commit fab227d686
1 changed files with 4 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
apps/web/src/components/AppNavBar.tsx
View File

@ -568,6 +568,7 @@ export function AppNavBar({ variant = 'full', navSlot }: AppNavBarProps) {
const pathname = usePathname()
const router = useRouter()
const isArcadePage = pathname?.startsWith('/arcade')
const isHomePage = pathname === '/'
const { isFullscreen, toggleFullscreen, exitFullscreen } = useFullscreen()
// Try to get home hero context (if on homepage)
@ -579,7 +580,7 @@ export function AppNavBar({ variant = 'full', navSlot }: AppNavBarProps) {
const subtitle = homeHero?.subtitle || fallbackSubtitle
// Show branding unless we're on homepage with visible hero
const showBranding = !homeHero || !homeHero.isHeroVisible
const showBranding = !isHomePage || !homeHero || !homeHero.isHeroVisible
// Auto-detect variant based on context
// Only arcade pages (not /games) should use minimal nav
@ -600,8 +601,8 @@ export function AppNavBar({ variant = 'full', navSlot }: AppNavBarProps) {
)
}
// Check if we should use transparent styling (when hero is visible)
const isTransparent = homeHero?.isHeroVisible
// Check if we should use transparent styling (when hero is visible on home page)
const isTransparent = isHomePage && homeHero?.isHeroVisible
return (
<Tooltip.Provider delayDuration={200}>