File

projects/tl-elements/src/lib/tl-modal/tl-modal.component.ts

Extends

TamuAbstractBaseComponent

Metadata

Index

Properties
Inputs
HostBindings

Constructor

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

Inputs

btnText
Type : any
btnVisible
Type : string
Default value : 'true'
title
Type : any
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

btnThemeVariant
Type : string
Default value : 'primary'
_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 { Component, Injector, Input } from '@angular/core';
import { TamuAbstractBaseComponent } from '../shared/tl-abstract-base.component';

@Component({
  selector: 'tl-modal-component',
  templateUrl: './tl-modal.component.html',
  styleUrls: ['./tl-modal.component.scss']
})
export class TlModalComponent extends TamuAbstractBaseComponent {

  btnThemeVariant = 'primary';

  @Input() title;

  @Input() btnText;

  @Input() btnVisible = 'true';

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

}
<wvr-modal-component #animationRoot
  [themeVariant]="btnThemeVariant"
  [title]="title"
  [btnText]="btnText"
  [btnVisible]="btnVisible">
  <ng-content select="template[modal-body]" ngProjectAs="template[modal-body]"></ng-content>
  <ng-content select="template[modal-footer]" ngProjectAs="template[modal-footer]"></ng-content>
</wvr-modal-component>

./tl-modal.component.scss

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

:host {

  wvr-modal-component {
    font-family: var(--tl-font-family-sans-serif);
    ::ng-deep {
      .wvr-modal {
        font-family: var(--tl-font-family-sans-serif);
      }
    }
  }
}
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""