From bd67bb13cb30635eda16c0a21c146db05f9ca72f Mon Sep 17 00:00:00 2001 From: suhyun113 <163711629+suhyun113@users.noreply.github.com> Date: Sun, 21 Sep 2025 00:43:26 +0900 Subject: [PATCH 1/9] =?UTF-8?q?chore:=20=EC=B9=B4=ED=85=8C=EA=B3=A0?= =?UTF-8?q?=EB=A6=AC=20=EC=9D=B4=EB=AF=B8=EC=A7=80=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../category_all_button_icon.svg | 11 ++++--- .../category_hobby_button_icon.svg | 16 ++++------ .../category_performance_button_icon.svg | 16 +++------- .../category_religion_button_icon.svg | 23 +++---------- .../category_sport_button_icon.svg | 32 ++----------------- .../category_study_button_icon.svg | 17 +++------- .../category_volunteer_button_icon.svg | 9 +++--- 7 files changed, 31 insertions(+), 93 deletions(-) diff --git a/frontend/src/assets/images/icons/category_button/category_all_button_icon.svg b/frontend/src/assets/images/icons/category_button/category_all_button_icon.svg index 684b705cf..a94994ab6 100644 --- a/frontend/src/assets/images/icons/category_button/category_all_button_icon.svg +++ b/frontend/src/assets/images/icons/category_button/category_all_button_icon.svg @@ -1,6 +1,7 @@ - - - - - + + + + + + diff --git a/frontend/src/assets/images/icons/category_button/category_hobby_button_icon.svg b/frontend/src/assets/images/icons/category_button/category_hobby_button_icon.svg index 280c0d80a..e50044c06 100644 --- a/frontend/src/assets/images/icons/category_button/category_hobby_button_icon.svg +++ b/frontend/src/assets/images/icons/category_button/category_hobby_button_icon.svg @@ -1,11 +1,7 @@ - - - - - - - - - - + + + + + + diff --git a/frontend/src/assets/images/icons/category_button/category_performance_button_icon.svg b/frontend/src/assets/images/icons/category_button/category_performance_button_icon.svg index 209498dcb..e484552d3 100644 --- a/frontend/src/assets/images/icons/category_button/category_performance_button_icon.svg +++ b/frontend/src/assets/images/icons/category_button/category_performance_button_icon.svg @@ -1,13 +1,5 @@ - - - - - - - - - - - - + + + + diff --git a/frontend/src/assets/images/icons/category_button/category_religion_button_icon.svg b/frontend/src/assets/images/icons/category_button/category_religion_button_icon.svg index c8b57f892..8f558c619 100644 --- a/frontend/src/assets/images/icons/category_button/category_religion_button_icon.svg +++ b/frontend/src/assets/images/icons/category_button/category_religion_button_icon.svg @@ -1,20 +1,5 @@ - - - - - - - - - - - - - - - - - - - + + + + diff --git a/frontend/src/assets/images/icons/category_button/category_sport_button_icon.svg b/frontend/src/assets/images/icons/category_button/category_sport_button_icon.svg index ecd780d9f..9f7efdfb0 100644 --- a/frontend/src/assets/images/icons/category_button/category_sport_button_icon.svg +++ b/frontend/src/assets/images/icons/category_button/category_sport_button_icon.svg @@ -1,30 +1,4 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + diff --git a/frontend/src/assets/images/icons/category_button/category_study_button_icon.svg b/frontend/src/assets/images/icons/category_button/category_study_button_icon.svg index 149a3d8f1..98aa93c0b 100644 --- a/frontend/src/assets/images/icons/category_button/category_study_button_icon.svg +++ b/frontend/src/assets/images/icons/category_button/category_study_button_icon.svg @@ -1,14 +1,5 @@ - - - - - - - - - - - - - + + + + diff --git a/frontend/src/assets/images/icons/category_button/category_volunteer_button_icon.svg b/frontend/src/assets/images/icons/category_button/category_volunteer_button_icon.svg index 4492f88e7..cf0a53ead 100644 --- a/frontend/src/assets/images/icons/category_button/category_volunteer_button_icon.svg +++ b/frontend/src/assets/images/icons/category_button/category_volunteer_button_icon.svg @@ -1,6 +1,5 @@ - - - - - + + + + From 33167fcf2db6e009598f9536c88c6a7a70ef20e7 Mon Sep 17 00:00:00 2001 From: suhyun113 <163711629+suhyun113@users.noreply.github.com> Date: Sun, 21 Sep 2025 01:22:51 +0900 Subject: [PATCH 2/9] =?UTF-8?q?style:=20=EC=B9=B4=ED=85=8C=EA=B3=A0?= =?UTF-8?q?=EB=A6=AC=20=EB=B2=84=ED=8A=BC=20=EC=97=AC=EB=B0=B1=20=EB=B0=8F?= =?UTF-8?q?=20=EC=95=84=EC=9D=B4=EC=BD=98=20=ED=81=AC=EA=B8=B0=20=EC=A1=B0?= =?UTF-8?q?=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../CategoryButtonList/CategoryButtonList.styles.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.styles.ts b/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.styles.ts index c7c96f24e..33cad5a0e 100644 --- a/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.styles.ts +++ b/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.styles.ts @@ -4,7 +4,7 @@ export const CategoryButtonContainer = styled.div` display: flex; justify-content: space-between; flex-wrap: nowrap; - margin-top: 60px; + margin-top: 32px; @media (max-width: 500px) { margin: 0 -10px; @@ -23,7 +23,7 @@ export const CategoryButton = styled.button` border: none; background: none; cursor: pointer; - padding: 8px; + padding: 8px 0px; transition: transform 0.1s ease; &:active { @@ -31,8 +31,8 @@ export const CategoryButton = styled.button` } img { - width: 36px; - height: 36px; + width: 56px; + height: 56px; transition: transform 0.2s ease; @media (max-width: 500px) { From a02569625e450d3ea1353c811de3342aa5404c46 Mon Sep 17 00:00:00 2001 From: suhyun113 <163711629+suhyun113@users.noreply.github.com> Date: Sun, 21 Sep 2025 01:30:07 +0900 Subject: [PATCH 3/9] =?UTF-8?q?chore:=20=EC=84=A0=ED=83=9D=20=EC=83=81?= =?UTF-8?q?=ED=83=9C=20=EC=B9=B4=ED=85=8C=EA=B3=A0=EB=A6=AC=20=EC=9D=B4?= =?UTF-8?q?=EB=AF=B8=EC=A7=80=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../category_button/category_all_button_icon_active.svg | 7 +++++++ .../category_button/category_hobby_button_icon_active.svg | 7 +++++++ .../category_performance_button_icon_active.svg | 5 +++++ .../category_religion_button_icon_active.svg | 5 +++++ .../category_button/category_sport_button_icon_active.svg | 4 ++++ .../category_button/category_study_button_icon_icon.svg | 5 +++++ .../category_volunteer_button_icon_active.svg | 5 +++++ 7 files changed, 38 insertions(+) create mode 100644 frontend/src/assets/images/icons/category_button/category_all_button_icon_active.svg create mode 100644 frontend/src/assets/images/icons/category_button/category_hobby_button_icon_active.svg create mode 100644 frontend/src/assets/images/icons/category_button/category_performance_button_icon_active.svg create mode 100644 frontend/src/assets/images/icons/category_button/category_religion_button_icon_active.svg create mode 100644 frontend/src/assets/images/icons/category_button/category_sport_button_icon_active.svg create mode 100644 frontend/src/assets/images/icons/category_button/category_study_button_icon_icon.svg create mode 100644 frontend/src/assets/images/icons/category_button/category_volunteer_button_icon_active.svg diff --git a/frontend/src/assets/images/icons/category_button/category_all_button_icon_active.svg b/frontend/src/assets/images/icons/category_button/category_all_button_icon_active.svg new file mode 100644 index 000000000..8de36efe3 --- /dev/null +++ b/frontend/src/assets/images/icons/category_button/category_all_button_icon_active.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/frontend/src/assets/images/icons/category_button/category_hobby_button_icon_active.svg b/frontend/src/assets/images/icons/category_button/category_hobby_button_icon_active.svg new file mode 100644 index 000000000..4ecf0d866 --- /dev/null +++ b/frontend/src/assets/images/icons/category_button/category_hobby_button_icon_active.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/frontend/src/assets/images/icons/category_button/category_performance_button_icon_active.svg b/frontend/src/assets/images/icons/category_button/category_performance_button_icon_active.svg new file mode 100644 index 000000000..dbec135e0 --- /dev/null +++ b/frontend/src/assets/images/icons/category_button/category_performance_button_icon_active.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/frontend/src/assets/images/icons/category_button/category_religion_button_icon_active.svg b/frontend/src/assets/images/icons/category_button/category_religion_button_icon_active.svg new file mode 100644 index 000000000..2e116b990 --- /dev/null +++ b/frontend/src/assets/images/icons/category_button/category_religion_button_icon_active.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/frontend/src/assets/images/icons/category_button/category_sport_button_icon_active.svg b/frontend/src/assets/images/icons/category_button/category_sport_button_icon_active.svg new file mode 100644 index 000000000..443de7d09 --- /dev/null +++ b/frontend/src/assets/images/icons/category_button/category_sport_button_icon_active.svg @@ -0,0 +1,4 @@ + + + + diff --git a/frontend/src/assets/images/icons/category_button/category_study_button_icon_icon.svg b/frontend/src/assets/images/icons/category_button/category_study_button_icon_icon.svg new file mode 100644 index 000000000..8a4bb4077 --- /dev/null +++ b/frontend/src/assets/images/icons/category_button/category_study_button_icon_icon.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/frontend/src/assets/images/icons/category_button/category_volunteer_button_icon_active.svg b/frontend/src/assets/images/icons/category_button/category_volunteer_button_icon_active.svg new file mode 100644 index 000000000..8ccc84737 --- /dev/null +++ b/frontend/src/assets/images/icons/category_button/category_volunteer_button_icon_active.svg @@ -0,0 +1,5 @@ + + + + + From 7029007173e201e32425720f6da39a534278c701 Mon Sep 17 00:00:00 2001 From: suhyun113 <163711629+suhyun113@users.noreply.github.com> Date: Sun, 21 Sep 2025 01:54:06 +0900 Subject: [PATCH 4/9] =?UTF-8?q?feat:=20=EC=B9=B4=ED=85=8C=EA=B3=A0?= =?UTF-8?q?=EB=A6=AC=20=EB=B2=84=ED=8A=BC=20=EC=84=A0=ED=83=9D=20=ED=9A=A8?= =?UTF-8?q?=EA=B3=BC=20=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ... => category_study_button_icon_active.svg} | 0 .../CategoryButtonList/CategoryButtonList.tsx | 26 ++++++++++++------- frontend/src/store/useCategoryStore.ts | 4 +-- 3 files changed, 18 insertions(+), 12 deletions(-) rename frontend/src/assets/images/icons/category_button/{category_study_button_icon_icon.svg => category_study_button_icon_active.svg} (100%) diff --git a/frontend/src/assets/images/icons/category_button/category_study_button_icon_icon.svg b/frontend/src/assets/images/icons/category_button/category_study_button_icon_active.svg similarity index 100% rename from frontend/src/assets/images/icons/category_button/category_study_button_icon_icon.svg rename to frontend/src/assets/images/icons/category_button/category_study_button_icon_active.svg diff --git a/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.tsx b/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.tsx index f9274db19..37bd1b597 100644 --- a/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.tsx +++ b/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.tsx @@ -7,6 +7,13 @@ import iconHobby from '@/assets/images/icons/category_button/category_hobby_butt import iconStudy from '@/assets/images/icons/category_button/category_study_button_icon.svg'; import iconSport from '@/assets/images/icons/category_button/category_sport_button_icon.svg'; import iconPerformance from '@/assets/images/icons/category_button/category_performance_button_icon.svg'; +import iconAllActive from '@/assets/images/icons/category_button/category_all_button_icon_active.svg'; +import iconVolunteerActive from '@/assets/images/icons/category_button/category_volunteer_button_icon_active.svg'; +import iconReligionActive from '@/assets/images/icons/category_button/category_religion_button_icon_active.svg'; +import iconHobbyActive from '@/assets/images/icons/category_button/category_hobby_button_icon_active.svg'; +import iconStudyActive from '@/assets/images/icons/category_button/category_study_button_icon_active.svg'; +import iconSportActive from '@/assets/images/icons/category_button/category_sport_button_icon_active.svg'; +import iconPerformanceActive from '@/assets/images/icons/category_button/category_performance_button_icon_active.svg'; import { useSearchStore } from '@/store/useSearchStore'; import { useSelectedCategory } from '@/store/useCategoryStore'; import { EVENT_NAME } from '@/constants/eventName'; @@ -15,20 +22,21 @@ interface Category { id: string; name: string; icon: string; + activeIcon: string } const clubCategories: Category[] = [ - { id: 'all', name: '전체', icon: iconAll }, - { id: '봉사', name: '봉사', icon: iconVolunteer }, - { id: '종교', name: '종교', icon: iconReligion }, - { id: '취미교양', name: '취미교양', icon: iconHobby }, - { id: '학술', name: '학술', icon: iconStudy }, - { id: '운동', name: '운동', icon: iconSport }, - { id: '공연', name: '공연', icon: iconPerformance }, + { id: 'all', name: '전체', icon: iconAll, activeIcon: iconAllActive }, + { id: '봉사', name: '봉사', icon: iconVolunteer, activeIcon: iconVolunteerActive }, + { id: '종교', name: '종교', icon: iconReligion, activeIcon: iconReligionActive }, + { id: '취미교양', name: '취미교양', icon: iconHobby, activeIcon: iconHobbyActive }, + { id: '학술', name: '학술', icon: iconStudy, activeIcon: iconStudyActive }, + { id: '운동', name: '운동', icon: iconSport, activeIcon: iconSportActive }, + { id: '공연', name: '공연', icon: iconPerformance, activeIcon: iconPerformanceActive }, ]; const CategoryButtonList = () => { - const { setSelectedCategory } = useSelectedCategory(); + const { selectedCategory, setSelectedCategory } = useSelectedCategory(); const trackEvent = useMixpanelTrack(); const handleCategoryClick = (category: Category) => { @@ -50,7 +58,7 @@ const CategoryButtonList = () => { key={category.id} onClick={() => handleCategoryClick(category)} > - {category.name} + {category.name} {category.name} ))} diff --git a/frontend/src/store/useCategoryStore.ts b/frontend/src/store/useCategoryStore.ts index fa8ba5f32..4298b1295 100644 --- a/frontend/src/store/useCategoryStore.ts +++ b/frontend/src/store/useCategoryStore.ts @@ -27,8 +27,6 @@ export const useCategoryStore = create()( export const useSelectedCategory = () => { const selectedCategory = useCategoryStore((state) => state.selectedCategory); - const setSelectedCategory = useCategoryStore( - (state) => state.setSelectedCategory, - ); + const setSelectedCategory = useCategoryStore((state) => state.setSelectedCategory); return { selectedCategory, setSelectedCategory }; }; From 2dcc232930a24ab5e99cc6d181e96933c0d8014e Mon Sep 17 00:00:00 2001 From: suhyun113 <163711629+suhyun113@users.noreply.github.com> Date: Sun, 21 Sep 2025 02:17:16 +0900 Subject: [PATCH 5/9] =?UTF-8?q?style:=20=ED=8F=B0=ED=8A=B8=20=EB=94=94?= =?UTF-8?q?=EC=9E=90=EC=9D=B8=20=EC=88=98=EC=A0=95=20=EB=B0=8F=20=EB=AA=A8?= =?UTF-8?q?=EB=B0=94=EC=9D=BC=20=ED=81=AC=EA=B8=B0=20=EC=A1=B0=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../CategoryButtonList.styles.ts | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.styles.ts b/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.styles.ts index 33cad5a0e..e662c81cd 100644 --- a/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.styles.ts +++ b/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.styles.ts @@ -7,8 +7,7 @@ export const CategoryButtonContainer = styled.div` margin-top: 32px; @media (max-width: 500px) { - margin: 0 -10px; - margin-top: 16px; + margin: 16px 0 12px 0; background-color: white; position: sticky; top: 56px; @@ -37,19 +36,20 @@ export const CategoryButton = styled.button` @media (max-width: 500px) { margin-top: 5px; - width: 30px; - height: 30px; + width: 40px; + height: 40px; } @media (max-width: 360px) { - width: 25px; - height: 25px; + width: 23px; + height: 23px; } } span { - font-size: 1rem; + font-size: 14px; font-weight: 500; - margin-top: 11px; + color: #787878; + margin-top: 8px; line-height: 30px; white-space: nowrap; @@ -59,7 +59,7 @@ export const CategoryButton = styled.button` } @media (max-width: 500px) { - font-size: 12px; + font-size: 10px; margin-top: 11px; line-height: normal; margin-bottom: 5px; From 0fae831db7db54b7aa00e57b8a78d4a1ddec1bca Mon Sep 17 00:00:00 2001 From: suhyun113 <163711629+suhyun113@users.noreply.github.com> Date: Sun, 21 Sep 2025 02:23:30 +0900 Subject: [PATCH 6/9] =?UTF-8?q?style:=20=EC=B9=B4=ED=85=8C=EA=B3=A0?= =?UTF-8?q?=EB=A6=AC=20=EB=B2=84=ED=8A=BC=20=EB=AA=A8=EB=B0=94=EC=9D=BC=20?= =?UTF-8?q?=ED=8F=B0=ED=8A=B8=20=ED=81=AC=EA=B8=B0=20=EB=B0=8F=20=EC=97=AC?= =?UTF-8?q?=EB=B0=B1=20=EC=A1=B0=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../CategoryButtonList/CategoryButtonList.styles.ts | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.styles.ts b/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.styles.ts index e662c81cd..243d923a3 100644 --- a/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.styles.ts +++ b/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.styles.ts @@ -35,7 +35,6 @@ export const CategoryButton = styled.button` transition: transform 0.2s ease; @media (max-width: 500px) { - margin-top: 5px; width: 40px; height: 40px; } @@ -54,19 +53,18 @@ export const CategoryButton = styled.button` white-space: nowrap; @media (max-width: 768px) { - font-size: 14px; + font-size: 12px; margin-top: 10px; } @media (max-width: 500px) { font-size: 10px; - margin-top: 11px; + margin-top: 4px; line-height: normal; - margin-bottom: 5px; } @media (max-width: 375px) { - font-size: 11px; + font-size: 8px; margin-top: 8px; line-height: normal; } From c250cd40e97e2cbb5ece5fe9d1fde152201e39c3 Mon Sep 17 00:00:00 2001 From: suhyun113 <163711629+suhyun113@users.noreply.github.com> Date: Sun, 21 Sep 2025 02:47:30 +0900 Subject: [PATCH 7/9] =?UTF-8?q?fix:=20=EB=AA=A8=EB=B0=94=EC=9D=BC=20?= =?UTF-8?q?=EC=B4=88=EC=86=8C=ED=98=95=20=EB=B7=B0=EC=97=90=EC=84=9C=20?= =?UTF-8?q?=ED=85=8D=EC=8A=A4=ED=8A=B8=20=ED=81=AC=EA=B8=B0=20=EC=9D=B4?= =?UTF-8?q?=EC=8A=88=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../CategoryButtonList/CategoryButtonList.styles.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.styles.ts b/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.styles.ts index 243d923a3..fbe645b65 100644 --- a/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.styles.ts +++ b/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.styles.ts @@ -64,8 +64,8 @@ export const CategoryButton = styled.button` } @media (max-width: 375px) { - font-size: 8px; - margin-top: 8px; + font-size: 10px; + margin-top: 2px; line-height: normal; } } From 1bf6582b3c88425711d236e857041dc036a72b54 Mon Sep 17 00:00:00 2001 From: suhyun113 <163711629+suhyun113@users.noreply.github.com> Date: Sun, 21 Sep 2025 20:59:44 +0900 Subject: [PATCH 8/9] =?UTF-8?q?refactor:=20=EC=B9=B4=ED=85=8C=EA=B3=A0?= =?UTF-8?q?=EB=A6=AC=20import=20=EA=B5=AC=EC=A1=B0=20=EA=B0=9C=EC=84=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../images/icons/category_button/index.ts | 34 +++++++++++++++++ .../CategoryButtonList/CategoryButtonList.tsx | 37 +++++++------------ 2 files changed, 47 insertions(+), 24 deletions(-) create mode 100644 frontend/src/assets/images/icons/category_button/index.ts diff --git a/frontend/src/assets/images/icons/category_button/index.ts b/frontend/src/assets/images/icons/category_button/index.ts new file mode 100644 index 000000000..3d3fa1f45 --- /dev/null +++ b/frontend/src/assets/images/icons/category_button/index.ts @@ -0,0 +1,34 @@ +import iconAll from '@/assets/images/icons/category_button/category_all_button_icon.svg'; +import iconVolunteer from '@/assets/images/icons/category_button/category_volunteer_button_icon.svg'; +import iconReligion from '@/assets/images/icons/category_button/category_religion_button_icon.svg'; +import iconHobby from '@/assets/images/icons/category_button/category_hobby_button_icon.svg'; +import iconStudy from '@/assets/images/icons/category_button/category_study_button_icon.svg'; +import iconSport from '@/assets/images/icons/category_button/category_sport_button_icon.svg'; +import iconPerformance from '@/assets/images/icons/category_button/category_performance_button_icon.svg'; +import iconAllActive from '@/assets/images/icons/category_button/category_all_button_icon_active.svg'; +import iconVolunteerActive from '@/assets/images/icons/category_button/category_volunteer_button_icon_active.svg'; +import iconReligionActive from '@/assets/images/icons/category_button/category_religion_button_icon_active.svg'; +import iconHobbyActive from '@/assets/images/icons/category_button/category_hobby_button_icon_active.svg'; +import iconStudyActive from '@/assets/images/icons/category_button/category_study_button_icon_active.svg'; +import iconSportActive from '@/assets/images/icons/category_button/category_sport_button_icon_active.svg'; +import iconPerformanceActive from '@/assets/images/icons/category_button/category_performance_button_icon_active.svg'; + +export const inactiveCategoryIcons : Record = { + all : iconAll, + volunteer : iconVolunteer, + religion : iconReligion, + hobby : iconHobby, + study : iconStudy, + sport : iconSport, + performance : iconPerformance +} + +export const activeCategoryIcons : Record = { + all : iconAllActive, + volunteer : iconVolunteerActive, + religion : iconReligionActive, + hobby : iconHobbyActive, + study : iconStudyActive, + sport : iconSportActive, + performance : iconPerformanceActive +} diff --git a/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.tsx b/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.tsx index 37bd1b597..b65f6f51d 100644 --- a/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.tsx +++ b/frontend/src/pages/MainPage/components/CategoryButtonList/CategoryButtonList.tsx @@ -1,19 +1,6 @@ import useMixpanelTrack from '@/hooks/useMixpanelTrack'; import * as Styled from './CategoryButtonList.styles'; -import iconAll from '@/assets/images/icons/category_button/category_all_button_icon.svg'; -import iconVolunteer from '@/assets/images/icons/category_button/category_volunteer_button_icon.svg'; -import iconReligion from '@/assets/images/icons/category_button/category_religion_button_icon.svg'; -import iconHobby from '@/assets/images/icons/category_button/category_hobby_button_icon.svg'; -import iconStudy from '@/assets/images/icons/category_button/category_study_button_icon.svg'; -import iconSport from '@/assets/images/icons/category_button/category_sport_button_icon.svg'; -import iconPerformance from '@/assets/images/icons/category_button/category_performance_button_icon.svg'; -import iconAllActive from '@/assets/images/icons/category_button/category_all_button_icon_active.svg'; -import iconVolunteerActive from '@/assets/images/icons/category_button/category_volunteer_button_icon_active.svg'; -import iconReligionActive from '@/assets/images/icons/category_button/category_religion_button_icon_active.svg'; -import iconHobbyActive from '@/assets/images/icons/category_button/category_hobby_button_icon_active.svg'; -import iconStudyActive from '@/assets/images/icons/category_button/category_study_button_icon_active.svg'; -import iconSportActive from '@/assets/images/icons/category_button/category_sport_button_icon_active.svg'; -import iconPerformanceActive from '@/assets/images/icons/category_button/category_performance_button_icon_active.svg'; +import { inactiveCategoryIcons, activeCategoryIcons } from '@/assets/images/icons/category_button'; import { useSearchStore } from '@/store/useSearchStore'; import { useSelectedCategory } from '@/store/useCategoryStore'; import { EVENT_NAME } from '@/constants/eventName'; @@ -21,18 +8,17 @@ import { EVENT_NAME } from '@/constants/eventName'; interface Category { id: string; name: string; - icon: string; - activeIcon: string + type: string; } const clubCategories: Category[] = [ - { id: 'all', name: '전체', icon: iconAll, activeIcon: iconAllActive }, - { id: '봉사', name: '봉사', icon: iconVolunteer, activeIcon: iconVolunteerActive }, - { id: '종교', name: '종교', icon: iconReligion, activeIcon: iconReligionActive }, - { id: '취미교양', name: '취미교양', icon: iconHobby, activeIcon: iconHobbyActive }, - { id: '학술', name: '학술', icon: iconStudy, activeIcon: iconStudyActive }, - { id: '운동', name: '운동', icon: iconSport, activeIcon: iconSportActive }, - { id: '공연', name: '공연', icon: iconPerformance, activeIcon: iconPerformanceActive }, + { id: 'all', name: '전체', type: 'all' }, + { id: '봉사', name: '봉사', type: 'volunteer' }, + { id: '종교', name: '종교', type: 'religion' }, + { id: '취미교양', name: '취미교양', type: 'hobby' }, + { id: '학술', name: '학술', type: 'study' }, + { id: '운동', name: '운동', type: 'sport' }, + { id: '공연', name: '공연', type: 'performance' }, ]; const CategoryButtonList = () => { @@ -58,7 +44,10 @@ const CategoryButtonList = () => { key={category.id} onClick={() => handleCategoryClick(category)} > - {category.name} + {category.name} {category.name} ))} From cf0eabc3a6aeefdae308b7425b18da2a0f32f22a Mon Sep 17 00:00:00 2001 From: suhyun113 <163711629+suhyun113@users.noreply.github.com> Date: Sun, 21 Sep 2025 21:11:47 +0900 Subject: [PATCH 9/9] =?UTF-8?q?refactor:=20=EC=B4=9D=EB=8F=99=EC=95=84?= =?UTF-8?q?=EB=A6=AC=EC=97=B0=ED=95=A9=ED=9A=8C=20=EC=86=8C=EA=B0=9C=20?= =?UTF-8?q?=EC=9D=B4=EB=AF=B8=EC=A7=80=20import=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/constants/CLUB_UNION_INFO.ts | 28 +++++++++-------------- 1 file changed, 11 insertions(+), 17 deletions(-) diff --git a/frontend/src/constants/CLUB_UNION_INFO.ts b/frontend/src/constants/CLUB_UNION_INFO.ts index f3e004ef9..1956391c7 100644 --- a/frontend/src/constants/CLUB_UNION_INFO.ts +++ b/frontend/src/constants/CLUB_UNION_INFO.ts @@ -1,10 +1,4 @@ -import PresidentAvatar from '@/assets/images/icons/category_button/category_all_button_icon.svg'; -import ReligionAvatar from '@/assets/images/icons/category_button/category_religion_button_icon.svg'; -import HobbyAvatar from '@/assets/images/icons/category_button/category_hobby_button_icon.svg'; -import StudyAvatar from '@/assets/images/icons/category_button/category_study_button_icon.svg'; -import VolunteerAvatar from '@/assets/images/icons/category_button/category_volunteer_button_icon.svg'; -import PerformanceAvatar from '@/assets/images/icons/category_button/category_performance_button_icon.svg'; -import SportAvatar from '@/assets/images/icons/category_button/category_sport_button_icon.svg'; +import {inactiveCategoryIcons} from '@/assets/images/icons/category_button'; export interface ClubUnionMember { id: number; @@ -15,16 +9,16 @@ export interface ClubUnionMember { } const MEMBER_AVATARS = { - PRESIDENT: PresidentAvatar, - VICE_PRESIDENT: PresidentAvatar, - SECRETARY: PresidentAvatar, - PROMOTION: PresidentAvatar, - RELIGION: ReligionAvatar, - HOBBY: HobbyAvatar, - STUDY: StudyAvatar, - VOLUNTEER: VolunteerAvatar, - PERFORMANCE: PerformanceAvatar, - SPORT: SportAvatar, + PRESIDENT: inactiveCategoryIcons.all, + VICE_PRESIDENT: inactiveCategoryIcons.all, + SECRETARY: inactiveCategoryIcons.all, + PROMOTION: inactiveCategoryIcons.all, + RELIGION: inactiveCategoryIcons.religion, + HOBBY: inactiveCategoryIcons.hobby, + STUDY: inactiveCategoryIcons.study, + VOLUNTEER: inactiveCategoryIcons.volunteer, + PERFORMANCE: inactiveCategoryIcons.performance, + SPORT: inactiveCategoryIcons.sport, }; // 개발자 가이드: description 필드는 UI가 깨지지 않도록 글자 수를 제한합니다.