---
import config from 'config';
import type { Config } from '@webtypes/Config';
import NavbarElement from './NavbarElement.astro';

---

	<div class="absolute w-full flex flex-row justify-center h-screen max-h-[110px] px-3">
		<nav class="w-full max-w-[1080px] flex flex-col md:flex-row justify-between items-center">
			<ul class="flex flex-row justify-start gap-4">
				{(config as Config).navbar.left.map((element, index) => (
					<NavbarElement {element} {index} />
				))}
			</ul>
			<ul class="flex flex-row justify-end gap-4">
				{(config as Config).navbar.right.map((element, index) => (
					<NavbarElement {element} {index} />
				))}
			</ul>
		</nav>
	</div>