[SP0] 에러페이지 QA 반영 (#381)

* feat: 문의하기 링크 왈라폼->카톡채널 변경 * design: 모바일뷰 사이즈 다운 * fix: vh->dvh 수정
sopt-makers · Mar 26, 2024 · 81f9cb2 · 81f9cb2
1 parent 1785519
commit 81f9cb2
Show file tree

Hide file tree

Showing 5 changed files with 11 additions and 12 deletions.
diff --git a/src/components/Footer/MakersNForm/index.tsx b/src/components/Footer/MakersNForm/index.tsx
@@ -14,11 +14,7 @@ const MakersNForm: FC = () => {
       >
         만든 사람들
       </St.FooterLink>
-      <St.FooterLink
-        href="https://walla.my/sopt_official"
-        target="_blank"
-        rel="noopener noreferrer"
-      >
+      <St.FooterLink href="https://pf.kakao.com/_sxaIWG" target="_blank" rel="noopener noreferrer">
         의견 제안하기
       </St.FooterLink>
     </St.FooterForm>

diff --git a/src/components/common/RoundButton/style.ts b/src/components/common/RoundButton/style.ts
@@ -5,7 +5,6 @@ export const Root = styled.button`
   display: flex;
   align-items: center;
 
-  height: 60px;
   padding: 12px 28px;
   border-radius: 99px;
   background: ${colors.gray10};

diff --git a/src/views/ErrorPage/ErrorPage.tsx b/src/views/ErrorPage/ErrorPage.tsx
@@ -29,7 +29,7 @@ function ErrorPage({ code }: ErrorPageProps) {
         </S.TopSection>
         {code === 500 && (
           <S.ContactLink
-            href="https://walla.my/sopt_official"
+            href="https://pf.kakao.com/_sxaIWG"
             target="_blank"
             rel="noopener noreferrer"
           >

diff --git a/src/views/ErrorPage/components/ErrorCode.tsx b/src/views/ErrorPage/components/ErrorCode.tsx
@@ -18,7 +18,7 @@ export default function ErrorCode({ code }: ErrorCodeProps) {
   const isMobile = useIsMobile('428px');
   const SIZE = {
     height: 92,
-    icon: 150,
+    icon: 140,
   };
 
   const codeVariant = {

diff --git a/src/views/ErrorPage/styles.ts b/src/views/ErrorPage/styles.ts
@@ -10,9 +10,9 @@ export const Root = styled.main`
   position: relative;
 
   width: 100%;
-  height: 100vh;
+  height: 100dvh;
   min-height: 400px;
-  padding-bottom: 20vh;
+  padding-bottom: 20dvh;
 
   overflow: scroll;
 `;
@@ -27,14 +27,18 @@ export const TopSection = styled.section`
 export const ErrorText = styled.p`
   color: #fcfcfc;
 
-  font-size: calc(24px + 1vw);
+  font-size: 28px;
   font-weight: 600;
   line-height: 150%;
   letter-spacing: -0.96px;
+
+  @media (max-width: 428px) {
+    font-size: 24px;
+  }
 `;
 export const ContactLink = styled(Link)`
   position: absolute;
-  bottom: 17vh;
+  bottom: 17dvh;
 
   color: #fff;
   font-size: 24px;