[#46] feat - 찜페이지 찜해제/찜등록 되도록 설정

siliconValleyTeamA · Jan 16, 2021 · 21743fa · 21743fa
1 parent 913a4ed
commit 21743fa
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 2 deletions.
diff --git a/src/components/global/Project/Project.jsx b/src/components/global/Project/Project.jsx
@@ -73,7 +73,7 @@ function Project({ data, type, jjimType }) {
           <div className={cx('project-info-name')}>{data.title}</div>
           <div className={cx('project-info-price')}>
             <span className={cx('project-info-price-current')}>
-              {data.percent + '% 달성'}
+              {data.left_days + '일 남음'}
             </span>
           </div>
         </div>

diff --git a/src/components/global/Project/Project.module.scss b/src/components/global/Project/Project.module.scss
@@ -33,6 +33,20 @@
     top: 0.1rem;
     font-size: 1.2rem;
     color: $pink;
+    animation: heart;
+    animation-duration: 0.3s;
+  }
+
+  @keyframes heart {
+    0% {
+      transform: scale(1);
+    }
+    50% {
+      transform: scale(1.15);
+    }
+    100% {
+      transform: scale(1);
+    }
   }
 
   &-info {

diff --git a/src/pages/DetailPage/DetailPage.module.scss b/src/pages/DetailPage/DetailPage.module.scss
@@ -6,7 +6,7 @@
   display: flex;
   flex-direction: column;
   justify-content: center;
-  
+
   .product-details-image {
     max-width: 600px;
     border-radius: 10px;
@@ -107,6 +107,8 @@
         width: 40px;
         height: auto;
         cursor: pointer;
+        animation: heart;
+        animation-duration: 0.3s;
       }
 
       .product-details-info-options-funding {
@@ -115,6 +117,18 @@
         height: auto;
         cursor: pointer;
       }
+
+      @keyframes heart {
+        0% {
+          transform: scale(1);
+        }
+        50% {
+          transform: scale(1.15);
+        }
+        100% {
+          transform: scale(1);
+        }
+      }
     }
   }