fix: updating icon sizes inside of avatar icon component#25155
fix: updating icon sizes inside of avatar icon component#25155georgewrmarshall wants to merge 4 commits intodevelopfrom
Conversation
|
CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes. |
| - `AvatarIconSize.Xs` 16px (icon size: 10px) | ||
| - `AvatarIconSize.Sm` 24px (icon size: 15px) | ||
| - `AvatarIconSize.Md` 32px (icon size: 20px) | ||
| - `AvatarIconSize.Lg` 40px (icon size: 25px) | ||
| - `AvatarIconSize.Xl` 48px (icon size: 30px) |
| {...iconProps} | ||
| className={classnames( | ||
| 'mm-avatar-icon__icon', | ||
| `mm-avatar-icon__icon--size-${size}`, | ||
| iconProps?.className || '', | ||
| )} |
There was a problem hiding this comment.
Ensures a custom classname is still possible without overriding current icon classnames
| expect(getByTestId('xl-icon')).toHaveClass( | ||
| `mm-avatar-icon__icon--size-${AvatarIconSize.Xl}`, | ||
| ); | ||
| }); |
There was a problem hiding this comment.
Updating tests to include icon checks
| }: AvatarIconProps<C>, | ||
| ref?: PolymorphicRef<C>, | ||
| ) => { | ||
| const iconSize = avatarIconSizeToIconSize[size]; |
There was a problem hiding this comment.
No longer need the avatarIconSizeToIconSize
| export const avatarIconSizeToIconSize: Record<AvatarIconSize, IconSize> = { | ||
| [AvatarIconSize.Xs]: IconSize.Xs, | ||
| [AvatarIconSize.Sm]: IconSize.Sm, | ||
| [AvatarIconSize.Md]: IconSize.Md, | ||
| [AvatarIconSize.Lg]: IconSize.Lg, | ||
| [AvatarIconSize.Xl]: IconSize.Xl, | ||
| }; |
There was a problem hiding this comment.
No longer needed
| @import 'avatar-base/avatar-base'; | ||
| @import 'avatar-account/avatar-account'; | ||
| @import 'avatar-favicon/avatar-favicon'; | ||
| @import 'avatar-icon/avatar-icon'; |
There was a problem hiding this comment.
Adding avatar-icon stylesheet to main component-library stylesheet
|
This PR has been automatically marked as stale because it has not had recent activity in the last 60 days. It will be closed in 14 days. Thank you for your contributions. |
|
This PR was closed because there has been no follow up activity in the last 14 days. Thank you for your contributions. |
Description
This pull request updates the icon sizes in the
AvatarIconcomponent to the following specifications:xs: 10px
sm: 15px
md: 20px
lg: 25px
xl: 30px
The reason for this change is align the component with Figma
Related issues
Fixes: #25154
Manual testing steps
Screenshots/Recordings
Before
before.mov
After
after720.mov
Pre-merge author checklist
Pre-merge reviewer checklist