4.0.0 • Published 3 years ago

@terminus/ui-button v4.0.0

Weekly downloads
25
License
MIT
Repository
github
Last release
3 years ago

CI/CD Status Codecov MIT License
NPM version Library size

Table of Contents

Installation

Use the ng add command to quickly install all the needed dependencies:

ng add @terminus/ui-button

CSS imports

In your top level stylesheet, add these imports:

@import '~@terminus/design-tokens/css/library-design-tokens.css';
@import '~@terminus/ui-styles/terminus-ui.css';

CSS resources

Load the needed font families by adding this link to the <head> of your application:

<link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;0,700;1,400&display=swap" rel="stylesheet">
<!-- Don't forget to update the integrity SHA -->
<link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.15.1/css/solid.css" integrity="SHA-HERE" crossorigin="anonymous">
<link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.15.1/css/fontawesome.css" integrity="SHA-HERE" crossorigin="anonymous">

Usage

<ts-button (clicked)="myFunc($event)">Click me!</ts-button>

Text content

Text content can be passed in through the element, or through an @Input:

<ts-button>Click me!</ts-button>
<ts-button textContent="Click Me!"></ts-button>

Theme

Set any available theme type:

<ts-button theme="secondary">Click Me!</ts-button>

See TsButtonThemeTypes for all available themes.

Size

For a smaller button, set the isSmall flag:

<ts-button [isSmall]="true">Click Me!</ts-button>

Button type

Set any available type:

<ts-button buttonType="submit">Click Me!</ts-button>

See TsButtonFunctionTypes for all available button types.

Action name

Any valid action name can be set:

<ts-button actionName="Reset">Click Me!</ts-button>

See TsButtonActionTypes for all available action names.

Show progress

When 'showing progress', the button will be disabled, and a spinner will be shown:

<ts-button [showProgress]="true">Click Me!</ts-button>
tslib@angular-devkit/schematics@schematics/angular
@everything-registry/sub-chunk-905@zalastax/nolb-_ter@infinitebrahmanuniverse/nolb-_ter
4.0.0

3 years ago

3.0.2

3 years ago

3.0.1

3 years ago

3.0.0

3 years ago

2.2.1

3 years ago

2.2.0

3 years ago

2.1.6

3 years ago

2.1.7

3 years ago

2.1.5

4 years ago

2.1.4

4 years ago

2.1.3

4 years ago

2.1.2

4 years ago

2.1.1

4 years ago

2.1.0

4 years ago

2.0.21

4 years ago

2.0.20

4 years ago

2.0.19

4 years ago

2.0.17

4 years ago

2.0.18

4 years ago

2.0.16

4 years ago

2.0.15

4 years ago

2.0.13

4 years ago

2.0.14

4 years ago

2.0.12

4 years ago

2.0.11

4 years ago

2.0.9

4 years ago

2.0.10

4 years ago

2.0.8

4 years ago

2.0.7

4 years ago

2.0.6

4 years ago

2.0.5

4 years ago

2.0.4

4 years ago

2.0.3

4 years ago

2.0.2

4 years ago

2.0.1

4 years ago

2.0.0

4 years ago

1.0.12

4 years ago

1.0.11

4 years ago

1.0.10

4 years ago

1.0.9

4 years ago

1.0.8

4 years ago

1.0.6

4 years ago

1.0.2

4 years ago

1.0.1

4 years ago

1.0.0

4 years ago

0.0.1

4 years ago