projects/tl-elements/src/lib/tl-nav-list/tl-nav-list.component.ts
The TamuNavList Component represents a navigation list. Elements within this list must be of type : wvr-nav-li elements and can be either links of action elements.
changeDetection | ChangeDetectionStrategy.Default |
selector | tl-nav-list-component |
styleUrls | ./tl-nav-list.component.scss |
templateUrl | ./tl-nav-list.component.html |
Properties |
Inputs |
HostBindings |
constructor(injector: Injector)
|
||||||
Parameters :
|
aligned | |
Type : Alignment
|
|
Default value : Alignment.LEFT
|
|
The aligned property describing the positioning of the list elements. |
vertical | |
Type : boolean
|
|
Default value : false
|
|
This allows the display of the list horizontally. |
inheritFontStyle | |
Type : "true" | "false"
|
|
Inherited from
TamuAbstractBaseComponent
|
|
Defined in
TamuAbstractBaseComponent:14
|
style.--tl-font-family-sans-serif |
Type : string
|
Default value : 'var(--tl-default-font-family-sans-serif)'
|
Inherited from
TamuAbstractBaseComponent
|
Defined in
TamuAbstractBaseComponent:12
|
Allows for the override of the --tl-font-family-sans-serif css variable. |
style.--tl-font-size |
Type : string
|
Default value : 'var(--tl-default-font-size)'
|
Inherited from
TamuAbstractBaseComponent
|
Defined in
TamuAbstractBaseComponent:9
|
Allows for the override of the --tl-default-font-size css variable. |
_fontFamily |
Type : string
|
Default value : 'var(--tl-default-font-family-sans-serif)'
|
Decorators :
@HostBinding('style.--tl-font-family-sans-serif')
|
Inherited from
TamuAbstractBaseComponent
|
Defined in
TamuAbstractBaseComponent:12
|
Allows for the override of the --tl-font-family-sans-serif css variable. |
_fontSize |
Type : string
|
Default value : 'var(--tl-default-font-size)'
|
Decorators :
@HostBinding('style.--tl-font-size')
|
Inherited from
TamuAbstractBaseComponent
|
Defined in
TamuAbstractBaseComponent:9
|
Allows for the override of the --tl-default-font-size css variable. |
import { ChangeDetectionStrategy, Component, Injector, Input } from '@angular/core';
import { Alignment } from '@wvr/elements';
import { TamuAbstractBaseComponent } from '../shared/tl-abstract-base.component';
/**
* The TamuNavList Component represents a navigation list.
* Elements within this list must be of type : wvr-nav-li elements and can be either links of action elements.
*/
@Component({
selector: 'tl-nav-list-component',
templateUrl: './tl-nav-list.component.html',
styleUrls: ['./tl-nav-list.component.scss'],
changeDetection: ChangeDetectionStrategy.Default
})
export class TlNavListComponent extends TamuAbstractBaseComponent {
/** The aligned property describing the positioning of the list elements. */
@Input() aligned: Alignment = Alignment.LEFT;
/** This allows the display of the list horizontally. */
@Input() vertical = false;
// tslint:disable-next-line:unnecessary-constructor
constructor(injector: Injector) {
super(injector);
}
}
<wvr-nav-list-component [aligned]="aligned" [vertical]="vertical">
<template nav-list-items>
<ng-content select="wvre-nav-li, tl-nav-li" ngProjectAs="wvre-nav-li"></ng-content>
</template>
</wvr-nav-list-component>
./tl-nav-list.component.scss
@import "../shared/styles/tl-variables.scss";