Remove default nav element, fix hamburger menu showing when no nav elements

This commit is contained in:
Pau Figueras 2023-07-27 01:59:19 +02:00
pare 1da26ece67
commit 9753ca4fd4

Veure arxiu

@ -1,18 +1,20 @@
<script lang="ts"> <script lang="ts">
import { NavbarObject } from "../classes/NavObject"; import type { NavbarObject } from "../classes/NavObject";
import { Navbar, NavBrand, NavLi, NavUl, NavHamburger, DarkMode } from 'flowbite-svelte'; import { Navbar, NavBrand, NavLi, NavUl, NavHamburger, DarkMode } from 'flowbite-svelte';
export let navobjs: NavbarObject[] = [new NavbarObject('#', 'No nav elements provided')]; export let navobjs: NavbarObject[] = [];
export let pageTitle: string = "Default Title"; export let pageTitle: string = "Default Title";
export let toggleDarkModeButton: boolean = true; export let toggleDarkModeButton: boolean = true;
</script> </script>
<Navbar let:hidden let:toggle color="form" navDivClass="mx-auto flex flex-wrap justify-around items-center" navClass="px-4 md:px-2 py-2.5 w-full bg-zinc-200 dark:bg-zinc-900"> <Navbar let:hidden let:toggle color="form" navDivClass="mx-auto flex flex-wrap justify-between items-center" navClass="px-4 md:px-2 py-2.5 w-full bg-zinc-200 dark:bg-zinc-900">
<NavBrand href="/"> <NavBrand href="/">
<span class="self-center whitespace-nowrap text-xl font-semibold dark:text-white"> <span class="self-center whitespace-nowrap text-xl font-semibold dark:text-white">
{ pageTitle.toUpperCase() } { pageTitle.toUpperCase() }
</span> </span>
</NavBrand> </NavBrand>
<NavHamburger on:click={toggle} />
<div class="flex"> <div class="flex">
{#if navobjs.length !== 0}
<NavHamburger on:click={toggle} btnClass={'ml-3 lg:hidden'} />
{/if}
<NavUl {hidden}> <NavUl {hidden}>
{#each navobjs as navElem} {#each navobjs as navElem}
<NavLi href="{ navElem.link }">{ navElem.text }</NavLi> <NavLi href="{ navElem.link }">{ navElem.text }</NavLi>