[FEAT] 미디어쿼리 공통 CSS 추가 #30

nyangnyanggompeng · Jul 19, 2023 · b52d57d · b52d57d
1 parent 5924b10
commit b52d57d
Showing 1 changed file with 15 additions and 0 deletions.
diff --git a/src/GlobalStyle.tsx b/src/GlobalStyle.tsx
@@ -1,4 +1,5 @@
 import { Global, Theme, css } from '@emotion/react';
+import { mq } from './theme';
 
 const style = (theme: Theme) =>
   css({
@@ -27,13 +28,16 @@ const style = (theme: Theme) =>
 
     html: {
       fontSize: '62.5%',
+      overflowX: 'hidden',
     },
 
     body: {
       fontSize: '1.6rem',
       backgroundColor: `${theme.bgColor}`,
       color: `${theme.fontColor}`,
       fontFamily: `'Noto Sans KR','Apple SD Gothic Neo', arial, sans-serif`,
+      position: 'relative',
+      overflowX: 'hidden',
     },
 
     'img, picture, video, canvas, svg': {
@@ -68,6 +72,7 @@ const style = (theme: Theme) =>
 
     '.container': {
       padding: '5rem 0',
+      minHeight: 'calc(100vh - 25rem)',
     },
 
     // 페이지 제목
@@ -94,6 +99,16 @@ const style = (theme: Theme) =>
         color: `${theme.gray2}`,
       },
     },
+
+    [mq[0]]: {
+      body: {
+        fontSize: '1.4rem',
+      },
+
+      '.inner': {
+        width: '90%',
+      },
+    },
   });
 
 const GlobalStyle = () => {