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

UX-284 Darken button hover background colors #564

Merged
merged 4 commits into from
Aug 3, 2020
Merged

UX-284 Darken button hover background colors #564

merged 4 commits into from
Aug 3, 2020

Conversation

jonambas
Copy link
Contributor

@jonambas jonambas commented Jul 27, 2020

What Changed

  • Darkens background hover colors for outline outlineBorder and flat buttons

How To Test or Verify

  • Run storybook and visit the button color story

PR Checklist

  • Add the correct type label
  • Pull request approval from #uxfe or #design-guild

@codecov
Copy link

codecov bot commented Jul 27, 2020

Codecov Report

Merging #564 into main will not change coverage.
The diff coverage is 100.00%.

Impacted file tree graph

@@           Coverage Diff           @@
##             main     #564   +/-   ##
=======================================
  Coverage   93.30%   93.30%           
=======================================
  Files         118      118           
  Lines        1568     1568           
=======================================
  Hits         1463     1463           
  Misses        105      105           
Impacted Files Coverage Δ
...ges/matchbox/src/components/ThemeProvider/theme.js 100.00% <ø> (ø)
packages/matchbox/src/components/Button/styles.js 100.00% <100.00%> (ø)

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update f32ceee...e2b51c4. Read the comment docs.

Copy link
Contributor

@logansparlin logansparlin left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good, just one question

lightHoverColor = tokens.color_gray_100;
color = props.theme.colors.gray['900'];
darkHoverColor = props.theme.colors.gray['1000'];
lightActiveColor = props.theme.colors.gray['400'];
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do blue and red also need to be 2 steps darker than they were before?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I kind of just eyeballed it, it seemed a little too light at first. What do you think?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think they're good how they are

Copy link
Contributor

@logansparlin logansparlin left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good!

@jonambas jonambas merged commit aa954d3 into main Aug 3, 2020
@jonambas jonambas deleted the UX-284 branch August 3, 2020 15:37
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants