Skip to content

feat(Button): Add Confirm button variant

Jeremy Elder requested to merge 1115-add-affirm-button-variant into master

What does this MR do?

Adding an “confirm” button variant per #1115 (closed). This introduces a new confirm button variant that is essentially a duplicate of our current info (blue) button. Simply swapping the name would have downstream impacts, so by adding the new variant we can slowly roll out the changes.

The “confirm” button name comes from wanting to avoid color or other meaning association and connecting this with the action that is confirmation in the context it’s placed. Actions can be positive or negative, and so long as the action confirms what the user wants to happen it can be used.

The confirm button will have primary, secondary, and tertiary variants same as buttons do today.

  • This is the first step in a process to reduce the number of variants in GitLab UI.
  • This is part of the effort in gitlab-org/gitlab-services/design.gitlab.com#744 (closed) that updates button variants, positioning, placement, and hierarchy.
  • Eventually the info, warning, and success buttons will be deprecated. These variants have their roots in Bootstrap, and as we look to refine the UI reducing the number of button variants has many positive results. More discussion and exploration can be viewed in gitlab-design#1263 (closed).

The changes here also update all button examples to include the confirm variant and address button label capitalization to make it consistent with guidelines.

CleanShot_2021-01-12_at_13.58.58_2x

Does this MR meet the acceptance criteria?

Conformity

  • Code review guidelines.
  • GitLab UI's contributing guidlines.
  • If it changes a Pajamas-compliant component's look & feel, the MR has been reviewed by a UX designer.
  • If it changes GitLab UI's documentation guidelines, the MR has been reviewed by a Technical Writer.
  • If the MR changes a component's API, integration MR(s) have been opened in the following projects to ensure that the @gitlab/ui package can be upgraded quickly after the changes are released:
  • Added the ~"component:*" label(s) if applicable.

Security

N/A

Closes #1115 (closed)

Edited by Jeremy Elder

Merge request reports