GitHub

DaffStrokedButtonComponent

class

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

DaffStrokedButtonComponent is a rectangular outlined button with no background color.

@Component()
class DaffStrokedButtonComponent {
  @Input() status: DaffStatus
  @Input() color: DaffPalette
  @Input() elevated: boolean = false
  @Input() tabindex: number = 0
  @Input() disabled: any
}

Inputs

status
DaffStatus
Default –
Description

Sets the status on a component.

Options are: info, warn, critical, and success.

color
DaffPalette
Default –
Description

Sets the color on a component.

Default options are: primary, secondary, tertiary, light, dark, theme, and theme-contrast.

elevated
boolean
Defaultfalse
Description

Whether or not the button displays a shadow.

tabindex
number
Default0
Description

Sets the tabindex.

disabled
any
Default –
Description

The disabled state of the button.

Examples

Stroked button

<button daff-stroked-button>
 <div daffPrefix></div>
 Stroked Button
 <div daffSuffix></div>
</button>

<a href="/" daff-stroked-button>
 <div daffPrefix></div>
 Linked stroked button
 <div daffSuffix></div>
</a>

Stroked button

<button daff-stroked-button>
 <div daffPrefix></div>
 Stroked Button
 <div daffSuffix></div>
</button>

<a href="/" daff-stroked-button>
 <div daffPrefix></div>
 Linked stroked button
 <div daffSuffix></div>
</a>