NavigationLayout
<ui5-navigation-layout>
| Since 2.4.0The ui5-navigation-layout
is a container component that can be used to
create a layout with a header, a side navigation and a content area.
Usage​
Use the ui5-navigation-layout
to create whole screen of an application with vertical navigation.
Responsive Behavior​
On desktop and tablet devices, the side navigation remains visible and can
be expanded or collapsed using the sideCollapsed
property. On phone devices, the side navigation
is hidden by default but can be displayed using the same sideCollapsed
property.
ES6 Module Import​
import "@ui5/webcomponents-fiori/dist/NavigationLayout.js";
Basic Sample​
Properties​
sideCollapsed​
Slots​
header​
sideContent​
default​
Events​
No events available for this component.
Methods​
No methods available for this component.
CSS Parts​
No CSS parts available for this component.