From 89c94df689cdbf62831d94ea645aa53c28566e1f Mon Sep 17 00:00:00 2001 From: YouD0313 <102004480+YouD0313@users.noreply.github.com> Date: Wed, 14 May 2025 16:59:57 +0900 Subject: [PATCH 1/3] =?UTF-8?q?fix:=20=ED=83=80=EC=9E=85=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD=EC=97=90=20=EB=94=B0=EB=A5=B8=20=EB=AF=B8=EB=94=94?= =?UTF-8?q?=EC=96=B4=EC=BF=BC=EB=A6=AC=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../home/projectCardLists/ProjectCardLists.styled.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/home/projectCardLists/ProjectCardLists.styled.ts b/src/components/home/projectCardLists/ProjectCardLists.styled.ts index ee62421a..125daad5 100644 --- a/src/components/home/projectCardLists/ProjectCardLists.styled.ts +++ b/src/components/home/projectCardLists/ProjectCardLists.styled.ts @@ -47,14 +47,14 @@ export const Wrapper = styled.div<{ $flex: Display }>` @media ${({ theme }) => theme.mediaQuery.tablet} { grid-template-columns: ${({ $flex }) => - $flex ? '' : 'repeat(auto-fit, minmax(40%, 1fr))'}; + $flex === 'grid' && 'repeat(auto-fit, minmax(40%, 1fr))'}; gap: 2rem; } @media ${({ theme }) => theme.mediaQuery.mobile} { width: 100%; grid-template-columns: ${({ $flex }) => - $flex ? '' : 'repeat(auto-fit, minmax(50%, 1fr))'}; + $flex === 'grid' && 'repeat(auto-fit, minmax(50%, 1fr))'}; gap: 1rem; } `; From db91974a3bb699098ea126562ad133e0a0282339 Mon Sep 17 00:00:00 2001 From: YouD0313 <102004480+YouD0313@users.noreply.github.com> Date: Wed, 14 May 2025 17:11:10 +0900 Subject: [PATCH 2/3] =?UTF-8?q?fix:=20=ED=95=84=EC=9A=94=EC=97=86=EC=96=B4?= =?UTF-8?q?=20=EB=B3=B4=EC=97=AC=20=EC=A7=80=EC=9A=B4=20=EC=8A=A4=ED=83=80?= =?UTF-8?q?=EC=9D=BC=EB=93=9C=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20?= =?UTF-8?q?=EB=B9=84=EB=B0=80=EB=B2=88=ED=98=B8=20=EC=9E=AC=EC=84=A4?= =?UTF-8?q?=EC=A0=95=EC=97=90=EC=84=9C=20=ED=95=84=EC=9A=94=ED=95=B4?= =?UTF-8?q?=EC=84=9C=20=EB=8B=A4=EC=8B=9C=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/login/Login.styled.ts | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/src/pages/login/Login.styled.ts b/src/pages/login/Login.styled.ts index cd2be669..35799996 100644 --- a/src/pages/login/Login.styled.ts +++ b/src/pages/login/Login.styled.ts @@ -6,7 +6,7 @@ export const Container = styled.div` width: 100%; height: 100vh; max-width: ${({ theme }) => theme.layout.width.desktop}; - min-width: 310px; + min-width: 22rem; margin: 0 auto; flex-direction: column; align-items: center; @@ -26,20 +26,22 @@ export const Container = styled.div` } button { - max-width: 310px; + max-width: 22rem; width: 100%; padding: 0.8rem 0.625rem; font-weight: 600; } `; +export const LogoH1 = styled.h1``; + export const MoveHomeLink = styled(Link)` padding-bottom: 2rem; `; export const InputContainer = styled.div` display: flex; - min-width: 310px; + min-width: 22rem; gap: 0.6rem; button { @@ -51,7 +53,7 @@ export const InputContainer = styled.div` `; export const InputWrapper = styled.div` - max-width: 310px; + max-width: 22rem; width: inherit; margin-bottom: 1.875rem; position: relative; @@ -69,7 +71,7 @@ export const ErrorMessage = styled.span<{ message?: string }>` export const WrapperPassword = styled.div` width: 100%; - max-width: 310px; + max-width: 22rem; display: flex; justify-content: space-between; font-size: 0.8rem; From 13b50c57fce97119e0ba0e81508803497160838d Mon Sep 17 00:00:00 2001 From: YouD0313 <102004480+YouD0313@users.noreply.github.com> Date: Wed, 14 May 2025 17:29:13 +0900 Subject: [PATCH 3/3] =?UTF-8?q?feat:=20FAQ=20=EB=8D=94=EB=B3=B4=EA=B8=B0?= =?UTF-8?q?=20=EC=B6=94=EA=B0=80=ED=95=98=EA=B8=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/customerService/faq/FAQ.styled.ts | 21 ++++++++++++++++ src/pages/customerService/faq/FAQ.tsx | 28 ++++++++++++++++----- 2 files changed, 43 insertions(+), 6 deletions(-) diff --git a/src/pages/customerService/faq/FAQ.styled.ts b/src/pages/customerService/faq/FAQ.styled.ts index 0571e9f8..2efc6015 100644 --- a/src/pages/customerService/faq/FAQ.styled.ts +++ b/src/pages/customerService/faq/FAQ.styled.ts @@ -19,3 +19,24 @@ export const Wrapper = styled.div` `; export const ToggleWrapper = styled.div``; + +export const ShowMoreFAQWrapper = styled.div``; + +export const ShowMoreFAQ = styled.button` + width: 100%; + padding: 1.2rem 0; + display: flex; + justify-content: center; + align-items: center; + gap: 0.5rem; + font-weight: bold; + font-size: 1rem; + + svg { + width: 1rem; + } + + &:hover { + background: ${({ theme }) => theme.color.lightgrey}; + } +`; diff --git a/src/pages/customerService/faq/FAQ.tsx b/src/pages/customerService/faq/FAQ.tsx index 3fdefe30..aa043ef7 100644 --- a/src/pages/customerService/faq/FAQ.tsx +++ b/src/pages/customerService/faq/FAQ.tsx @@ -7,10 +7,12 @@ import CustomerServiceHeader from '../../../components/customerService/CustomerS import FAQContent from '../../../components/customerService/faq/FAQContent'; import NoResult from '../../../components/common/noResult/NoResult'; import ContentBorder from '../../../components/common/contentBorder/ContentBorder'; +import { ChevronDownIcon } from '@heroicons/react/24/outline'; export default function FAQ() { const [keyword, setKeyword] = useState({ keyword: '' }); const [value, setValue] = useState(''); + const [showFAQ, setShowFAQ] = useState(10); const { faqData, isLoading } = useGetFAQ(keyword); const handleGetKeyword = (keyword: string) => { @@ -38,15 +40,29 @@ export default function FAQ() { {faqData.length > 0 ? ( - faqData.map((list) => ( - - - - - )) + faqData + .filter((_, index) => index < showFAQ) + .map((list) => ( + + + + + )) ) : ( )} + {faqData.length > showFAQ && ( + <> + setShowFAQ((prev) => prev + 10)} + > + 더보기 + + + + + )}