Merge pull request #18 from gdsc-ssu/refactor/#17

[refactor] css 수정 및 조회 이동 로직 변경
gdsc-ssu · Feb 18, 2024 · 22b4187 · 22b4187
2 parents 44a672b + 7238ce9
commit 22b4187
Show file tree

Hide file tree

Showing 6 changed files with 25 additions and 11 deletions.
diff --git a/src/components/AnimalCard.jsx b/src/components/AnimalCard.jsx
@@ -56,7 +56,8 @@ const AnimalCard = ({
             careNm: careNm,
           });
           openModal();
-        }}>
+        }}
+      >
         <S.AnimalImg
           src={imgUrl}
           onError={(e) => {
@@ -84,7 +85,7 @@ const AnimalCard = ({
 const S = {
   Container: styled.div`
     margin: 10px;
-    width: calc(100% - 20px);
+    width: calc(100% - 10px);
     height: 200px;
     display: flex;
     border-radius: 20px;
@@ -103,6 +104,7 @@ const S = {
     object-fit: cover;
     border-radius: 20px 0px 0px 20px;
     margin-right: 16px;
+    cursor: pointer;
     @media screen and (max-width: 393px) {
       border-radius: 20px 0px 0px 20px;
       height: 100%;

diff --git a/src/components/DetailModal.jsx b/src/components/DetailModal.jsx
@@ -102,6 +102,7 @@ const S = {
   CloseButton: styled.img`
     /* padding: 8px; */
     float: right;
+    cursor: pointer;
   `,
 
   InImg: styled.img`

diff --git a/src/components/DetailModal2.jsx b/src/components/DetailModal2.jsx
@@ -80,7 +80,7 @@ const S = {
     align-items: center;
   `,
   Container: styled.div`
-    width: 660px;
+    width: 700px;
     height: 500px;
     display: flex;
     flex-direction: column;
@@ -117,6 +117,7 @@ const S = {
     align-self: flex-end;
     width: 5%;
     padding: 8px;
+    cursor: pointer;
     @media screen and (max-width: 393px) {
       width: 8%;
     }

diff --git a/src/pages/Registration.jsx b/src/pages/Registration.jsx
@@ -71,7 +71,7 @@ const Registration = () => {
       );
 
       console.log("Image uploaded successfully:", response.data);
-      navigate("/research");
+      navigate(`/research?${queryString}`);
     } catch (error) {
       console.log("FormData to be sent:", Array.from(formData.entries()));
 

diff --git a/src/pages/Research.jsx b/src/pages/Research.jsx
@@ -141,7 +141,13 @@ const Research = () => {
     );
   };
 
-  const kindCdList = ["all", "말티즈", "믹스견", "골든 리트리버", "진돗개"];
+  const kindCdList = [
+    "all",
+    "GoldenRetriever",
+    "Chihuahua",
+    "GermanShepherd",
+    "Beagle",
+  ];
   const [kindSelected, setKindSelected] = useState("");
 
   const handleKindCd = (e) => {
@@ -175,7 +181,8 @@ const Research = () => {
               <S.FilterButton2
                 onClick={() => {
                   setIsClick((res) => !res);
-                }}>
+                }}
+              >
                 <FaFilter />
               </S.FilterButton2>
               <div style={{ height: "16px" }}></div>
@@ -185,7 +192,8 @@ const Research = () => {
               <S.FilterButton
                 onClick={() => {
                   setIsClick((res) => !res);
-                }}>
+                }}
+              >
                 View filter search results
               </S.FilterButton>
               <div style={{ height: "10px" }}></div>
@@ -271,7 +279,8 @@ const Research = () => {
           <S.Pagenation>
             <S.PagenationButton
               onClick={goToPreviousPage}
-              disabled={currentPage === 1}>
+              disabled={currentPage === 1}
+            >
               <img
                 src="img/arrow-left.png"
                 alt="left"
@@ -283,7 +292,8 @@ const Research = () => {
             </div>
             <S.PagenationButton
               onClick={goToNextPage}
-              disabled={currentPage === totalPages}>
+              disabled={currentPage === totalPages}
+            >
               <img
                 src="img/arrow-right.png"
                 alt="right"

diff --git a/src/pages/Select.jsx b/src/pages/Select.jsx
@@ -25,7 +25,7 @@ const Select = () => {
             <S.Link2 to={`/registration?${queryString}`}>
               <S.LinkBox2
                 src={queryString === "dog" ? FoundDog : FoundCat}
-                alt="research"
+                alt="registration"
               />
             </S.Link2>
             <S.Link2 to={`/inputImage?${queryString}`}>
@@ -34,7 +34,7 @@ const Select = () => {
                 alt="research"
               />
             </S.Link2>
-            <S.Link2 to={`/registration?${queryString}`}>
+            <S.Link2 to={`/research?${queryString}`}>
               <S.LinkBox2
                 src={queryString === "dog" ? ListDog : ListCat}
                 alt="research"