Common NoRedInk buttons. For accessibility purposes, buttons that perform an
action on the current page should be HTML <button> elements and are created here
with *Button functions. Buttons that take the user to a new page should be
HTML <a> elements and are created here with *Link functions. Both versions
should be able to use the same CSS class in all cases.
There will generally be a *Button and *Link version of each button style.
(These will be created as they are needed.)
ButtonContent, often changes based on ButtonState. For example, a button in the "Success" state may have a different label than a button in the "Error" state
Sizes for buttons that have button classes
NOTE: if you add a size here, you need to add Css styles using the sizeStyle helper in the styles definition.
Describes the state of a button. Has consequences for appearance and disabled attribute.
Styleguide-approved styles for your buttons!
Note on borderless buttons: A borderless button that performs an action on the current page This button is intended to look like a link. Only use a borderless button when the clickable text in question follows the same layout/margin/padding as a bordered button
<button> ButtonsA delightful button which can trigger an effect when clicked!
This button will trigger the passed-in message if the button state is:
This button will be Disabled if the button state is:
Required CSS styles for
Nri.Ui.Button.