Button

Package name:

fifthtry.github.io/button

License:

Open Source BSD

Demo

PRIMARY

-- button.button: PRIMARY
role: primary
large: true
link: index.html

Lang:

ftd

SECONDARY

-- button.button: SECONDARY
role: secondary
large: true
link: index.html

Lang:

ftd

TERTIARY

-- button.button: TERTIARY
role: tertiary
large: true
link: index.html

Lang:

ftd

PRIMARY

-- button.button: PRIMARY
role: primary
extra-large: true
link: index.html

Lang:

ftd

SECONDARY

-- button.button: SECONDARY
role: secondary
extra-large: true
link: index.html

Lang:

ftd

TERTIARY

-- button.button: TERTIARY
role: tertiary
extra-large: true
link: index.html

Lang:

ftd

PRIMARY

-- button.button: PRIMARY
role: primary
medium: true
link: index.html

Lang:

ftd

SECONDARY

-- button.button: SECONDARY
role: secondary
medium: true
link: index.html

Lang:

ftd

TERTIARY

-- button.button: TERTIARY
role: tertiary
medium: true
link: index.html

Lang:

ftd

PRIMARY

-- button.button: PRIMARY
role: primary
small: true
link: index.html

Lang:

ftd

SECONDARY

-- button.button: SECONDARY
role: secondary
small: true
link: index.html

Lang:

ftd

TERTIARY

-- button.button: TERTIARY
role: tertiary
small: true
link: index.html

Lang:

ftd

Large Button disabled without icon:

BUTTON

-- button.button: BUTTON
role: primary
large: true
disabled: true

Lang:

ftd

Large Button disabled without icon:

BUTTON

-- button.button: BUTTON
role: secondary
large: true
disabled: true

Lang:

ftd

Large Button disabled without icon:

BUTTON

-- button.button: BUTTON
role: tertiary
large: true
disabled: true

Lang:

ftd

How to use button

To use button components on your fastn web project, add below into FASTN.ftd file:

-- fastn.dependency: fifthtry.github.io/button

Lang:

ftd

Now import button inside your .ftd file

-- import: fifthtry.github.io/button

Lang:

ftd

Use button.button inside your .ftd files

Input

-- button.button: PRIMARY
role: primary
large: true
link: index.html

Lang:

ftd

Output

PRIMARY