48 lines
1.0 KiB
Svelte
48 lines
1.0 KiB
Svelte
|
<script>
|
||
|
|
export let active = "";
|
||
|
|
import { getContext } from "svelte";
|
||
|
|
const user = getContext("user");
|
||
|
|
let logged = user?.id ? true : false;
|
||
|
|
let menuItems = [
|
||
|
|
{
|
||
|
|
name: "Account",
|
||
|
|
link: "/profile",
|
||
|
|
auth: true,
|
||
|
|
guest: false,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: "Login",
|
||
|
|
link: "/login",
|
||
|
|
auth: false,
|
||
|
|
guest: true,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: "Register",
|
||
|
|
link: "/register",
|
||
|
|
auth: false,
|
||
|
|
guest: true,
|
||
|
|
},
|
||
|
|
];
|
||
|
|
</script>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<ul class="nav justify-content-center mt-4 mb-5">
|
||
|
|
{#each menuItems as item}
|
||
|
|
{#if item.auth == logged || item.guest == !logged}
|
||
|
|
<li class="nav-item">
|
||
|
|
<a
|
||
|
|
class="nav-link"
|
||
|
|
class:active={active == item.name}
|
||
|
|
href={item.link}>{item.name}</a
|
||
|
|
>
|
||
|
|
</li>
|
||
|
|
{/if}
|
||
|
|
{/each}
|
||
|
|
</ul>
|
||
|
|
<style>
|
||
|
|
.nav-item a.active{
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
</style>
|