From b91d91d2ba310e520bc9063e7f234a652490fc68 Mon Sep 17 00:00:00 2001
From: daniel-vahn <d.vonahn@chainsulting.de>
Date: Thu, 23 May 2024 10:22:32 +0200
Subject: [PATCH] refactor: Update Avatar component to use max-w-full for image
 width

---
 src/App.tsx                     | 7 +++++--
 src/components/utils/Avatar.tsx | 8 ++++++--
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 03ef52f..c904843 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -280,11 +280,14 @@ function App() {
                         <div className="flex flex-col bg-white pt-4 px-8 pb-2 min-h-fit gap-2 rounded-t-3xl rounded-b-xl shadow-custom-white">
                             <h2 className="headline">HORRAY!</h2>
                             <div className="text-xs break-all font-semibold text-center text-customGrayAddress">
-                                <p className="my-0 mx-auto">{account}</p>
+                                <p className="my-0 mx-auto">
+                                    {account ||
+                                        '0xcccodoiuwqbqjßq21jruß2rß120j'}
+                                </p>
                             </div>
                             <div className="flex justify-center items-center max-w-10 my-0 mx-auto">
                                 <img
-                                    className="max-h-full max-w-full"
+                                    className="h-auto max-w-full"
                                     src={etherIcon}
                                     alt=""
                                 />
diff --git a/src/components/utils/Avatar.tsx b/src/components/utils/Avatar.tsx
index 1fbc1a9..5bd07cc 100644
--- a/src/components/utils/Avatar.tsx
+++ b/src/components/utils/Avatar.tsx
@@ -6,8 +6,12 @@ type Props = {
 
 const Avatar: React.FC<Props> = ({ src }) => {
     return (
-        <div className="flex flex-grow items-center justify-center overflow-hidden max-h-96 py-4 px-8">
-            <img className="max-h-80 w-auto object-contain" src={src} alt="" />
+        <div className="flex flex-grow items-center justify-center overflow-hidden max-h-96 py-2 px-8">
+            <img
+                className="h-auto max-w-full object-contain"
+                src={src}
+                alt=""
+            />
         </div>
     );
 };