<:navbar_start>
  <.dropdown>
    <div tabindex="0" role="button" class="btn btn-ghost btn-circle">
      <.icon name="hero-bars-3-bottom-right" />
    </div>
    <.menu tabindex="0" size="sm" class="dropdown-content bg-base-100 rounded-box z-[1] mt-3 w-52 p-2 shadow">
      <:item><a>Homepage</a></:item>
      <:item><a>Portfolio</a></:item>
      <:item><a>About</a></:item>
    </.menu>
  </.dropdown>
</:navbar_start>
<:navbar_center>
  <a class="btn btn-ghost text-xl">daisyUI</a>
</:navbar_center>
<:navbar_end>
  <.button shape="circle" ghost>
    <.icon name="hero-magnifying-glass" />
  </.button>
  <.button shape="circle" ghost>
    <div class="indicator">
      <.icon name="hero-bell" />
      <.badge size="xs" color="primary" class="indicator-item"></.badge>
    </div>
  </.button>
</:navbar_end>

<:navbar_start>
  <.dropdown>
    <div tabindex="0" role="button" class="btn btn-ghost btn-circle">
      <.icon name="hero-bars-3-bottom-right" />
    </div>
    <.menu tabindex="0" size="sm" class="dropdown-content bg-base-100 rounded-box z-[1] mt-3 w-52 p-2 shadow">
      <:item><a>Homepage</a></:item>
      <:item><a>Portfolio</a></:item>
      <:item><a>About</a></:item>
    </.menu>
  </.dropdown>
</:navbar_start>
<:navbar_center>
  <a class="btn btn-ghost text-xl">daisyUI</a>
</:navbar_center>
<:navbar_end>
  <.button shape="circle" ghost>
    <.icon name="hero-magnifying-glass" />
  </.button>
  <.button shape="circle" ghost>
    <div class="indicator">
      <.icon name="hero-bell" />
      <.badge size="xs" color="primary" class="indicator-item"></.badge>
    </div>
  </.button>
</:navbar_end>

<:navbar_start>
  <.dropdown>
    <div tabindex="0" role="button" class="btn btn-ghost btn-circle">
      <.icon name="hero-bars-3-bottom-right" />
    </div>
    <.menu tabindex="0" size="sm" class="dropdown-content bg-base-100 rounded-box z-[1] mt-3 w-52 p-2 shadow">
      <:item><a>Homepage</a></:item>
      <:item><a>Portfolio</a></:item>
      <:item><a>About</a></:item>
    </.menu>
  </.dropdown>
</:navbar_start>
<:navbar_center>
  <a class="btn btn-ghost text-xl">daisyUI</a>
</:navbar_center>
<:navbar_end>
  <.button shape="circle" ghost>
    <.icon name="hero-magnifying-glass" />
  </.button>
  <.button shape="circle" ghost>
    <div class="indicator">
      <.icon name="hero-bell" />
      <.badge size="xs" color="primary" class="indicator-item"></.badge>
    </div>
  </.button>
</:navbar_end>