chore: mobile css

WanderedToLa · Feb 4, 2024 · dd23439 · dd23439
1 parent ac447ed
commit dd23439
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 87 deletions.
diff --git a/src/components/HomepageFeatures/index.tsx b/src/components/HomepageFeatures/index.tsx
diff --git a/src/css/main.css b/src/css/main.css
@@ -6,9 +6,9 @@
 }
 
 .main-container {
-  margin-top: 10rem;
-  max-width: 997px;
-  width: 100%;
+  padding-top: 3rem;
+  padding-bottom: 3rem;
+  width: 997px;
   margin-left: auto;
   margin-right: auto;
 }
@@ -48,3 +48,25 @@
   display: flex;
   justify-content: space-between;
 }
+
+@media screen and (max-width: 996px) {
+  .main-container {
+    padding: 3rem;
+  }
+
+  .main-title {
+    font-size: 2.5rem;
+  }
+
+  .main-description {
+    font-size: 1.3rem;
+  }
+
+  .post-title {
+    font-size: 1.5rem;
+  }
+
+  .post-list-container li {
+    font-size: 1rem;
+  }
+}
diff --git a/src/pages/index.module.css b/src/pages/index.module.css
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -23,10 +23,9 @@ export default function Home() {
                 <br />
                 공부하며 새로 알게된 정보들은 이곳에 정리하거나&nbsp;
                 <br />
-                <Link to={'https://github.com/WanderedToLa/Awesome-FE-Engineers'}>따로 모아서 관리하고 있습니다</Link>
+                <Link to={'https://github.com/WanderedToLa/Awesome-FE-Engineers'}>따로 모아 관리하고</Link>
                 <br />
-                또한 앞으로 WebAssembly를 기반으로한
-                <br /> 웹 생태계를 주목하고 있습니다.
+                WebAssembly기반의 웹 생태계를 주목하고 있습니다.
               </p>
             </header>
             <main className="main">