Merge pull request #23 from ananjaemin/dev

Dev 404 페이지 디자인
tempfiles-team · Nov 2, 2022 · 3a39292 · 3a39292
2 parents 09b8c44 + 8660a8b
commit 3a39292
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 2 deletions.
diff --git a/src/pages/notfound/index.tsx b/src/pages/notfound/index.tsx
@@ -2,4 +2,9 @@ import React from 'react';
 
 import * as S from './styled';
 
-export const NotFoundPage: React.FC = () => <S.NotFoundPage>404</S.NotFoundPage>;
+export const NotFoundPage: React.FC = () => (
+  <S.NotFoundPageContainer>
+    <S.NotFoundText>404</S.NotFoundText>
+    <S.NotFoundSubText>Error 404 Not Found</S.NotFoundSubText>
+  </S.NotFoundPageContainer>
+);
diff --git a/src/pages/notfound/styled.ts b/src/pages/notfound/styled.ts
@@ -1,3 +1,19 @@
 import styled from '@emotion/styled';
 
-export const NotFoundPage = styled.div``;
+export const NotFoundPageContainer = styled.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+`;
+
+export const NotFoundText = styled.div`
+  font-size: 18rem;
+  font-weight: 700;
+  margin: 0.5rem;
+`;
+
+export const NotFoundSubText = styled.div`
+  font-size: 3rem;
+  font-weight: 700;
+  margin: 0.5rem;
+`;