From 8073fe7ba31bd2eb83150a654f23ee4c65c4fd6e Mon Sep 17 00:00:00 2001 From: Hyoeunkh Date: Tue, 14 May 2024 13:43:14 +0900 Subject: [PATCH] =?UTF-8?q?refactor:=20=EA=B8=B0=EC=A1=B4=EC=BD=94?= =?UTF-8?q?=EB=93=9C=20lint=20=EB=B0=8F=20=EC=BD=94=EB=93=9C=20=ED=8F=AC?= =?UTF-8?q?=EB=A7=A4=ED=8C=85=20resolve=20#8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/display/Guest.styled.ts | 4 +- src/components/display/ShowData.tsx | 4 +- src/components/display/ShowDate.styled.ts | 2 - src/pages/BoothListPage.tsx | 2 +- src/pages/SpecialGuestPage.styled.tsx | 7 ++- src/pages/SpecialGuestPage.tsx | 65 ++++++++++++++--------- 6 files changed, 49 insertions(+), 35 deletions(-) diff --git a/src/components/display/Guest.styled.ts b/src/components/display/Guest.styled.ts index 5320e12..dce40c3 100644 --- a/src/components/display/Guest.styled.ts +++ b/src/components/display/Guest.styled.ts @@ -4,7 +4,7 @@ export const Card = styled.div` width: 290px; height: 100%; border-radius: 25px; - box-shadow: 4px 4px 5px rgba(0,0,0,25%); + box-shadow: 4px 4px 5px rgba(0, 0, 0, 25%); position: relative; overflow: hidden; scroll-snap-align: center; @@ -22,4 +22,4 @@ export const Picture = styled.img` height: 100%; object-fit: cover; object-position: 50% 50%; -`; \ No newline at end of file +`; diff --git a/src/components/display/ShowData.tsx b/src/components/display/ShowData.tsx index 719dc48..a5a6d45 100644 --- a/src/components/display/ShowData.tsx +++ b/src/components/display/ShowData.tsx @@ -1,5 +1,5 @@ -import { ShowDateContainer, ShowDateLink} from "./ShowDate.styled"; import { Paragraph } from "../typography/Paragraph"; +import { ShowDateContainer, ShowDateLink } from "./ShowDate.styled"; interface IShowDate { date: string; @@ -8,7 +8,7 @@ interface IShowDate { onClick: () => void; } export const ShowDate: React.FC = ({ date, day, active, onClick }) => { - const variant = active ? "#5D5A88" : "#adabc3" + const variant = active ? "#5D5A88" : "#adabc3"; return ( diff --git a/src/components/display/ShowDate.styled.ts b/src/components/display/ShowDate.styled.ts index 3c51d83..9beda97 100644 --- a/src/components/display/ShowDate.styled.ts +++ b/src/components/display/ShowDate.styled.ts @@ -12,5 +12,3 @@ export const ShowDateLink = styled.a` line-height: 22px; } `; - - diff --git a/src/pages/BoothListPage.tsx b/src/pages/BoothListPage.tsx index 14dc472..7a18a6b 100644 --- a/src/pages/BoothListPage.tsx +++ b/src/pages/BoothListPage.tsx @@ -34,7 +34,7 @@ const BoothListPage: React.FC = () => { {/**/} - {lists.map((name, index) => { + {lists.map((name, index) => { return ; })} diff --git a/src/pages/SpecialGuestPage.styled.tsx b/src/pages/SpecialGuestPage.styled.tsx index 3642017..555c1e0 100644 --- a/src/pages/SpecialGuestPage.styled.tsx +++ b/src/pages/SpecialGuestPage.styled.tsx @@ -7,7 +7,7 @@ export const MainContent = styled.div` align-items: center; margin-top: 10px; p { - text-shadow: 0px 4px 4px rgba(0,0,0,25%); + text-shadow: 0px 4px 4px rgba(0, 0, 0, 25%); } `; export const GuestContainer = styled.div` @@ -40,10 +40,9 @@ export const GuestCard = styled.div` overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; - scrollbar-width: none; + scrollbar-width: none; -ms-overflow-style: none; &::-webkit-scrollbar { - display: none; + display: none; } `; - diff --git a/src/pages/SpecialGuestPage.tsx b/src/pages/SpecialGuestPage.tsx index c6d78cc..10861b9 100644 --- a/src/pages/SpecialGuestPage.tsx +++ b/src/pages/SpecialGuestPage.tsx @@ -1,62 +1,79 @@ import React, { useState } from "react"; +import { BiSolidMap } from "react-icons/bi"; + import { Guest } from "@/components/display/Guest"; import { ShowDate } from "@/components/display/ShowData"; -import { MainContent, GuestCard, GuestContainer, Date } from "./SpecialGuestPage.styled"; -import { Paragraph } from "@/components/typography/Paragraph" +import { Paragraph } from "@/components/typography/Paragraph"; import { Text } from "@/components/typography/Text"; -import { BiSolidMap } from "react-icons/bi"; + +import { MainContent, GuestCard, GuestContainer, Date } from "./SpecialGuestPage.styled"; const SpecialGuestPage: React.FC = () => { - const [activeDate, setActiveDate] = useState("5.22"); + const [activeDate, setActiveDate] = useState("5.22"); - const handleDateClick = (date: string) => { + const handleDateClick = (date: string) => { setActiveDate(date); }; interface GuestData { - [key: string]: { pic: string; name: string; }[]; + [key: string]: { pic: string; name: string }[]; } - + const guestData: GuestData = { "5.21": [ { pic: "./src/assets/jannavi.jpg", name: "잔나비" }, { pic: "./src/assets/norazo.jpg", name: "노라조" }, - { pic: "./src/assets/soranband.webp", name: "소란밴드" } + { pic: "./src/assets/soranband.webp", name: "소란밴드" }, ], "5.22": [ { pic: "./src/assets/qwer.webp", name: "QWER" }, { pic: "./src/assets/10cm.jpg", name: "10CM" }, - { pic: "./src/assets/haha.webp", name: "하하" } + { pic: "./src/assets/haha.webp", name: "하하" }, ], "5.23": [ { pic: "./src/assets/paulblanco.avif", name: "Paul Balnco" }, { pic: "./src/assets/loykim.webp", name: "로이킴" }, - { pic: "./src/assets/bigmama.webp", name: "빅마마" } - ] + { pic: "./src/assets/bigmama.webp", name: "빅마마" }, + ], }; const renderGuests = () => { - return guestData[activeDate].map((guest) => ( - - )); + return guestData[activeDate].map((guest) => ); }; return ( - SPECIAL GUEST + + SPECIAL GUEST + - handleDateClick("5.21")} /> - handleDateClick("5.22")} /> - handleDateClick("5.23")} /> + handleDateClick("5.21")} + /> + handleDateClick("5.22")} + /> + handleDateClick("5.23")} + />
- 1주차장 + + 1주차장 +
- - { renderGuests() } - + {renderGuests()} ); -} -export default SpecialGuestPage; \ No newline at end of file +}; +export default SpecialGuestPage;