Components
Button
Buttons represent actions that are available to the user.
Properties
Button()("Button")Examples
Types
Use the style attribute to set the button's type.
Button(style = _.Full())("Full") // Default valueButton(style = _.Minimal())("Minimal")Button(style = _.Ghost())("Ghost")Button(style = _.Text())("Text")Colors
Use the color attribute to set the button's color.
Button(style = _.Full(color = _.Gray0))("Gray0") // Default valueButton(style = _.Full(color = _.Primary))("Primary")Button(style = _.Full(color = _.Danger))("Danger")Button(style = _.Full(color = _.Success))("Success")Button(style = _.Full(color = _.Warning))("Warning")Button(style = _.Full(color = _.Gray9))("Gray9")Icon Button
Use the icon attribute to add an icon to the button. When no label is provided, the icon will be rendered as a square shape.
Button(style = _.Full(icon = _.Download))()Button with Icon and Label
Uses the icon attribute to add an icon to the button. The label is added as a child of the ButtonL component.
Button( style = _.Full(icon = _.Cog))("Settings")Button( style = _.Full(endIcon = _.OpenNewWindow))("Open New Window")Sizes
Use the height attribute to set the button's height. Default height is Fix32.
Button(style = _.Full(height = _.Fix24))("Fix24")Button(style = _.Full(height = _.Fix32))("Fix32") // Default valueButton(style = _.Full(height = _.Fix40))("Fix40")Pill
Use the isPill property to make the button a pill shape.
Button(style = _.Full(isPill = true))("Submit")Button(style = _.Full(isPill = true, icon = _.CommentLine))("5")Button(style = _.Full(isPill = true, icon = _.Home))()Busy
Use the isBusy attribute to set the button's busy state.
Button(style = _.Full(isBusy = true))("Button")Disabled
Use the disabled attribute to set the button's disabled state.
Button(isDisabled = true)("Button")