fix

themes/plain/layouts/partials/about.html

@@ -12,7 +12,7 @@
   }
   
   main {
-      padding: 24px 0 100px 24px;
+      padding: 0px 24px 100px 24px;
   }
 
   h4 {

themes/plain/layouts/partials/home.html

@@ -1,11 +1,35 @@
+<script type="text/javascript">
+    let vh = window.innerHeight * 0.01;
+    document.documentElement.style.setProperty('--vh', `${vh}px`);
+    
+    window.addEventListener('resize', () => {
+      let vh = window.innerHeight * 0.01;
+      document.documentElement.style.setProperty('--vh', `${vh}px`);
+    });
+</script>
+
 <style type="text/css">
     body {
         padding: 0;
         margin: 0;
     }
 
+    .title {
+        display: block;
+        font-weight: bold;
+        font-size: 40px;
+        margin-bottom: 12px;
+    }
+    
+    .subtitle {
+        display: block;
+        font-size: 16px;
+        margin-bottom: 38px;
+    }
+
     .home {
         height: 100vh;
+        height: calc(var(--vh, 1vh) * 100);
         display: flex;
         align-items: center;
         justify-content: center;
@@ -45,6 +69,17 @@
 
 
     @media (max-width: 700px) {
+        .title {
+            font-size: 28px;
+            margin-top: 2.4em;
+            margin-bottom: 12px;
+        }
+        
+        .subtitle {
+            font-size: 16px;
+            margin-bottom: 32px;
+        }
+
         .links {
             flex-direction: column;
             align-items: flex-start;
@@ -65,8 +100,8 @@
 
 <div class="home">
     <div class="card">
-        <h1>Morgan J.</h1>
+        <div class="title">Morgan L.</div>
-        <h3>Average Linux user</h3>
+        <div class="subtitle">Average Linux user</div>
         <div class="links">
             <li><a href="/about">/about</a></li>
             <li><a href="https://git.morgan.kr">/projects</a></li>
@@ -78,4 +113,4 @@
             <li><a href="https://AS214578.net">/net</a></li>
         </div>
     </div>
-</div>
+</div>