asset의 폴더 구조를 정리하고 파일 이름을 수정한다. (#142)

frontend/src/Router.tsx

@@ -3,7 +3,7 @@ import { createBrowserRouter } from 'react-router-dom';
 import { ROUTE_PATH } from '@/constants/routePath';
 import CategoryChoosePage from '@/pages/CategoryChoosePage';
 import ChecklistListPage from '@/pages/ChecklistListPage';
-import ChecklistPreviewPage from '@/pages/ChecklistSummaryPage';
+import ChecklistSummaryPage from '@/pages/ChecklistSummaryPage';
 import NewChecklistPage from '@/pages/NewChecklistPage/NewChecklistPage';
 import NotFound from '@/pages/NotFound';
 import RoomComparePage from '@/pages/RoomComparePage';
@@ -18,7 +18,7 @@ const router = createBrowserRouter([
     path: ROUTE_PATH.checklistList,
   },
   {
-    element: <ChecklistPreviewPage />,
+    element: <ChecklistSummaryPage />,
     path: '/checklists/:id',
   },
   {

frontend/src/assets/assets.tsx

@@ -1,47 +1,50 @@
 /* Arrow */
-import ArrowBack from '@/assets/arrow-back.svg';
-import InputRequiredDot from '@/assets/input-required-dot.svg';
+import ArrowBack from '@/assets/icons/arrow/arrow-back.svg';
+import ArrowDownSmall from '@/assets/icons/arrow/arrow-down-small.svg';
+import ArrowRightGreen from '@/assets/icons/arrow/arrow-right-green.svg';
+import ArrowRightYellow from '@/assets/icons/arrow/arrow-right-yellow.svg';
+import ArrowUpSmall from '@/assets/icons/arrow/arrow-up-small.svg';
 
-/* face icon */
-import ArrowDownSmall from '@/assets/arrow-down-small.svg';
-import ArrowRightGreen from '@/assets/arrow-right-green.svg';
-import ArrowUpSmall from '@/assets/arrow-up-small.svg';
-import XIcon from '@/assets/delete.svg';
-import ArrowRightYellow from '@/assets/icons/arrow-right-yellow.svg';
+/*common-icons */
+import CheckIcon from '@/assets/icons/check.svg';
+import CloseIcon from '@/assets/icons/close.svg';
+import XIcon from '@/assets/icons/delete.svg';
+import LocationLineIcon from '@/assets/icons/location-lined.svg';
+import Plus from '@/assets/icons/plus.svg';
 
 /* face icon */
-import FaceIconBadGray from '@/assets/face-icon/face-icon-bad-gray.svg';
-import FaceIconBad from '@/assets/face-icon/face-icon-bad.svg';
-import FaceIconGoodGray from '@/assets/face-icon/face-icon-good-gray.svg';
-import FaceIconGood from '@/assets/face-icon/face-icon-good.svg';
-import FaceIconSosoGray from '@/assets/face-icon/face-icon-soso-gray.svg';
-import FaceIconSoso from '@/assets/face-icon/face-icon-soso.svg';
-import Plus from '@/assets/plus.svg';
+import FaceIconBadGray from '@/assets/icons/face-icon/face-icon-bad-gray.svg';
+import FaceIconBad from '@/assets/icons/face-icon/face-icon-bad.svg';
+import FaceIconGoodGray from '@/assets/icons/face-icon/face-icon-good-gray.svg';
+import FaceIconGood from '@/assets/icons/face-icon/face-icon-good.svg';
+import FaceIconSosoGray from '@/assets/icons/face-icon/face-icon-soso-gray.svg';
+import FaceIconSoso from '@/assets/icons/face-icon/face-icon-soso.svg';
+
 /* logos */
-import ChecklistLogoActive from '@/assets/logos/checklist-logo-active.svg';
-import ChecklistLogo from '@/assets/logos/checklist-logo.svg';
-import HomeLogoActive from '@/assets/logos/home-logo-active.svg';
-import HomeLogo from '@/assets/logos/home-logo.svg';
-import LocationLogoActive from '@/assets/logos/location-logo-active.svg';
-import LocationLogo from '@/assets/logos/location-logo.svg';
-import MyPageLogoActive from '@/assets/logos/my-page-logo-active.svg';
-import MyPageLogo from '@/assets/logos/my-page-logo.svg';
-/*common-icons */
-import CheckIcon from '@/assets/check.svg';
+import ChecklistLogoActive from '@/assets/icons/footer-icon/checklist-logo-active.svg';
+import ChecklistLogo from '@/assets/icons/footer-icon/checklist-logo.svg';
+import HomeLogoActive from '@/assets/icons/footer-icon/home-logo-active.svg';
+import HomeLogo from '@/assets/icons/footer-icon/home-logo.svg';
+import LocationLogoActive from '@/assets/icons/footer-icon/location-logo-active.svg';
+import LocationLogo from '@/assets/icons/footer-icon/location-logo.svg';
+import MyPageLogoActive from '@/assets/icons/footer-icon/my-page-logo-active.svg';
+import MyPageLogo from '@/assets/icons/footer-icon/my-page-logo.svg';
 
 /* etc */
 import BangBangIcon from '@/assets/icons/bang-bang-icon.svg';
-import CloseIcon from '@/assets/icons/close.svg';
+import InputRequiredDot from '@/assets/icons/input-required-dot.svg';
 import LampIcon from '@/assets/icons/lamp-icon.svg';
-import LocationLineIcon from '@/assets/icons/location-lined.svg';
-import QuestionDot from '@/assets/question-dot.svg';
+import BangGgoodTextIcon from '@/assets/icons/logo.svg';
+import QuestionDot from '@/assets/icons/question-dot.svg';
+
 export {
   ArrowBack,
   ArrowDownSmall,
   ArrowRightGreen,
   ArrowRightYellow,
   ArrowUpSmall,
   BangBangIcon,
+  BangGgoodTextIcon,
   CheckIcon,
   ChecklistLogo,
   ChecklistLogoActive,

frontend/src/components/common/Accordion/AccordionBody.tsx

@@ -23,8 +23,7 @@ const Container = styled.div<{ isOpen: boolean }>`
   overflow: hidden;
 
   height: ${({ isOpen }) => (isOpen ? 'auto' : '0')};
-
-  /* margin-top: ${({ isOpen }) => (isOpen ? '10px' : '0')}; */
+  margin-top: ${({ isOpen }) => (isOpen ? '10px' : '0')};
 
   background-color: ${({ theme }) => theme.palette.white};
   transition: max-height 0.3s cubic-bezier(0.15, 0.1, 0.25, 1);

frontend/src/components/common/Header/Header.tsx

@@ -2,8 +2,7 @@ import styled from '@emotion/styled';
 import { ReactNode } from 'react';
 import { useNavigate } from 'react-router-dom';
 
-import ArrowBack from '@/assets/arrow-back.svg';
-import Logo from '@/assets/logo.svg';
+import { ArrowBack, BangGgoodTextIcon } from '@/assets/assets';
 import { linkDecorator } from '@/components/common/Footer/Footer';
 import { flexCenter, title2 } from '@/styles/common';
 
@@ -75,7 +74,7 @@ const S = {
 };
 
 const Header = Object.assign(HeaderWrapper, {
-  Logo: linkDecorator(Logo, '/'),
+  Logo: linkDecorator(BangGgoodTextIcon, '/'),
   Backward: (props: React.SVGProps<SVGSVGElement>) => {
     const navigate = useNavigate();
     const handleClick = () => navigate(-1);

frontend/src/components/common/OptionButton/OptionIcon.tsx

@@ -1,31 +1,31 @@
-import AirconditionerFilled from '@/assets/options/airconditioner-filled.svg';
-import AirconditionerUnfilled from '@/assets/options/airconditioner-unfilled.svg';
-import BedFilled from '@/assets/options/bed-filled.svg';
-import BedUnfilled from '@/assets/options/bed-unfilled.svg';
-import ClosetFilled from '@/assets/options/closet-filled.svg';
-import ClosetUnfilled from '@/assets/options/closet-unfilled.svg';
-import DeskFilled from '@/assets/options/desk-filled.svg';
-import DeskUnfilled from '@/assets/options/desk-unfilled.svg';
-import DryerFilled from '@/assets/options/dryer-filled.svg';
-import DryerUnfilled from '@/assets/options/dryer-unfilled.svg';
-import ElevatorFilled from '@/assets/options/elevator-filled.svg';
-import ElevatorUnfilled from '@/assets/options/elevator-unfilled.svg';
-import GasRangeFilled from '@/assets/options/gasrange-filled.svg';
-import GasRangeUnfilled from '@/assets/options/gasrange-unfilled.svg';
-import InternetFilled from '@/assets/options/internet-filled.svg';
-import InternetUnfilled from '@/assets/options/internet-unfilled.svg';
-import MicrowaveFilled from '@/assets/options/microwave-filled.svg';
-import MicrowaveUnfilled from '@/assets/options/microwave-unfilled.svg';
-import RefrigeratorFilled from '@/assets/options/refrigerator-filled.svg';
-import RefrigeratorUnfilled from '@/assets/options/refrigerator-unfillled.svg';
-import ShoesClosetFilled from '@/assets/options/shoescloset-filled.svg';
-import ShoesClosetUnfilled from '@/assets/options/shoescloset-unfilled.svg';
-import SinkFilled from '@/assets/options/sink-filled.svg';
-import SinkUnfilled from '@/assets/options/sink-unfilled.svg';
-import TvFilled from '@/assets/options/tv-filled.svg';
-import TvUnfilled from '@/assets/options/tv-unfilled.svg';
-import WashingMachineFilled from '@/assets/options/washingmachine-filled.svg';
-import WashingMachineUnfilled from '@/assets/options/washingmachine-unfilled.svg';
+import AirconditionerFilled from '@/assets/icons/options/airconditioner-filled.svg';
+import AirconditionerUnfilled from '@/assets/icons/options/airconditioner-unfilled.svg';
+import BedFilled from '@/assets/icons/options/bed-filled.svg';
+import BedUnfilled from '@/assets/icons/options/bed-unfilled.svg';
+import ClosetFilled from '@/assets/icons/options/closet-filled.svg';
+import ClosetUnfilled from '@/assets/icons/options/closet-unfilled.svg';
+import DeskFilled from '@/assets/icons/options/desk-filled.svg';
+import DeskUnfilled from '@/assets/icons/options/desk-unfilled.svg';
+import DryerFilled from '@/assets/icons/options/dryer-filled.svg';
+import DryerUnfilled from '@/assets/icons/options/dryer-unfilled.svg';
+import ElevatorFilled from '@/assets/icons/options/elevator-filled.svg';
+import ElevatorUnfilled from '@/assets/icons/options/elevator-unfilled.svg';
+import GasRangeFilled from '@/assets/icons/options/gasrange-filled.svg';
+import GasRangeUnfilled from '@/assets/icons/options/gasrange-unfilled.svg';
+import InternetFilled from '@/assets/icons/options/internet-filled.svg';
+import InternetUnfilled from '@/assets/icons/options/internet-unfilled.svg';
+import MicrowaveFilled from '@/assets/icons/options/microwave-filled.svg';
+import MicrowaveUnfilled from '@/assets/icons/options/microwave-unfilled.svg';
+import RefrigeratorFilled from '@/assets/icons/options/refrigerator-filled.svg';
+import RefrigeratorUnfilled from '@/assets/icons/options/refrigerator-unfillled.svg';
+import ShoesClosetFilled from '@/assets/icons/options/shoescloset-filled.svg';
+import ShoesClosetUnfilled from '@/assets/icons/options/shoescloset-unfilled.svg';
+import SinkFilled from '@/assets/icons/options/sink-filled.svg';
+import SinkUnfilled from '@/assets/icons/options/sink-unfilled.svg';
+import TvFilled from '@/assets/icons/options/tv-filled.svg';
+import TvUnfilled from '@/assets/icons/options/tv-unfilled.svg';
+import WashingMachineFilled from '@/assets/icons/options/washingmachine-filled.svg';
+import WashingMachineUnfilled from '@/assets/icons/options/washingmachine-unfilled.svg';
 
 const options = {
   airConditioner: { id: 1, filled: AirconditionerFilled, unfilled: AirconditionerUnfilled, name: '에어컨' },

frontend/src/pages/ChecklistSummaryPage.tsx

@@ -15,7 +15,7 @@ export interface addAnswerProps {
   newAnswer: number;
 }
 
-const ChecklistPreviewPage = () => {
+const ChecklistSummaryPage = () => {
   // TODO: Param 으로 변경해보기
   const location = useLocation();
   const checklistId = location.state?.id;
@@ -38,12 +38,12 @@ const ChecklistPreviewPage = () => {
         <S.Wrapper>
           <Accordion>
             {checklist?.categories?.map(category => (
-              <>
+              <div key={category.categoryId}>
                 <Accordion.header text={category.categoryName} id={category.categoryId} />
                 <Accordion.body id={category.categoryId}>
                   <ChecklistCategory type="preview" key={category.categoryId} category={category} />
                 </Accordion.body>
-              </>
+              </div>
             ))}
           </Accordion>
         </S.Wrapper>
@@ -52,7 +52,7 @@ const ChecklistPreviewPage = () => {
   );
 };
 
-export default ChecklistPreviewPage;
+export default ChecklistSummaryPage;
 
 const S = {
   Wrapper: styled.div`

frontend/src/pages/NewChecklistPage/NewChecklistInfoTemplate.tsx

@@ -114,7 +114,7 @@ const S = {
     font-size: ${({ theme }) => theme.text.size.large};
   `,
   SubmitButton: styled(Button)`
-    width: 96%;
+    width: 100%;
     border-radius: 4px;
 
     background-color: ${({ theme }) => theme.palette.yellow500};