/
Buttons

Buttons

React Components

Currently, no official <Button> component is defined mattermost-webapp. Most buttons are defined using inline jsx in the render() method.

Button Class Names

Button styles are inherited from the Bootstrap 3.4.1 npm package as well as Jasny Boostrap 3.1.3. Top-level class names are outlined in https://github.com/mattermost/mattermost-webapp/blob/master/sass/components/_buttons.scss but derive from the Bootstrap 3.4.1 core CSS.

Common examples:

  • btn

    • btn-primary

    • btn-cancel

    • btn-link

Examples

Primary button inside of the <ConfirmModal> component (View code on GitHub)

<button type="button" class="btn btn-primary" id="confirmModalButton"> <span>Yes, set my status to "Online"</span> </button>

Link button inside of the <ConfirmModal> component

<button type="button" class="btn btn-link btn-cancel" id="cancelModalButton"> <span>No, keep it as "Away"</span> </button>

Related content