Skip to content

Add "disabled" styles to Buttons #109

@jonseitz

Description

@jonseitz

Our Button and Borderless Button components both accept a "disabled" prop that gets passed to the underlying <button> element, but that only prevents the onClick handler from being fired -- it doesn't change the styling to signal to the user that the can't click the button, and the :hover and :active pseudo-classes still get applied so it just looks like something is broken.

We should, at a minimum, set cursor: not-allowed on :hover. We can also switch to a "ghosted" background/text for those buttons to provide a passive visual indicator, and one that will apply on mobile.

Metadata

Metadata

Assignees

Labels

FrontendRelates to the clientTechnical DebtCleaning up after ourselvesa11yIssues with Accessibility or Usabiltiy

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions