49 lines
1.8 KiB
TypeScript
49 lines
1.8 KiB
TypeScript
import { Outlet } from 'react-router-dom';
|
|
import NavbarCentered from '@/components/ui/NavbarCentered';
|
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
|
import { StyleProvider } from '@/components/ui/StyleProvider';
|
|
import SiteBackgroundSlot from '@/components/ui/SiteBackgroundSlot';
|
|
|
|
/**
|
|
* Shared site chrome — navbar + footer rendered ONCE around every page via <Outlet />.
|
|
* Navbar renders exactly one source of truth; pages render only their own content.
|
|
*
|
|
* navItems is an EXPLICIT list — not derived from routes.ts — because it must support
|
|
* BOTH types of links:
|
|
* - page links: href: "/products", href: "/about"
|
|
* - anchor links: href: "#features", href: "#pricing", href: "#contact"
|
|
* When the initial site has everything on one page, anchors are the right thing.
|
|
* When pages are split, both coexist.
|
|
*
|
|
* Generator & page-create handler edit THIS array when user requests nav changes.
|
|
*
|
|
* StyleProvider props (buttonVariant / siteBackground / heroBackground) are the single
|
|
* source of truth for Button look and decorative backgrounds across the whole site.
|
|
* Backend writes them at generation time; Bob-AI's style handler edits them on demand.
|
|
*/
|
|
export default function Layout() {
|
|
const navItems = [
|
|
{ name: 'Home', href: '/' },
|
|
];
|
|
|
|
return (
|
|
<StyleProvider buttonVariant="default" siteBackground="none" heroBackground="none">
|
|
<SiteBackgroundSlot />
|
|
<NavbarCentered
|
|
logo="Brand"
|
|
navItems={navItems}
|
|
ctaButton={{ text: 'Get Started', href: '/' }}
|
|
/>
|
|
<main className="flex-grow">
|
|
<Outlet />
|
|
</main>
|
|
<FooterSimple
|
|
brand="Brand"
|
|
copyright="© 2024 Brand. All rights reserved."
|
|
columns={[]}
|
|
links={[]}
|
|
/>
|
|
</StyleProvider>
|
|
);
|
|
}
|