fix: Identicon visual issue (#218)

* Fix identicon visual issue * Set v2.0.1
5afe · Feb 3, 2023 · e3a1af8 · e3a1af8
1 parent 7ec9757
commit e3a1af8
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 2 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@safe-global/safe-react-components",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "Safe UI components",
   "main": "dist/index.min.js",
   "typings": "dist/index.d.ts",

diff --git a/src/components/EthHashInfo/EthHashInfo.stories.tsx b/src/components/EthHashInfo/EthHashInfo.stories.tsx
@@ -2,9 +2,10 @@ import * as React from 'react';
 
 import EthHashInfo from './';
 
-export const Main = (): React.ReactElement => {
+export const Main = ({ size }): React.ReactElement => {
   return (
     <EthHashInfo
+      avatarSize={size || null}
       showPrefix
       prefix="eth"
       address="0x40A2aCCbd92BCA938b02010E17A5b8929b49130D"
@@ -45,6 +46,10 @@ export const withCopyButton = (): React.ReactElement => {
   );
 };
 
+export const withAvatarSize = (): React.ReactElement => {
+  return <Main size={100} />;
+};
+
 export default {
   title: 'Components/EthHashInfo',
   component: Main,

diff --git a/src/components/EthHashInfo/index.tsx b/src/components/EthHashInfo/index.tsx
@@ -119,6 +119,10 @@ const AvatarContainer = styled('div')<{ size?: number }>(({ size }) => ({
   flexShrink: 0,
   width: size || '2.3em !important',
   height: size || '2.3em !important',
+  '> *': {
+    width: '100% !important',
+    height: '100% !important',
+  },
 }));
 
 const AddressContainer = styled('div')({