移动端样式：解决移动端无法分词顶出屏幕的问题、解决移动端页面边距过大的问题。

Neboer · Sep 9, 2024 · b5e57a2 · b5e57a2
1 parent 0c86ac1
commit b5e57a2
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 3 deletions.
diff --git a/themes/nboat/layout/post.ejs b/themes/nboat/layout/post.ejs
@@ -1,5 +1,5 @@
 <main>
-    <div class="main-container d-flex">
+    <div class="main-container d-md-flex">
         <div class="post-details">
             <% if (is_post()) { %>
                 <div class="post-title">

diff --git a/themes/nboat/source/css/partial/layout.styl b/themes/nboat/source/css/partial/layout.styl
@@ -1,6 +1,6 @@
 .body-container
     width 1440px
-    max-width 95%
+    max-width calc(100% - 23px)
     margin auto
     & > div:not(:last-child)
         margin-bottom 20px

diff --git a/themes/nboat/source/css/partial/post.styl b/themes/nboat/source/css/partial/post.styl
@@ -116,6 +116,7 @@
 
 
 
+
 .blog-menu
     max-width 30%
 
@@ -136,4 +137,7 @@
 
 @media (max-width grid-breakpoints-md)
     .post-details
-        max-width 100%
+        max-width 100%
+
+    *
+        word-wrap break-word