+layout.svelte

<script lang="ts">
  // layout-1
  import '../app.postcss';
  import { Navbar, NavBrand, NavLi, NavUl, NavHamburger, Sidebar, SidebarGroup, SidebarItem, SidebarWrapper, Drawer, CloseButton } from 'flowbite-svelte';
  let divClass = 'w-full md:block md:w-auto pr-8';
  let ulClass = 'flex flex-col p-4 mt-4 md:flex-row md:space-x-8 md:mt-0 md:text-lg md:font-medium';
</script>

<Navbar let:hidden let:toggle>
  <NavBrand href="/">
    <img src="https://flowbite-svelte.com/images/flowbite-svelte-icon-logo.svg" class="mr-3 h-6 sm:h-9" alt="Flowbite-Svelte Logo" />
    <span class="self-center whitespace-nowrap text-xl font-semibold dark:text-white">
      Flowbite-Svelte
    </span>
  </NavBrand>
  <NavHamburger on:click={toggle} />
  <NavUl {hidden} {divClass} {ulClass}>
    <NavLi href="/">Home</NavLi>
    <NavLi href="/pages/about">About</NavLi>
    <NavLi href="https://github.com/themesberg/flowbite-svelte">GitHub</NavLi>
  </NavUl>
</Navbar>

<div class='w-full'>
  <slot />
</div>