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

feat: Add Avatar component #1134

Merged
merged 31 commits into from
Mar 20, 2024
Merged

feat: Add Avatar component #1134

merged 31 commits into from
Mar 20, 2024

Conversation

RubenSibon
Copy link
Contributor

@RubenSibon RubenSibon commented Mar 14, 2024

Please pay extra attention to:

  • Avatar's README
  • Colours have been copied from the Badge component; the colour red has been added
  • With an empty label property the rendered label will be a user/account icon
  • Labels longer than two characters will be cut off
  • Labels are always capitalized.

Considerations:

  • Should the Avatar be an anchor or a button (and thus have interaction states)? Currently, there is no interaction at all => The avatar will be static; an anchor can be wrapped around it; interaction states should be added at a later time.
  • Should an empty label give back "n.b." or something else? Empty label will give back the user icon.

@RubenSibon RubenSibon self-assigned this Mar 14, 2024
@github-actions github-actions bot temporarily deployed to demo-DES-653-avatar March 14, 2024 16:04 Destroyed
@RubenSibon RubenSibon changed the title Feat: New Avatar component Feature: New Avatar component Mar 14, 2024
@RubenSibon RubenSibon changed the title Feature: New Avatar component feat: New Avatar component Mar 14, 2024
@RubenSibon RubenSibon marked this pull request as draft March 15, 2024 09:02
@github-actions github-actions bot temporarily deployed to demo-DES-653-avatar March 15, 2024 13:43 Destroyed
@github-actions github-actions bot temporarily deployed to demo-DES-653-avatar March 15, 2024 13:45 Destroyed
@RubenSibon
Copy link
Contributor Author

RubenSibon commented Mar 15, 2024

  • Add example story with Avatar in a Header.

packages/react/src/Avatar/Avatar.tsx Outdated Show resolved Hide resolved
packages/react/src/Avatar/Avatar.tsx Outdated Show resolved Hide resolved
packages/react/src/Avatar/Avatar.tsx Outdated Show resolved Hide resolved
packages/react/src/Avatar/Avatar.tsx Outdated Show resolved Hide resolved
packages/react/src/Avatar/Avatar.tsx Outdated Show resolved Hide resolved
packages/react/src/Avatar/Avatar.tsx Outdated Show resolved Hide resolved
packages/react/src/Avatar/Avatar.tsx Outdated Show resolved Hide resolved
packages/react/src/Avatar/Avatar.tsx Outdated Show resolved Hide resolved
packages/css/src/components/avatar/avatar.scss Outdated Show resolved Hide resolved
packages/css/src/components/avatar/avatar.scss Outdated Show resolved Hide resolved
Remove background images in favour of image and icon components; improve a11y; some simplifying and cleaning up of code.
@RubenSibon RubenSibon marked this pull request as ready for review March 15, 2024 16:37
@github-actions github-actions bot temporarily deployed to demo-DES-653-avatar March 15, 2024 16:38 Destroyed
@github-actions github-actions bot temporarily deployed to demo-DES-653-avatar March 15, 2024 17:02 Destroyed
@github-actions github-actions bot temporarily deployed to demo-DES-653-avatar March 15, 2024 17:09 Destroyed
@github-actions github-actions bot temporarily deployed to demo-DES-653-avatar March 15, 2024 17:30 Destroyed
packages/react/src/Avatar/Avatar.tsx Outdated Show resolved Hide resolved
packages/react/src/Avatar/Avatar.tsx Outdated Show resolved Hide resolved
proprietary/tokens/src/components/ams/avatar.tokens.json Outdated Show resolved Hide resolved
storybook/src/components/Avatar/Avatar.docs.mdx Outdated Show resolved Hide resolved
storybook/src/components/Avatar/Avatar.docs.mdx Outdated Show resolved Hide resolved
storybook/src/components/Avatar/Avatar.stories.tsx Outdated Show resolved Hide resolved
packages/css/src/components/avatar/avatar.scss Outdated Show resolved Hide resolved
packages/css/src/components/avatar/avatar.scss Outdated Show resolved Hide resolved
packages/css/src/components/avatar/avatar.scss Outdated Show resolved Hide resolved
packages/react/src/Avatar/Avatar.test.tsx Outdated Show resolved Hide resolved
@github-actions github-actions bot temporarily deployed to demo-DES-653-avatar March 19, 2024 09:14 Destroyed
@github-actions github-actions bot temporarily deployed to demo-DES-653-avatar March 19, 2024 16:48 Destroyed
@github-actions github-actions bot temporarily deployed to demo-DES-653-avatar March 19, 2024 17:57 Destroyed
@github-actions github-actions bot temporarily deployed to demo-DES-653-avatar March 19, 2024 18:02 Destroyed
@VincentSmedinga VincentSmedinga changed the title feat: New Avatar component feat: Add Avatar component Mar 20, 2024
@github-actions github-actions bot temporarily deployed to demo-DES-653-avatar March 20, 2024 10:08 Destroyed
@github-actions github-actions bot temporarily deployed to demo-DES-653-avatar March 20, 2024 10:10 Destroyed
@VincentSmedinga VincentSmedinga merged commit 8dec2cf into develop Mar 20, 2024
4 checks passed
@VincentSmedinga VincentSmedinga deleted the feat/DES-653-avatar branch March 20, 2024 10:30
@github-actions github-actions bot mentioned this pull request Mar 22, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

4 participants