diff options
| -rw-r--r-- | packages/website/ts/@next/components/icon.tsx | 6 |
1 files changed, 3 insertions, 3 deletions
diff --git a/packages/website/ts/@next/components/icon.tsx b/packages/website/ts/@next/components/icon.tsx index 07a882246..bc0f6f47e 100644 --- a/packages/website/ts/@next/components/icon.tsx +++ b/packages/website/ts/@next/components/icon.tsx @@ -8,7 +8,7 @@ interface IconProps extends PaddingInterface { size?: 'small' | 'medium' | 'large' | number; } -export const Icon: React.FunctionComponent<Props> = (props: Props) => { +export const Icon: React.FunctionComponent<IconProps> = (props: IconProps) => { const IconSVG = Loadable({ loader: () => import(/* webpackChunkName: "icon" */`ts/@next/icons/illustrations/${props.name}.svg`), loading: () => 'Loading', @@ -21,7 +21,7 @@ export const Icon: React.FunctionComponent<Props> = (props: Props) => { ); }; -export const InlineIconWrap = styled.div` +export const InlineIconWrap = styled.div<IconProps>` margin: ${props => getCSSPadding(props.margin)}; display: flex; align-items: center; @@ -40,7 +40,7 @@ const _getSize = (size: string | number = 'small'): string => { return `${size}px`; }; -const StyledIcon = styled.figure` +const StyledIcon = styled.figure<IconProps>` width: ${props => _getSize(props.size)}; height: ${props => _getSize(props.size)}; margin: ${props => getCSSPadding(props.margin)}; |