Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore(button): design refinements #1421

Merged
merged 10 commits into from
Jul 24, 2023
Merged

chore(button): design refinements #1421

merged 10 commits into from
Jul 24, 2023

Conversation

dancormier
Copy link
Contributor

@dancormier dancormier commented Jul 17, 2023

Note
Please don't merge before creating a plan to communicate the deprecation of muted+filled


STACKS-339

This PR implements button design refinements as part of the design vision changes to Stacks. cc @PiperLawson

How to test

Hit up the buttons docs page in the deploy preview. The buttons should match the Figma design spec at the end of this PR description. Test out combinations of light/dark and high contrast modes.

TODO

  • Remove border on filled variations
  • Remove inset shadow on filled variations
  • Darken type of muted button styles
  • Lighten border color of muted button styles
  • Deprecate muted+filled button style
  • Ensure visual regression tests pass
  • Create a plan to communicate the deprecation of muted+filled

Details about changes in this PR

  • You'll notice > 3,000 files changed. Nearly all are visual regression test baseline images, since we have > 1,000 images for button being tested against three different browsers
  • A deprecated warning has been added to the button docs for the muted+filled style and the exampled for that style in combination with loading and dropdown has been removed from the docs to discourage usage

Figma

image

@dancormier dancormier added do-not-merge Pull requests that are in progress and should not be merged yet work-in-progress A work in progress, not meant to merge labels Jul 17, 2023
@netlify
Copy link

netlify bot commented Jul 17, 2023

Deploy Preview for stacks ready!

Name Link
🔨 Latest commit 9d427f9
🔍 Latest deploy log https://app.netlify.com/sites/stacks/deploys/64b5517bd5c74500086520da
😎 Deploy Preview https://deploy-preview-1421--stacks.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@netlify
Copy link

netlify bot commented Jul 17, 2023

Deploy Preview for stacks ready!

Name Link
🔨 Latest commit 0758bb2
🔍 Latest deploy log https://app.netlify.com/sites/stacks/deploys/64bacc3f813a3d00089b5f8a
😎 Deploy Preview https://deploy-preview-1421--stacks.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@dancormier dancormier requested a review from a team July 17, 2023 16:43
We have > 1000 button test image and THE TOOLTIP TEST IMAGE FAILS. All the button ones pass. Guess I shouldn't complain!
They're not failing but it seems like a good time to update them
@dancormier dancormier marked this pull request as ready for review July 21, 2023 18:24
@PiperLawson PiperLawson merged commit 1ce1fdc into develop Jul 24, 2023
5 checks passed
@PiperLawson PiperLawson deleted the 2023-design-buttons branch July 24, 2023 13:00
@dancormier dancormier removed do-not-merge Pull requests that are in progress and should not be merged yet work-in-progress A work in progress, not meant to merge labels Aug 7, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants