HexagonJS
About
InstallationCore ConceptsChangelog[Migration (1.x -> 2.x)]
Tutorials
Getting StartedPrint Styles
Demos
Component Demo Page
Css Components
BaseButtonBadgeError PagesFormInputsInput GroupLabelLayoutLogoNoticeSpinnerTable
Js Components
Alerts and MessagesAutocomplete PickerAutocompleteButton GroupCardCollapsibleColor PickerCrumbtrailData TableDate PickerDate Time PickerDrag ContainerDrawingDropdownDropdown ButtonExtended TableFile InputFluidForm BuilderInline EditableInline PickerInline SelectMenuMeterModalMore ButtonNotifyNumber PickerPaginatorPickerPivot TablePlotProgress BarSide CollapsibleSidebarSingle SelectSliderStepperSticky Table HeadersTabsTag InputTime PickerTime SliderTitlebarToggle ButtonToggleTooltipTreeVisualization Bar
Utilities
AnimateClick DetectorColor ScaleColorComponentEvent EmitterFast ClickFilterFormatInterpolateListMapMorph SectionMorphsPalettePointer EventsPreferencesRequestResize EventsSearch DomSelectSelectionSetSortTransitionUser Facing TextUtilView
Button Changelog
2.7.1
hx-btn
hx-action
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This context has been replaced by hx-primary
hx-btn
hx-btn-outline
Deprecated
The context classes for buttons have been updated to help improve UX considerations. Outline/inverted buttons have been removed as they can cause confusion.
hx-btn
hx-btn-invisible
Deprecated
This class has been updated to hx-btn-link. This retains the spacing and styles the text as a link.
hx-btn
hx-complement
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-contrast
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-disabled
Deprecated
This class has been deprecated in favour of adding the disabled attribute to the button to prevent user interaction.
hx-btn
hx-info
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-negative
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-danger
hx-btn
hx-positive
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-success
hx-btn
hx-warning
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
2.7.0
hx-btn
hx-action
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This context has been replaced by hx-primary
hx-btn
hx-btn-outline
Deprecated
The context classes for buttons have been updated to help improve UX considerations. Outline/inverted buttons have been removed as they can cause confusion.
hx-btn
hx-btn-invisible
Deprecated
This class has been updated to hx-btn-link. This retains the spacing and styles the text as a link.
hx-btn
hx-complement
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-contrast
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-disabled
Deprecated
This class has been deprecated in favour of adding the disabled attribute to the button to prevent user interaction.
hx-btn
hx-info
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-negative
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-danger
hx-btn
hx-positive
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-success
hx-btn
hx-warning
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
2.5.3
hx-btn
hx-action
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This context has been replaced by hx-primary
hx-btn
hx-btn-outline
Deprecated
The context classes for buttons have been updated to help improve UX considerations. Outline/inverted buttons have been removed as they can cause confusion.
hx-btn
hx-btn-invisible
Deprecated
This class has been updated to hx-btn-link. This retains the spacing and styles the text as a link.
hx-btn
hx-complement
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-contrast
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-disabled
Deprecated
This class has been deprecated in favour of adding the disabled attribute to the button to prevent user interaction.
hx-btn
hx-info
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-negative
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-danger
hx-btn
hx-positive
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-success
hx-btn
hx-warning
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
2.5.2
hx-btn
hx-action
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This context has been replaced by hx-primary
hx-btn
hx-btn-outline
Deprecated
The context classes for buttons have been updated to help improve UX considerations. Outline/inverted buttons have been removed as they can cause confusion.
hx-btn
hx-btn-invisible
Deprecated
This class has been updated to hx-btn-link. This retains the spacing and styles the text as a link.
hx-btn
hx-complement
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-contrast
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-disabled
Deprecated
This class has been deprecated in favour of adding the disabled attribute to the button to prevent user interaction.
hx-btn
hx-info
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-negative
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-danger
hx-btn
hx-positive
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-success
hx-btn
hx-warning
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
2.5.1
hx-btn
hx-action
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This context has been replaced by hx-primary
hx-btn
hx-btn-outline
Deprecated
The context classes for buttons have been updated to help improve UX considerations. Outline/inverted buttons have been removed as they can cause confusion.
hx-btn
hx-btn-invisible
Deprecated
This class has been updated to hx-btn-link. This retains the spacing and styles the text as a link.
hx-btn
hx-complement
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-contrast
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-disabled
Deprecated
This class has been deprecated in favour of adding the disabled attribute to the button to prevent user interaction.
hx-btn
hx-info
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-negative
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-danger
hx-btn
hx-positive
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-success
hx-btn
hx-warning
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
2.5.0
hx-btn
hx-action
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This context has been replaced by hx-primary
hx-btn
hx-btn-outline
Deprecated
The context classes for buttons have been updated to help improve UX considerations. Outline/inverted buttons have been removed as they can cause confusion.
hx-btn
hx-btn-invisible
Deprecated
This class has been updated to hx-btn-link. This retains the spacing and styles the text as a link.
hx-btn
hx-complement
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-contrast
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-disabled
Deprecated
This class has been deprecated in favour of adding the disabled attribute to the button to prevent user interaction.
hx-btn
hx-info
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-negative
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-danger
hx-btn
hx-positive
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-success
hx-btn
hx-warning
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
2.4.0
hx-btn
hx-action
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This context has been replaced by hx-primary
hx-btn
hx-btn-outline
Deprecated
The context classes for buttons have been updated to help improve UX considerations. Outline/inverted buttons have been removed as they can cause confusion.
hx-btn
hx-btn-invisible
Deprecated
This class has been updated to hx-btn-link. This retains the spacing and styles the text as a link.
hx-btn
hx-complement
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-contrast
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-disabled
Deprecated
This class has been deprecated in favour of adding the disabled attribute to the button to prevent user interaction.
hx-btn
hx-info
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-negative
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-danger
hx-btn
hx-positive
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-success
hx-btn
hx-warning
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
2.3.1
hx-btn
hx-action
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This context has been replaced by hx-primary
hx-btn
hx-btn-outline
Deprecated
The context classes for buttons have been updated to help improve UX considerations. Outline/inverted buttons have been removed as they can cause confusion.
hx-btn
hx-btn-invisible
Deprecated
This class has been updated to hx-btn-link. This retains the spacing and styles the text as a link.
hx-btn
hx-complement
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-contrast
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-disabled
Deprecated
This class has been deprecated in favour of adding the disabled attribute to the button to prevent user interaction.
hx-btn
hx-info
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-negative
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-danger
hx-btn
hx-positive
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-success
hx-btn
hx-warning
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
2.3.0
hx-btn
hx-action
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This context has been replaced by hx-primary
hx-btn
hx-btn-outline
Deprecated
The context classes for buttons have been updated to help improve UX considerations. Outline/inverted buttons have been removed as they can cause confusion.
hx-btn
hx-btn-invisible
Deprecated
This class has been updated to hx-btn-link. This retains the spacing and styles the text as a link.
hx-btn
hx-complement
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-contrast
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-disabled
Deprecated
This class has been deprecated in favour of adding the disabled attribute to the button to prevent user interaction.
hx-btn
hx-info
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-negative
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-danger
hx-btn
hx-positive
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-success
hx-btn
hx-warning
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
2.2.0
hx-btn
hx-action
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This context has been replaced by hx-primary
hx-btn
hx-btn-outline
Deprecated
The context classes for buttons have been updated to help improve UX considerations. Outline/inverted buttons have been removed as they can cause confusion.
hx-btn
hx-btn-invisible
Deprecated
This class has been updated to hx-btn-link. This retains the spacing and styles the text as a link.
hx-btn
hx-complement
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-contrast
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-disabled
Deprecated
This class has been deprecated in favour of adding the disabled attribute to the button to prevent user interaction.
hx-btn
hx-info
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-negative
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-danger
hx-btn
hx-positive
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-success
hx-btn
hx-warning
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
2.1.0
hx-btn
hx-action
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This context has been replaced by hx-primary
hx-btn
hx-btn-outline
Deprecated
The context classes for buttons have been updated to help improve UX considerations. Outline/inverted buttons have been removed as they can cause confusion.
hx-btn
hx-btn-invisible
Deprecated
This class has been updated to hx-btn-link. This retains the spacing and styles the text as a link.
hx-btn
hx-complement
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-contrast
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-disabled
Deprecated
This class has been deprecated in favour of adding the disabled attribute to the button to prevent user interaction.
hx-btn
hx-info
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-negative
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-danger
hx-btn
hx-positive
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-success
hx-btn
hx-warning
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
2.0.3
hx-btn
hx-action
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This context has been replaced by hx-primary
hx-btn
hx-btn-outline
Deprecated
The context classes for buttons have been updated to help improve UX considerations. Outline/inverted buttons have been removed as they can cause confusion.
hx-btn
hx-btn-invisible
Deprecated
This class has been updated to hx-btn-link. This retains the spacing and styles the text as a link.
hx-btn
hx-complement
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-contrast
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-disabled
Deprecated
This class has been deprecated in favour of adding the disabled attribute to the button to prevent user interaction.
hx-btn
hx-info
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-negative
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-danger
hx-btn
hx-positive
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-success
hx-btn
hx-warning
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
2.0.2
hx-btn
hx-action
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This context has been replaced by hx-primary
hx-btn
hx-btn-outline
Deprecated
The context classes for buttons have been updated to help improve UX considerations. Outline/inverted buttons have been removed as they can cause confusion.
hx-btn
hx-btn-invisible
Deprecated
This class has been updated to hx-btn-link. This retains the spacing and styles the text as a link.
hx-btn
hx-complement
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-contrast
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-disabled
Deprecated
This class has been deprecated in favour of adding the disabled attribute to the button to prevent user interaction.
hx-btn
hx-info
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-negative
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-danger
hx-btn
hx-positive
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-success
hx-btn
hx-warning
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
2.0.1
hx-btn
hx-action
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This context has been replaced by hx-primary
hx-btn
hx-btn-outline
Deprecated
The context classes for buttons have been updated to help improve UX considerations. Outline/inverted buttons have been removed as they can cause confusion.
hx-btn
hx-btn-invisible
Deprecated
This class has been updated to hx-btn-link. This retains the spacing and styles the text as a link.
hx-btn
hx-complement
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-contrast
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-disabled
Deprecated
This class has been deprecated in favour of adding the disabled attribute to the button to prevent user interaction.
hx-btn
hx-info
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-negative
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-danger
hx-btn
hx-positive
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-success
hx-btn
hx-warning
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
2.0.0
hx-flag-button
Added
Styles a button (or buttons inside a container) using the updated button styles.
Can be applied directly to a hx-btn as well as a container with buttons inside
hx-btn
hx-action
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This context has been replaced by hx-primary
hx-btn
hx-btn-outline
Deprecated
The context classes for buttons have been updated to help improve UX considerations. Outline/inverted buttons have been removed as they can cause confusion.
hx-btn
hx-btn-invisible
Deprecated
This class has been updated to hx-btn-link. This retains the spacing and styles the text as a link.
hx-btn
hx-complement
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-contrast
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-disabled
Deprecated
This class has been deprecated in favour of adding the disabled attribute to the button to prevent user interaction.
hx-btn
hx-info
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-negative
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-danger
hx-btn
hx-positive
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-success
hx-btn
hx-warning
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
1.20.0
hx-btn
hx-action
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This context has been replaced by hx-primary
hx-btn
hx-btn-outline
Deprecated
The context classes for buttons have been updated to help improve UX considerations. Outline/inverted buttons have been removed as they can cause confusion.
hx-btn
hx-btn-invisible
Deprecated
This class has been updated to hx-btn-link. This retains the spacing and styles the text as a link.
hx-btn
hx-btn-link
Added
Display a button with the style of a link but the spacing of a button to help align it with other elements and improve the hit area for touch devices.
hx-btn
hx-btn-micro
Added
The smallest type of button available. Use when there isn't enough space to fit a small or normal button.
hx-btn
hx-btn-normal
Added
The default button size. Useful for being explicit about button size.
hx-btn
hx-btn-small
Added
A small button. Use when there isn't enough space to fit a normal button.
hx-btn
hx-complement
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-contrast
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-danger
Added
A button for use when you have an action with a negative meaning, like ‘reject’ or ‘delete’.
hx-btn
hx-disabled
Deprecated
This class has been deprecated in favour of adding the disabled attribute to the button to prevent user interaction.
hx-btn
hx-info
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-negative
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-danger
hx-btn
hx-positive
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class has been replaced by hx-success
hx-btn
hx-primary
Added
A button for use when there is an action that’s more important than other ones on the page, and you want to draw the user’s attention towards it.
You can have one Primary button per screen (excluding modal dialogs).
But sometimes you shouldn’t use a Primary button at all, e.g. when all the actions on the page are very rarely used, or when all the actions are of equal importance.
hx-btn
hx-secondary
Added
A button for use inside forms to allow actions to be performed on form fields.
The secondary button should be paired with a form field. And the functionality of the secondary button should be related to the form field it’s paired with.
Like the Primary button, the Secondary button is optional - only use it if a form requires it.
hx-btn
hx-success
Added
A button for use when you have an action that has a positive meaning, like ‘approve’, or ‘confirm’.
hx-btn
hx-warning
Deprecated
The context classes for buttons have been updated to help improve UX considerations. This class will be removed in the next major release.
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
1.19.0
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
1.18.1
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
1.17.1
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
1.17.0
hx-btn
hx-btn-invert
Deprecated
#469
Renamed to hx-btn-outline
hx-btn
hx-btn-outline
Added
#469
Changed hx-btn-invert to a more sensible class name
1.13.0
hx-btn
Updated
Updated the button theme variables to allow the border colour for each button to be set independently
1.0.0
hx-btn
hx-action
Added
Added new action context class and updated default styles.
hx-btn
hx-btn-invert
Updated
Updated the invert styles for buttons to work nicer across different themes
hx-btn
hx-compliment
Removed
Use .hx-complement instead
hx-btn
hx-complement
Added
Styles the button with a color that complements the theme (light for a light theme, dark for a dark theme)
0.15.2
hx-btn
hx-btn-toggle
Removed
Moved hx.ToggleButton into it's own module (toggle-button)
hx.ToggleButtonextendsEventEmitter
Removed
Moved hx.ToggleButton into it's own module (toggle-button)
0.14.0
hx.initialiseToggleButtonsArray[ToggleButton]
Removed
This function no longer makes sense as the state of a toggle button matters and is managed by the ToggleButton class.
hx.initializeToggleButtonsArray[ToggleButton]
Removed
This function no longer makes sense as the state of a toggle button matters and is managed by the ToggleButton class.
0.13.0
hx-btn
Updated
Removed default call to hx.initializeToggleButtons. Toggle buttons must now be explicitly created with the hx.ToggleButton class.
hx.initializeToggleButtonsArray[ToggleButton]
Deprecated
This function no longer makes sense as the state of a toggle button matters and is managed by the ToggleButton class.
hx.initialiseToggleButtonsArray[ToggleButton]
Deprecated
Use hx.initializeToggleButtons(selection) instead.
0.12.10
hx.initialiseToggleButtonsArray[ToggleButton]
Deprecated
Use hx.initializeToggleButtons(selection) instead.
hx.initializeToggleButtonsArray[ToggleButton]
Added
Rename hx.initialiseToggleButtons to american spelling
hx.ToggleButtonextendsEventEmitter
Added
Added a toggle button prototype to improve the usability of toggle buttons.
0.12.3
hx-btn
Updated
Changed the top padding to make the text line up in the buttons better
0.10.0
hx-btn
hx-btn-[n]
Removed
All numbered color classes have been removed. Use the context classes instead.
hx-btn
hx-btn-negative
Removed
Use hx-negative with hx-btn instead.
hx-btn
hx-btn-positive
Removed
Use hx-positive with hx-btn instead.
hx-btn
hx-btn-warning
Removed
Use hx-warning with hx-btn instead.
0.9.0
hx-btn
hx-btn-invert
Added
Gives the button an inverted style, so that the text is colored rather than the background.
hx-btn
hx-btn-[n]
Deprecated
All numbered color classes will be removed in a later version: Use the context classes instead.
hx-btn
hx-compliment
Added
Styles the button with a color that compliments the theme (light for a light theme, dark for a dark theme)
hx-btn
hx-contrast
Added
Styles the button with a contrasting color to the theme
hx-btn
hx-disabled
Added
Gives the button the style of a disabled button.
hx-btn
hx-info
Added
Styles the button to indicate that clicking it will lead to some form of documentation / information.
hx-btn
hx-btn-negative
Deprecated
Use hx-negative with hx-btn instead.
hx-btn
hx-negative
Added
Adds button styling indicative of failure, danger or something negative
hx-btn
hx-btn-positive
Deprecated
Use hx-positive with hx-btn instead.
hx-btn
hx-positive
Added
Adds button styling indicative of success, confirmation or something positive
hx-btn
hx-btn-warning
Deprecated
Use hx-warning with hx-btn instead.
hx-btn
hx-warning
Added
Adds button styling indicative of warning, to suggest the user should use caution
hx.initialiseToggleButtonsArray[ToggleButton]
Added
Initialises all toggle buttons that match the selector given