m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 01:39:44 +01:00
Code

Part of #18714 for 2 files in ui\components\component-library\avatar-icon (#20038)

Browse Source
This commit is contained in:
Harsh Shukla 2023-07-25 01:28:30 +05:30 committed by GitHub
parent 0ea765ebf6
commit 24c9db5883
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 8 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
ui/components/component-library/avatar-icon/avatar-icon.js
View File

@ -4,16 +4,15 @@ import classnames from 'classnames';
import {
BorderColor,
Size,
DISPLAY,
AlignItems,
JustifyContent,
BackgroundColor,
IconColor,
TextColor,
Display,
} from '../../../helpers/constants/design-system';
import Box from '../../ui/box/box';
import { Box } from '../box';
import { IconName, Icon } from '../icon';
import { AvatarBase } from '../avatar-base';
@ -35,7 +34,7 @@ export const AvatarIcon = React.forwardRef(
<AvatarBase
ref={ref}
size={size}
display={DISPLAY.FLEX}
display={Display.Flex}
alignItems={AlignItems.center}
justifyContent={JustifyContent.center}
color={color}

10
ui/components/component-library/avatar-icon/avatar-icon.stories.js
View File

@ -1,14 +1,14 @@
import React from 'react';
import {
Size,
DISPLAY,
AlignItems,
BackgroundColor,
IconColor,
Color,
Display,
} from '../../../helpers/constants/design-system';
import Box from '../../ui/box/box';
import { Box } from '../box';
import { IconName } from '..';
@ -95,7 +95,7 @@ export const DefaultStory = Template.bind({});
DefaultStory.storyName = 'Default';
export const SizeStory = (args) => (
<Box display={DISPLAY.FLEX} alignItems={AlignItems.baseline} gap={1}>
<Box display={Display.Flex} alignItems={AlignItems.baseline} gap={1}>
<AvatarIcon {...args} size={Size.XS} />
<AvatarIcon {...args} size={Size.SM} />
<AvatarIcon {...args} size={Size.MD} />
@ -110,7 +110,7 @@ SizeStory.args = {
};
export const IconNameStory = (args) => (
<Box display={DISPLAY.FLEX} gap={1}>
<Box display={Display.Flex} gap={1}>
<AvatarIcon
color={IconColor.primaryDefault}
backgroundColor={BackgroundColor.primaryMuted}
@ -147,7 +147,7 @@ export const IconNameStory = (args) => (
IconNameStory.storyName = 'Icon Name';
export const ColorAndBackgroundColor = (args) => (
<Box display={DISPLAY.FLEX} gap={1}>
<Box display={Display.Flex} gap={1}>
<AvatarIcon
color={IconColor.primaryDefault}
backgroundColor={BackgroundColor.primaryMuted}