alfresco-ng2-components/docs/core/header.component.md
Andy Stark 2c49de6070 [ADF-3514] Added transclusions sections to doc files (#3756)
* [ADF-3514] Added transclusion sections and guide page

* [ADF-3514] Updated tables of contents where needed

* [ADF-3514] Updated index files
2018-09-10 11:11:25 +01:00

1.6 KiB

Added, Status, Last reviewed
Added Status Last reviewed
v2.4.0 Experimental 2018-08-07

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 Description
title string Title of the application
logo string Path to an image file for the application logo.
redirectUrl string | any[] The router link for the application logo.
tooltip string The tooltip text for the application logo.
color string Background color for the header. It can be any hex color code or the Material theme colors: 'primary', 'accent' or 'warn'.
showSidenavToggle boolean Signals if the sidenav button will be displayed in the header or not. By default is true.

Events

Name Type Description
clicked EventEmitter<boolean> Emitted when click on sidenav button

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.