feat: Notch support

chebread · chebread · commit 04ff81dcbc38 · 2025-09-27T15:10:23.000+09:00
diff --git a/layout/about.html b/layout/about.html
@@ -2,7 +2,7 @@
 <html lang="ko">
 <head>
     <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
 
     <title>어바웃 | 차한음 블로그</title>
     <meta name="description" content="어바웃 | 차한음 블로그">
@@ -68,7 +68,7 @@
                     <h1>개발자 차한음</h1>
                 </div>
             </header>
-            
+
             <main class="about-content">
                 <article class="markdown-body">
                     {{ .Content }}
diff --git a/layout/index.html b/layout/index.html
@@ -2,7 +2,7 @@
 <html lang="ko">
 <head>
     <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
 
     <title>차한음 블로그</title>
     <meta name="description" content="개발자 차한음 블로그">
diff --git a/layout/post.html b/layout/post.html
@@ -2,7 +2,7 @@
 <html lang="ko">
 <head>
     <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
 
     <title>{{ .Title }} | 차한음 블로그</title>
     <meta name="description" content="{{ .Description }}">
diff --git a/layout/posts.html b/layout/posts.html
@@ -2,7 +2,7 @@
 <html lang="ko">
 <head>
     <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
 
     <title>포스트 | 차한음 블로그</title>
     <meta name="description" content="포스트 | 차한음 블로그">
diff --git a/layout/styles/layout.scss b/layout/styles/layout.scss
@@ -26,8 +26,16 @@ body {
 .root {
     max-width: 35rem;
     margin: 0 auto;
+
+    padding-left: env(safe-area-inset-left);
+    padding-right: env(safe-area-inset-right);
 }
 
+// .root {
+//   position: relative;
+//   z-index: 0;
+// }
+
 a, button, input, select, textarea {
     -webkit-tap-highlight-color: transparent;
 
@@ -69,20 +77,12 @@ a, button, input, select, textarea {
 //     -webkit-text-size-adjust: 100% !important; /* 또는 none !important; */
 // }
 
-// .root {
-//   position: relative;
-//   z-index: 0;
-// }
-
 .medium-zoom-overlay {
     z-index: 9999;
-
 }
 .medium-zoom-image--opened {
     z-index: 9999;
-
 }
-
 .medium-zoom-image--closing {
     z-index: 9999;
 }
