Skip to content

Latest commit

 

History

History
60 lines (46 loc) · 2.06 KB

header.component.md

File metadata and controls

60 lines (46 loc) · 2.06 KB
Title Added Status Last reviewed
Header component
v2.5.0
Active
2018-11-20

Header component

Reusable header for Alfresco applications.

Basic usage

<adf-layout-header 
    title="title" 
    logo="logo.png" 
    [redirectUrl]="'/home'"
    color="primary"
    (toggled)=toggleMenu($event)>
</adf-layout-header>

Transclusions

The right-hand side of the header has free-form content that you supply in the body of the element:

<adf-layout-header>
    <div>Optional content for right-hand side</div>
</adf-layout-header>

Class members

Properties

Name Type Default value Description
color string Background color for the header. It can be any hex color code or one of the Material theme colors: 'primary', 'accent' or 'warn'.
expandedSidenav boolean true expandedSidenav: Toggles the expanded state of the component.
logo string Path to an image file for the application logo.
position string "start" The side of the page that the drawer is attached to (can be 'start' or 'end')
redirectUrl string | any[] "/" The router link for the application logo, when clicked.
showSidenavToggle boolean true Toggles whether the sidenav button will be displayed in the header or not.
title string Title of the application.
tooltip string The tooltip text for the application logo.

Events

Name Type Description
clicked EventEmitter<boolean> Emitted when the sidenav button is clicked.

Details

This component displays a customizable header that can be reused. Use the input properties to configure the left side (title, button) and the primary color of the header. The right part of the header can contain other components which are transcluded in the header component.