<Docs title="No Drink Cubes" background="dark" layout="fullscreen">
	<section style="height: 500vh">hello world!</section>
	<MainNavigation {items} cartLinks={cartLinks} client:load>
		<Fragment slot="products">
			<MainNavigationCtaTeaser
				title="Discover all our Products"
				button={{
					text: "Explore",
					url: "#",
				}}
				image={createDummyImage({
					width: 764,
					height: 736,
					project: "ricola-specific",
					index: "all-products-visual.png",
					alt: "",
				})}
			/>
			<MainNavigationGrid columns="2" columnsTablet="1">
				<MainNavLinkList title="Properties" items={dummyLinkListItems} />
				<MainNavLinkList title="Merchandise" items={dummyLinkListItems} />
			</MainNavigationGrid>
		</Fragment>

		<Fragment slot="discover">
			<MainNavigationGrid columns="3" columnsTablet="2">
				<PageTeaser {...dummyTeaserGridItems[0]} layout="main-nav" />
				<PageTeaser {...dummyTeaserGridItems[1]} layout="main-nav" />
				<PageTeaser {...dummyTeaserGridItems[2]} layout="main-nav" />
			</MainNavigationGrid>
			<MainNavLinkList title="Visit Ricola" items={dummyLinkListItems} />
		</Fragment>

		<Fragment slot="about">
			<MainNavigationGrid columns="2" columnsTablet="2">
				<PageTeaser {...dummyTeaserGridItems[1]} layout="main-nav" />
				<PageTeaser {...dummyTeaserGridItems[2]} layout="main-nav" />
			</MainNavigationGrid>
			<MainNavLinkList title="Company" items={dummyLinkListItems} />
		</Fragment>
	</MainNavigation>
</Docs>

<Docs title="Drink Cubes" background="dark" layout="fullscreen">
	<section style="height: 500vh">hello world!</section>
	<MainNavigation {items} cartLinks={cartLinks} client:load>
		<Fragment slot="products">
			<MainNavigationGrid columns="3" columnsTablet="2">
				<ProductCategoryTeaser {...dummyProductCategoryTeaserItems[0]} />
				<ProductCategoryTeaser {...dummyProductCategoryTeaserItems[1]} />
				<ProductCategoryTeaser {...dummyProductCategoryTeaserItems[2]} />
			</MainNavigationGrid>
			<MainNavLinkList title="Features" items={dummyLinkListItems} />
		</Fragment>

		<Fragment slot="discover">
			<MainNavigationGrid columns="3" columnsTablet="2">
				<PageTeaser {...dummyTeaserGridItems[0]} layout="main-nav" />
				<PageTeaser {...dummyTeaserGridItems[1]} layout="main-nav" />
				<PageTeaser {...dummyTeaserGridItems[2]} layout="main-nav" />
			</MainNavigationGrid>
			<MainNavLinkList title="Visit Ricola" items={dummyLinkListItems} />
		</Fragment>

		<Fragment slot="about">
			<MainNavigationGrid columns="2" columnsTablet="2">
				<PageTeaser {...dummyTeaserGridItems[1]} layout="main-nav" />
				<PageTeaser {...dummyTeaserGridItems[2]} layout="main-nav" />
			</MainNavigationGrid>
			<MainNavLinkList title="Company" items={dummyLinkListItems} />
		</Fragment>
	</MainNavigation>
</Docs>