From 701c176bf384282523ad3c4f43b0b1f087193967 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?L=C3=A9o=20Galley?= <contact@kirkas.ch>
Date: Thu, 15 Aug 2024 14:30:08 -0400
Subject: [PATCH] fix: added min height/width and object fit cover to avatar
 (#1058)

---
 .changeset/afraid-tips-whisper.md          | 4 ++++
 src/identity/components/Avatar.stories.tsx | 2 +-
 src/identity/components/Avatar.tsx         | 1 +
 3 files changed, 6 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/afraid-tips-whisper.md

diff --git a/.changeset/afraid-tips-whisper.md b/.changeset/afraid-tips-whisper.md
new file mode 100644
index 0000000000..d8c5571e60
--- /dev/null
+++ b/.changeset/afraid-tips-whisper.md
@@ -0,0 +1,4 @@
+---
+"@coinbase/onchainkit": minor
+---
+**fix**: Modify `Avatar` component to handle images with varying height/width ratio. By @kirkas #1058
\ No newline at end of file
diff --git a/src/identity/components/Avatar.stories.tsx b/src/identity/components/Avatar.stories.tsx
index ad99d4d98a..2b08731f3c 100644
--- a/src/identity/components/Avatar.stories.tsx
+++ b/src/identity/components/Avatar.stories.tsx
@@ -73,7 +73,7 @@ export const WithBadge: Story = {
 
 export const Base: Story = {
   args: {
-    address: '0xFd3d8ffE248173B710b4e24a7E75ac4424853503',
+    address: '0x8c8F1a1e1bFdb15E7ed562efc84e5A588E68aD73',
     chain: base,
   },
 };
diff --git a/src/identity/components/Avatar.tsx b/src/identity/components/Avatar.tsx
index a7431bef6b..555a7ac2c0 100644
--- a/src/identity/components/Avatar.tsx
+++ b/src/identity/components/Avatar.tsx
@@ -74,6 +74,7 @@ export function Avatar({
         {/* biome-ignore lint: alt gets assigned */}
         {displayAvatarImg ? (
           <img
+            className="min-h-full min-w-full object-cover"
             data-testid="ockAvatar_Image"
             loading="lazy"
             width="100%"