spartacus-inventur-frontend/src/lib/Navbar.svelte

54 lines
1.8 KiB
Svelte

<!-- svelte-ignore a11y-missing-attribute -->
<!-- svelte-ignore a11y-click-events-have-key-events -->
<script lang="ts">
import { activeCategory } from "../stores/drinks";
let sparti_logo = "./src/assets/sparti_logo.png";
const setActiveCategory = (category: string) => {
$activeCategory = category;
}
</script>
<nav class="navbar is-light is-spaced has-shadow is-fixed-top">
<div class="navbar-brand">
<a on:click={() => setActiveCategory("")} class="navbar-item">
<img src={sparti_logo} />
</a>
</div>
<div class="navbar-menu">
<div class="navbar-start">
<a class="navbar-item" on:click={() => setActiveCategory("beer")}>
Bier
</a>
<a class="navbar-item" on:click={() => setActiveCategory("fizzyDrink")}>
Brause & Wasser
</a>
<a class="navbar-item" on:click={() => setActiveCategory("wine")}>
Wein & Sekt
</a>
<a class="navbar-item" on:click={() => setActiveCategory("spirit")}>
Schnaps & Sirup
</a>
</div>
<div class="navbar-end">
<div class="navbar-item">
<div class="buttons">
<a on:click={() => console.log("TBD")} class="button is-primary">
<strong>Abschluss</strong>
<!-- Hier sollte dann auch ein Name eingegeben werden -->
</a>
</div>
</div>
<div class="navbar-item">
<div class="buttons">
<a on:click={() => console.log("TBD")} class="button is-danger">
<strong>Reset</strong>
</a>
</div>
</div>
</div>
</div>
</nav>