- 1.5.0

Simple Appbar

Attribute Type Documentation Default Value
id :any

HTML id attribute
class :any

Additional CSS classes
title :string

Appbar title
""
toggle_menu_label :string

Accessible label for the mobile menu toggle button
"Toggle mobile menu"
nav_label :string

Accessible label for the navigation landmark (i18n)
"Main navigation"
rest :global
menu :slot

Appbar menus
Show slot attributes Hide slot attributes
class :any

menu item CSS classes
to :string

navigation path
active :boolean

whether this menu item is the current page

 
<:logo>
  <span class="text-2xl font-bold">DM</span>
</:logo>
<:menu to="#dashboard">Dashboard</:menu>
<:menu to="#settings">Settings</:menu>
<:user_profile>
  <span class="text-sm">(^_^)</span>
</:user_profile>
logo :slot

Appbar Logo

 
<:logo>
  <span class="text-2xl font-bold">DM</span>
</:logo>
<:menu to="#dashboard">Dashboard</:menu>
<:menu to="#settings">Settings</:menu>
<:user_profile>
  <span class="text-sm">(^_^)</span>
</:user_profile>
user_profile :slot

Appbar right side user profile

 
<:logo>
  <span class="text-2xl font-bold">DM</span>
</:logo>
<:menu to="#dashboard">Dashboard</:menu>
<:menu to="#settings">Settings</:menu>
<:user_profile>
  <span class="text-sm">(^_^)</span>
</:user_profile>