Merge branch 'develop' into comment/113

components/collectionProduct/ToyPreview.tsx

@@ -18,9 +18,10 @@ export default function ToyPreview(props: ToyPreviewProps) {
   const { src, store, title, price, age, siteUrl } = props;
   const [isMark, setIsMark] = useState(false);
 
-  const handleToySite = () => {
-    window.open(siteUrl);
+  const handleToySite = (e: React.MouseEvent<HTMLElement>) => {
+    if (!(e.target instanceof SVGElement)) window.open(siteUrl);
   };
+
   const handleToyMark = () => {
     setIsMark((prev) => !prev);
   };

components/main/CollectionCard.tsx

@@ -1,9 +1,9 @@
 import styled from '@emotion/styled';
 import Router from 'next/router';
 import {
-  IcKitchenPlay,
-  IcMultiToy,
-  IcWalkingMachine,
+  IcCollectionWalk,
+  IcCollectionPeople,
+  IcCollectionPlayground,
 } from '../../public/assets/icons';
 
 interface CollectionCardProps {
@@ -22,9 +22,9 @@ export default function CollectionCard(props: CollectionCardProps) {
   };
   return (
     <StCardWrapper onClick={handleCollectionPage}>
-      {title === '쏘서, 보행기 모음' && <IcWalkingMachine />}
-      {title === '다인원 장난감 추천' && <IcKitchenPlay />}
-      {title === '주방놀이 세트' && <IcMultiToy />}
+      {title === '위고, 보행기 모음' && <IcCollectionWalk />}
+      {title === '실내 놀이터 추천' && <IcCollectionPlayground />}
+      {title === '다인원 장난감 세트' && <IcCollectionPeople />}
       <StSubTitle>{subTitle}</StSubTitle>
       <StTitle>{title}</StTitle>
     </StCardWrapper>
@@ -37,18 +37,18 @@ const StCardWrapper = styled.section`
   align-items: center;
   flex-direction: column;
 
-  width: 37.1rem;
+  width: 37.2rem;
   height: 26.5rem;
-  margin: 0rem 1.5rem 8rem;
+  margin: 0rem 1.5rem;
 
-  border-radius: 1.5rem;
+  border-radius: 1.2rem;
   background-color: ${({ theme }) => theme.colors.white};
 
-  box-shadow: 0.193473rem 0.193473rem 0.43683rem rgba(29, 185, 129, 0.3);
+  box-shadow: 1.93473px 1.93473px 48.3683px rgba(29, 185, 129, 0.3);
   cursor: pointer;
 `;
 const StSubTitle = styled.div`
-  margin-top: 1.8rem;
+  margin-top: 2.61rem;
   margin-bottom: 0.5rem;
 
   ${({ theme }) => theme.fonts.b3_16_medium_140}

components/main/ToyPreview.tsx

@@ -19,8 +19,8 @@ export default function ToyPreview(props: ToyPreviewProps) {
   const { src, store, title, price, age, siteUrl } = props;
   const [isMark, setIsMark] = useState(false);
 
-  const handleToySite = () => {
-    window.open(siteUrl);
+  const handleToySite = (e: React.MouseEvent<HTMLElement>) => {
+    if (!(e.target instanceof SVGElement)) window.open(siteUrl);
   };
 
   const handleToyMark = () => {

components/viewProduct/ToyPreview.tsx

@@ -19,8 +19,8 @@ export default function ToyPreview(props: ToyPreviewProps) {
   const { src, store, title, price, age, siteUrl } = props;
   const [isMark, setIsMark] = useState(false);
 
-  const handleToySite = () => {
-    window.open(siteUrl);
+  const handleToySite = (e: React.MouseEvent<HTMLElement>) => {
+    if (!(e.target instanceof SVGElement)) window.open(siteUrl);
   };
 
   const handleToyMark = () => {

pages/_app.tsx

@@ -7,17 +7,12 @@ import theme from '../styles/theme';
 import { SessionProvider } from 'next-auth/react';
 import { useRouter } from 'next/router';
 
-if (process.env.NEXT_PUBLIC_API_MOCKING === 'enabled') {
-  import('../mocks');
-}
-
 export default function App({
   Component,
   pageProps: { session, ...pageProps },
 }: AppProps) {
   const { pathname } = useRouter();
 
-  // 안녕 진짜 너무 좋다 갈축 최고
   return (
     <RecoilRoot>
       <ThemeProvider theme={theme}>

pages/index.tsx

@@ -10,15 +10,15 @@ import { ToyList } from '../components/main';
 export default function main() {
   const collection = [
     {
-      title: '쏘서, 보행기 모음',
-      subTitle: '우리아이 걸음마를 위한',
+      title: '위고, 보행기 모음',
+      subTitle: '우리 아이 걸음마를 위한',
     },
     {
-      title: '주방놀이 세트',
-      subTitle: '오감 발달 아이들이 좋아하는',
+      title: '실내 놀이터 추천',
+      subTitle: '날씨 걱정 없는 우리 집',
     },
     {
-      title: '다인원 장난감 추천',
+      title: '다인원 장난감 세트',
       subTitle: '친구들과 함께',
     },
   ];
@@ -73,7 +73,8 @@ const StConceptArticle = styled.article`
 `;
 const StCollectionArticle = styled.article`
   width: 100%;
-  margin-top: 8.9rem;
+  height: 47.9rem;
+  margin-top: 8.4rem;
 
   background-color: ${({ theme }) => theme.colors.lightGreen};
 `;