The SidebarLayout component is used to create a responsive sidebar.
import live-web.dom
import live-web-view.content
import live-web-view.layoutstatic any[] use = [SidebarLayout, Content]SidebarLayout{
Sidebar{
SidebarCompact{
SidebarCloseButton{}
}
Header{
H1`Sidebar Content`
}
}
Aside{
SidebarCompact{
SidebarToggleButton{}
}
Content{
H1`Main content`
}
}
}Use the direction property SidebarLayout.Direction.Left or SidebarLayout.Direction.Right to position the layout left or right.
import live-web.dom
import live-web-view.content
import live-web-view.layoutstatic any[] use = [SidebarLayout, Content]SidebarLayout{ direction: SidebarLayout.Direction.Right
Sidebar{ position: Sidebar.Position.Parent
SidebarCompact{
SidebarCloseButton{}
}
Header{
H1`Sidebar Content`
}
}
Aside{
SidebarCompact{
SidebarToggleButton{}
}
Content{
H1`Main content`
}
}
}