From 7008e507cfe0730ccedfa82a80f28d8073c9100a Mon Sep 17 00:00:00 2001 From: Yugyeong Park Date: Tue, 18 Jun 2024 02:58:27 +0900 Subject: [PATCH 1/5] =?UTF-8?q?=EC=84=9C=EB=B8=8C=20=EC=B9=B4=ED=85=8C?= =?UTF-8?q?=EA=B3=A0=EB=A6=AC=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C=20=ED=95=B4?= =?UTF-8?q?=EB=8B=B9=20=EC=83=81=ED=92=88=20=EC=B6=9C=EB=A0=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/Shop/Shop.jsx | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/src/Shop/Shop.jsx b/src/Shop/Shop.jsx index 20bd327..b5cbba9 100644 --- a/src/Shop/Shop.jsx +++ b/src/Shop/Shop.jsx @@ -7,6 +7,7 @@ import "./Shop.css"; const Shop = ({ isLoggedIn }) => { const [selectedCategory, setSelectedCategory] = useState(null); + const [selectedSubCategory, setSelectedSubCategory] = useState(null); const [selectedItem, setSelectedItem] = useState(null); //const navigate = useNavigate(); @@ -42,6 +43,7 @@ const Shop = ({ isLoggedIn }) => { const handleCategoryClick = (category) => { setSelectedCategory(category); + setSelectedSubCategory(null); // 카테고리를 클릭하면 선택된 서브카테고리 초기화 setSelectedItem(null); // 카테고리를 클릭하면 선택된 아이템을 초기화 }; @@ -49,6 +51,11 @@ const Shop = ({ isLoggedIn }) => { setSelectedItem(item); }; + const handleSubCategoryClick = (subCategory) => { + setSelectedSubCategory(subCategory); // 서브카테고리 설정 + setSelectedItem(null); // 서브카테고리를 클릭하면 선택된 아이템 초기화 + }; + const handleAddToCart = async (name, amount) => { if (!isLoggedIn) { alert('로그인을 해주세요.'); @@ -122,7 +129,7 @@ const Shop = ({ isLoggedIn }) => {
handleItemClick(item)} + onClick={() => handleSubCategoryClick(item.name)} > {item.name}
@@ -141,6 +148,12 @@ const Shop = ({ isLoggedIn }) => { onAddToCart={handleAddToCart} isLoggedIn={isLoggedIn} /> + ) : selectedSubCategory ? ( + allItems.filter(item => item.name === selectedSubCategory).map(item => ( +
+ {item.name} handleItemClick(item)} /> +
+ )) ) : selectedCategory ? ( categories[selectedCategory].map(item => (
From d06c8d16da7b4dcdbd3f95d0731b3f796b178a6e Mon Sep 17 00:00:00 2001 From: Yugyeong Park Date: Tue, 18 Jun 2024 03:20:36 +0900 Subject: [PATCH 2/5] =?UTF-8?q?SignIn=20hover=20=EC=83=89=EC=83=81=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/Sign/components/DontHave.css | 2 +- src/Sign/components/SignInBackToHome.css | 2 +- src/Sign/components/SignInButton.css | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/Sign/components/DontHave.css b/src/Sign/components/DontHave.css index b32c960..0c3a5a8 100644 --- a/src/Sign/components/DontHave.css +++ b/src/Sign/components/DontHave.css @@ -28,5 +28,5 @@ } .signup:hover { - color: #ff9500; + color: #4C6CD3; } \ No newline at end of file diff --git a/src/Sign/components/SignInBackToHome.css b/src/Sign/components/SignInBackToHome.css index 8122c0f..2fa6121 100644 --- a/src/Sign/components/SignInBackToHome.css +++ b/src/Sign/components/SignInBackToHome.css @@ -25,5 +25,5 @@ } .SignInBackToHome:hover .SignInBackToHome-text { - color: #ff9500; + color: #4C6CD3; } \ No newline at end of file diff --git a/src/Sign/components/SignInButton.css b/src/Sign/components/SignInButton.css index 5dedd85..66af512 100644 --- a/src/Sign/components/SignInButton.css +++ b/src/Sign/components/SignInButton.css @@ -17,7 +17,7 @@ } .signin-button:hover { - background-color: #1f3a82; + background-color: #4C6CD3; } .text-wrapper { From 9c7eec0ef1dfd883290aaa446ff204741863aa15 Mon Sep 17 00:00:00 2001 From: Yugyeong Park Date: Tue, 18 Jun 2024 03:21:24 +0900 Subject: [PATCH 3/5] =?UTF-8?q?SignUp=20hover=20=EC=83=89=EC=83=81=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/Sign/SignUp.css | 2 +- src/Sign/components/AlreadyHave.css | 4 ++-- src/Sign/components/SignUpBackToHome.css | 4 ++-- src/Sign/components/SignUpButton.css | 4 ++-- 4 files changed, 7 insertions(+), 7 deletions(-) diff --git a/src/Sign/SignUp.css b/src/Sign/SignUp.css index 672c613..718decc 100644 --- a/src/Sign/SignUp.css +++ b/src/Sign/SignUp.css @@ -116,7 +116,7 @@ body { } .signin-link span { - color: #2845a3; + color: #0099DA; cursor: pointer; } diff --git a/src/Sign/components/AlreadyHave.css b/src/Sign/components/AlreadyHave.css index a084301..30ca109 100644 --- a/src/Sign/components/AlreadyHave.css +++ b/src/Sign/components/AlreadyHave.css @@ -22,11 +22,11 @@ } .signin { - color: #2845a3; + color: #0099DA; cursor: pointer; /* 클릭 가능하게 변경 */ } .signin:hover { - color: #ff9500; + color: #3AC4FF; } \ No newline at end of file diff --git a/src/Sign/components/SignUpBackToHome.css b/src/Sign/components/SignUpBackToHome.css index e29604d..e6fb41b 100644 --- a/src/Sign/components/SignUpBackToHome.css +++ b/src/Sign/components/SignUpBackToHome.css @@ -6,7 +6,7 @@ height: 37px; text-align: center; font-size: 20px; - color: #2845a3; + color: #0099DA; font-family: Kanit; } @@ -25,5 +25,5 @@ } .backToHome:hover .backToHome-text { - color: #ff9500; + color: #3AC4FF; } \ No newline at end of file diff --git a/src/Sign/components/SignUpButton.css b/src/Sign/components/SignUpButton.css index 9edec82..75da1bb 100644 --- a/src/Sign/components/SignUpButton.css +++ b/src/Sign/components/SignUpButton.css @@ -1,7 +1,7 @@ @import url('https://fonts.googleapis.com/css2?family=Bowlby+One&display=swap'); .signup-button { - background-color: #2845a3; + background-color: #0099DA; border-radius: 17px; height: 40px; width: 370px; @@ -13,7 +13,7 @@ } .signup-button:hover { - background-color: #1f3a82; + background-color: #3AC4FF; } .text-wrapper { From a605de98d59c3cf262ece121882acd419cb8d30a Mon Sep 17 00:00:00 2001 From: Yugyeong Park Date: Tue, 18 Jun 2024 03:22:08 +0900 Subject: [PATCH 4/5] =?UTF-8?q?Shop=20=EC=B9=B4=ED=85=8C=EA=B3=A0=EB=A6=AC?= =?UTF-8?q?=EC=97=90=20hover=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/Shop/Shop.css | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/Shop/Shop.css b/src/Shop/Shop.css index c83fa37..b2cfbc9 100644 --- a/src/Shop/Shop.css +++ b/src/Shop/Shop.css @@ -52,6 +52,10 @@ cursor: pointer; } +.category-title:hover { + color: #ff9500; +} + .category-items { font-family: 'Baloo 2', Helvetica, sans-serif; display: flex; @@ -67,6 +71,10 @@ margin: 5px; } +.category-item:hover { + color: #ff9500; +} + .gallery { display: flex; flex-wrap: wrap; From 50eafdc68902d82bb661ce4cc2fdc0ec92402aa1 Mon Sep 17 00:00:00 2001 From: Yugyeong Park Date: Tue, 18 Jun 2024 03:22:58 +0900 Subject: [PATCH 5/5] =?UTF-8?q?SignIn=EA=B3=BC=20SignUp=20css=20=EC=B6=A9?= =?UTF-8?q?=EB=8F=8C=20=EB=B0=A9=EC=A7=80=EB=A5=BC=20=EC=9C=84=ED=95=9C=20?= =?UTF-8?q?=EB=8B=A4=EC=A4=91=20class=EB=A1=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/Sign/SignUp.css | 28 ++++++++++++++-------------- 1 file changed, 14 insertions(+), 14 deletions(-) diff --git a/src/Sign/SignUp.css b/src/Sign/SignUp.css index 718decc..ba4bf98 100644 --- a/src/Sign/SignUp.css +++ b/src/Sign/SignUp.css @@ -35,7 +35,7 @@ body { } -.input-container { +.signup-container .input-container { width: 100%; max-width: 370px; text-align: center; @@ -44,65 +44,65 @@ body { align-items: center; } -.back-home { +.signup-container .back-home { position: absolute; top: 20px; left: 20px; - color: #2845a3; + color: #0099DA; cursor: pointer; } -.header { +.signup-container .header { display: flex; align-items: center; margin-bottom: 20px; /* clownfish와 signin 텍스트 사이의 간격 */ } -.clownfish { +.signup-container .clownfish { width: 30px; margin-right: 10px; /* 왼쪽으로 이동시키는 대신 오른쪽 마진 추가 */ } -.finding-nemo-text { - color: #2845a3; +.signup-container .finding-nemo-text { + color: #0099DA; font-family: 'Luckiest Guy', sans-serif; font-size: 1.5em; } -.signup-text { +.signup-container .signup-text { font-size: 50px !important; margin-top: -10px; margin-bottom: 20px; margin-left: -220px; } -.signup-form { +.signup-container .signup-form { display: flex; flex-direction: column; width: 100%; } -.input-label { +.signup-container .input-label { margin-top: 10px; - color: #2845a3; + color: #0099DA; font-size: 15px; text-align: left; } -.input-box { +.signup-container .input-box { height: 20px; padding: 10px; margin-top: 7px; - border: 1px solid #2845a3; + border: 1px solid #0099DA; border-radius: 10px; } .signup-button { height: 50px; margin-top: 55px; - background-color: #2845a3; + background-color: #0099DA; color: white; border: none; border-radius: 10px;