Button

Buttons are used to make actions apparent to the end user. It can be used to navigate users to a different page or to perform an action. Buttons can contain text, icons, or both.

Usage

API

Components

DaffButtonComponent

import { DaffButtonComponent } from '@daffodil/design/button'

DaffButtonComponent is a rectangular contained button with background color.

@Component()
class DaffButtonComponent extends DaffButtonBaseDirective {
  @Input() @HostBinding() elevated: boolean = false
}

Inputs

elevated

boolean

Default	`false`
Description	Whether or not the button displays a shadow.

DaffFlatButtonComponent

import { DaffFlatButtonComponent } from '@daffodil/design/button'

DaffFlatButtonComponent is a rectangular contained button no background.

@Component()
class DaffFlatButtonComponent extends DaffButtonBaseDirective {}

DaffRaisedButtonComponent

Deprecated

import { DaffRaisedButtonComponent } from '@daffodil/design/button'

@Component()
class DaffRaisedButtonComponent extends DaffButtonBaseDirective {}

DaffStrokedButtonComponent

import { DaffStrokedButtonComponent } from '@daffodil/design/button'

DaffStrokedButtonComponent is a rectangular outlined button with no background color.

@Component()
class DaffStrokedButtonComponent extends DaffButtonBaseDirective {
  @Input() @HostBinding() elevated: boolean = false
}

Inputs

elevated

boolean

Default	`false`
Description	Whether or not the button displays a shadow.

DaffUnderlineButtonComponent

import { DaffUnderlineButtonComponent } from '@daffodil/design/button'

DaffUnderlineButtonComponent is a borderless button with a custom underline style.

@Component()
class DaffUnderlineButtonComponent extends DaffButtonBaseDirective {}

DaffIconButtonComponent

import { DaffIconButtonComponent } from '@daffodil/design/button'

DaffIconButtonComponent is an icon button used with icon fonts.

@Component()
class DaffIconButtonComponent extends DaffButtonBaseDirective {}

Modules

DaffButtonModule

Deprecated

import { DaffButtonModule } from '@daffodil/design/button'

@NgModule()
class DaffButtonModule {}