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

Add subtle border to the avatar to match the CSS implementation #2206

Merged
merged 8 commits into from
Sep 7, 2022

Conversation

maximedegreve
Copy link
Contributor

@maximedegreve maximedegreve commented Aug 2, 2022

The avatar was missing a border compared to the css implementation.

Screenshot 2022-08-02 at 15 23 08

The change is best visible in dark modes with @colebemis's avatar.

<Avatar src="https://avatars.githubusercontent.com/u/4608155?s=100&v=4" size={50} />

Merge checklist

  • Added/updated tests
  • Added/updated documentation
  • Tested in Chrome
  • Tested in Firefox
  • Tested in Safari
  • Tested in Edge

Take a look at the What we look for in reviews section of the contributing guidelines for more information on how we review PRs.

@changeset-bot
Copy link

changeset-bot bot commented Aug 2, 2022

🦋 Changeset detected

Latest commit: bc7b85a

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@primer/react Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-actions
Copy link
Contributor

github-actions bot commented Aug 2, 2022

size-limit report 📦

Path Size
dist/browser.esm.js 76.32 KB (+0.02% 🔺)
dist/browser.umd.js 76.93 KB (+0.02% 🔺)

@maximedegreve maximedegreve temporarily deployed to github-pages August 2, 2022 13:45 Inactive
@maximedegreve maximedegreve temporarily deployed to github-pages August 2, 2022 13:56 Inactive
@maximedegreve maximedegreve temporarily deployed to needs-approval August 2, 2022 14:23 Inactive
@maximedegreve maximedegreve marked this pull request as ready for review August 2, 2022 14:27
@maximedegreve maximedegreve requested review from a team and pksjce August 2, 2022 14:27
@maximedegreve maximedegreve temporarily deployed to github-pages August 2, 2022 14:31 Inactive
@siddharthkp siddharthkp requested review from siddharthkp and removed request for pksjce August 2, 2022 15:20
@siddharthkp
Copy link
Member

siddharthkp commented Aug 2, 2022

Hi!

Do you have access to the chromatic build to make sure all the visual changes are intentional: https://www.chromatic.com/build?appId=61a90feace7802003a4d9c45&number=1009

Side note: In case you want, you can review all the different themes at once now: https://primer-6e414db3be-13348165.drafts.github.io/storybook/?path=/story/tokens-avatartoken--default-token&globals=colorScheme:all

Side note 2: You might need to update jest snapshots by running npm run test:update

@maximedegreve maximedegreve temporarily deployed to needs-approval August 2, 2022 15:40 Inactive
@maximedegreve
Copy link
Contributor Author

Hey @siddharthkp

I forgot about Chromatic, it's so good! 🥹 The visual changes look good.

I've tried to update the snapshots but I got into an error:

Screenshot 2022-08-02 at 16 39 41

@maximedegreve maximedegreve temporarily deployed to github-pages August 2, 2022 15:45 Inactive
@siddharthkp
Copy link
Member

I'm not 100% sure, but I think running npm install and npm build before updating snapshots should fix this

@maximedegreve maximedegreve temporarily deployed to github-pages August 3, 2022 16:59 Inactive
@maximedegreve maximedegreve temporarily deployed to github-pages August 4, 2022 20:34 Inactive
@maximedegreve maximedegreve temporarily deployed to github-pages August 4, 2022 20:34 Inactive
@mperrotti mperrotti temporarily deployed to github-pages September 6, 2022 17:17 Inactive
@mperrotti mperrotti temporarily deployed to github-pages September 6, 2022 17:42 Inactive
@maximedegreve maximedegreve merged commit 3a38e6e into main Sep 7, 2022
@maximedegreve maximedegreve deleted the avatar-fix branch September 7, 2022 13:25
@primer-css primer-css mentioned this pull request Sep 7, 2022
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.

3 participants