51 lines
979 B
Svelte
51 lines
979 B
Svelte
<script lang="ts">
|
|
import logoUrl from "$lib/assets/logo.svg";
|
|
import type { Snippet } from "svelte";
|
|
|
|
interface Props {
|
|
children?: Snippet;
|
|
}
|
|
|
|
const { children }: Props = $props();
|
|
</script>
|
|
|
|
<nav>
|
|
<a href="/" class="logo">
|
|
<img src={logoUrl} alt="logo" />
|
|
</a>
|
|
<div class="rightButton">{@render children?.()}</div>
|
|
</nav>
|
|
|
|
<style>
|
|
nav {
|
|
display: flex;
|
|
position: sticky;
|
|
width: 100%;
|
|
height: 3.5rem;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
background: linear-gradient(-77deg, #2e4653, #223a37);
|
|
box-shadow: 0rem 0rem 0.5rem #182125;
|
|
align-items: center;
|
|
overflow: hidden;
|
|
z-index: 100;
|
|
}
|
|
|
|
.logo {
|
|
display: block;
|
|
height: 100%;
|
|
}
|
|
|
|
.logo img {
|
|
height: 100%;
|
|
}
|
|
|
|
.rightButton {
|
|
display: flex;
|
|
flex-direction: row-reverse;
|
|
flex: 1;
|
|
align-items: center;
|
|
}
|
|
</style>
|