diff --git a/src/assets/images/img_banner_reward.png b/src/assets/images/img_banner_reward.png index 2b01623..224b1ef 100644 Binary files a/src/assets/images/img_banner_reward.png and b/src/assets/images/img_banner_reward.png differ diff --git a/src/components/ProductInfo/ProductInfoStyle.ts b/src/components/ProductInfo/ProductInfoStyle.ts index b4aabb0..08b166b 100644 --- a/src/components/ProductInfo/ProductInfoStyle.ts +++ b/src/components/ProductInfo/ProductInfoStyle.ts @@ -10,6 +10,7 @@ export const productInfoContainerStyle = css` export const proudctImgLayoutStyle = css` display: flex; + gap: 1.3rem; width: 43.1rem; height: 36.8rem; `; @@ -30,7 +31,7 @@ export const productImgStyle = css` export const productDetailLayoutStyle = css` display: flex; flex-direction: column; - gap: 1.6rem; + gap: 1.5rem; width: 50.9rem; height: 39.7rem; `; @@ -179,4 +180,3 @@ export const reivewBoxStyle = css` align-items: center; height: 2rem; `; - diff --git a/src/components/orderDetail/productRecommend/productRecommendStyle.ts b/src/components/orderDetail/productRecommend/productRecommendStyle.ts index 7f6fdd1..f5ca6f7 100644 --- a/src/components/orderDetail/productRecommend/productRecommendStyle.ts +++ b/src/components/orderDetail/productRecommend/productRecommendStyle.ts @@ -22,7 +22,7 @@ export const productListContainer = css` display: flex; justify-content: space-between; width: 86.5rem; - height: 33rem; + height: 34rem; padding: 0 1.3rem; overflow: hidden; `; diff --git a/src/components/product/ProductCardStyle.ts b/src/components/product/ProductCardStyle.ts index c227fa8..2fc5129 100644 --- a/src/components/product/ProductCardStyle.ts +++ b/src/components/product/ProductCardStyle.ts @@ -8,6 +8,10 @@ export const productContainer = (theme: Theme, width: string, hoverLarge: boolea background-color: ${theme.colors.white}; border-radius: ${hoverLarge ? '12px' : '16px'}; + transition: + transform 0.2s ease-in-out, + box-shadow 0.2s ease-in-out; + &:hover { z-index: 1; @@ -18,7 +22,6 @@ export const productContainer = (theme: Theme, width: string, hoverLarge: boolea ${hoverLarge ? ` transform: scale(1.13, 1.065); - transform-origin: top center; /* 상단의 시작 지점을 고정 */ border-radius: 16px; ` : ` diff --git a/src/components/productSummary/ProductSummay.tsx b/src/components/productSummary/ProductSummay.tsx index 9256ec4..0bfdd73 100644 --- a/src/components/productSummary/ProductSummay.tsx +++ b/src/components/productSummary/ProductSummay.tsx @@ -34,7 +34,7 @@ const ProductSummay = () => (