linkChoosing the right button class
btn-secondary
, btn-primary
, btn-danger
.
The use of other Bootstrap button classes such as
btn-link
, btn-warning
, btn-info
and btn-success
isn't allowed.- Use the class
btn-secondary
for actions with the same hierarchy, such as “copy”, “paste”, “crop”, etc. - Use the class
btn-primary
to represent a call-to-action, for example "save", "send", etc., in order to draw the user's attraction to this action. - Destructive actions such as "delete", "erase", "unsubscribe", etc.
should use the class
btn-secondary
, however, they require a confirmation message with the ultimate destructive action. This last step requires full attention from the user, therefore you must use the classbtn-danger
.
check_circleDo
Deleting this system cannot be reversed and all information will be lost.
linkButtons are not links
The use of the Bootstrap class btn-link
is not permitted since it blends two different concepts: buttons and links.
Links
Links should only be used to take the user to a different page or section, within or outside of the application. There should be no system action performed by clicking a link.
Buttons
A button is used to perform any action on a given page, module, or component.
An action such as next in a wizard should also use a btn-secondary
because it only moves the user to the next step of a system process in a larger component.