From 3d7d16d5411cf743b8760370357310032a04eb8c Mon Sep 17 00:00:00 2001
From: minjilee <budlalswl1129@gamil.com>
Date: Thu, 4 Aug 2022 13:13:03 +0900
Subject: [PATCH] chore: fix image

---
 src/components/CharacterImageList.tsx         | 8 ++++++--
 src/components/ResultImageList.tsx            | 6 +++++-
 src/components/UserPageCharacterImageList.tsx | 6 +++++-
 src/pages/Result.js                           | 5 +++--
 4 files changed, 19 insertions(+), 6 deletions(-)

diff --git a/src/components/CharacterImageList.tsx b/src/components/CharacterImageList.tsx
index 8bf585b..dbe2f85 100644
--- a/src/components/CharacterImageList.tsx
+++ b/src/components/CharacterImageList.tsx
@@ -121,7 +121,11 @@ function CharacterImageList({
                       checked={selectedObject.id == img.id}
                       onChange={handleClickRadioButton}
                     />
-                    <img className="h-48 w-48" alt="sample" src={img.url} />
+                    <img
+                      className="object-cover h-48 w-48"
+                      alt="sample"
+                      src={img.url}
+                    />
                   </label>
                 </div>
               ))}
@@ -185,7 +189,7 @@ function CharacterImageList({
                     />
 
                     <img
-                      className="h-48 w-48 z-10"
+                      className="object-cover h-48 w-48 z-10"
                       alt="sample"
                       src={img.url}
                     />
diff --git a/src/components/ResultImageList.tsx b/src/components/ResultImageList.tsx
index d67ee14..b2a96ce 100644
--- a/src/components/ResultImageList.tsx
+++ b/src/components/ResultImageList.tsx
@@ -69,7 +69,11 @@ function ResultImageList({ object }: ImageListProps) {
               key={img.id}
               className="col-span-1 relative justify-center bg-slate-50 border-8 border-slate-50"
             >
-              <img className="h-44 w-52 z-10" alt="sample" src={img.url} />
+              <img
+                className="object-cover h-40 w-52 z-10"
+                alt="sample"
+                src={img.url}
+              />
               <li className="flex justify-between pt-1">
                 <div className="n flex text-base text-slate-500 float-left pl-1">
                   <img
diff --git a/src/components/UserPageCharacterImageList.tsx b/src/components/UserPageCharacterImageList.tsx
index f301a7b..e0b9748 100644
--- a/src/components/UserPageCharacterImageList.tsx
+++ b/src/components/UserPageCharacterImageList.tsx
@@ -64,7 +64,11 @@ function UserPageCharacterImageList({
         {userCharacterList &&
           userCharacterList.map((img) => (
             <div className="relative w-60 h-60" key={img.id}>
-              <img className="flex h-60 w-60" alt="sample" src={img.url} />
+              <img
+                className="flex object-cover h-60 w-60"
+                alt="sample"
+                src={img.url}
+              />
 
               <button onClick={() => deleteCharacterImage(img.id)}>
                 <img
diff --git a/src/pages/Result.js b/src/pages/Result.js
index 55df510..80d985a 100644
--- a/src/pages/Result.js
+++ b/src/pages/Result.js
@@ -268,13 +268,14 @@ function Result() {
                     </p>
                     <p className="c text-slate-500 text-base ">
                       Effect to be used for mosaic processing. <br></br>If the
-                      selected effect is correct, please press NEXT button.
+                      selected effect is correct, <br />
+                      please press NEXT button.
                     </p>
                   </div>
 
                   <div className="w-80 float-right ml-56">
                     <img
-                      className="h-48 w-48 border-10 rounded border-transparent justify-center"
+                      className="h-48 w-48 object-cover border-10 rounded border-transparent justify-center"
                       alt="sample"
                       src={character.url}
                     />