<!-- svelte-ignore a11y-missing-content -->
<script>
	import '$lib/css/base.css';
	import '$lib/css/navbar.css';

	let scrollY;
</script>

<svelte:window bind:scrollY />

<!-- Navbar -->
<nav class={scrollY < 50 ? 'flex-row' : 'flex-row floating'}>
	<div class={scrollY < 50 ? 'navbar-title flex-row navbar-background shadow' : 'navbar-title h-100'}>
		<h1>Etheryo Blog</h1>
	</div>
	<div class={scrollY < 50 ? 'navbar-categories flex-row flex-end navbar-background shadow' : 'flex-end navbar-categories h-100'}>
		<div>
			<a href="/">Articles</a>
		</div>
		<div>
			<a href="/">Auteurs</a>
		</div>
		<div>
			<a href="/">Catégories</a>
		</div>
		<div>
			<a href="/">Flux RSS</a>
		</div>
	</div>
	<div class={scrollY < 50 ? 'navbar-search navbar-background shadow' : 'navbar-search navbar-search-floating h-100'}>
		<input type="text" placeholder="Rechercher..." />
	</div>
</nav>
<div class="navbar-fake" />

<slot />

<!-- Footer -->
