File

projects/tl-elements/src/lib/tl-it-works/tl-it-works.component.ts

Extends

TamuAbstractBaseComponent

Metadata

Index

Properties
Inputs
HostBindings

Constructor

constructor(injector: Injector)
Parameters :
Name Type Optional
injector Injector No

Inputs

text
Type : string
Default value : ''

The text value to be displayed for text.

inheritFontStyle
Type : "true" | "false"

HostBindings

style.--tl-font-family-sans-serif
Type : string
Default value : 'var(--tl-default-font-family-sans-serif)'

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)'

Allows for the override of the --tl-default-font-size css variable.

Properties

title
Type : string
Default value : 'tl-it-works-component'

The text value to be displayed in the page title.

_fontFamily
Type : string
Default value : 'var(--tl-default-font-family-sans-serif)'
Decorators :
@HostBinding('style.--tl-font-family-sans-serif')

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')

Allows for the override of the --tl-default-font-size css variable.

import { ChangeDetectionStrategy, Component, Injector, Input } from '@angular/core';
import { TamuAbstractBaseComponent } from '../shared/tl-abstract-base.component';

@Component({
  selector: 'tl-it-works-component',
  templateUrl: './tl-it-works.component.html',
  styleUrls: ['./tl-it-works.component.scss'],
  changeDetection: ChangeDetectionStrategy.Default
})
export class TlItWorksComponent extends TamuAbstractBaseComponent {

  /** The text value to be displayed in the page title. */
  title = 'tl-it-works-component';

  /** The text value to be displayed for text. */
  @Input() text = '';

  // tslint:disable-next-line:unnecessary-constructor
  constructor(injector: Injector) {
    super(injector);
  }

}
<wvr-it-works-component [text]="text"></wvr-it-works-component>

./tl-it-works.component.scss

@import "../shared/styles/tl-variables.scss";

:host {
  font-family: var(--tl-font-family-sans-serif);
  h1.it-works {
    font-size: var(--tl-font-size);
    font-family: var(--tl-font-family-sans-serif);
    color: var(--tl-black);
  }
}
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""