略微增加一点移动端适配

Author: LingLambda

src/components/HeadMenu.astro

@@ -31,8 +31,10 @@
     display: flex;
     align-items: center;
     justify-content: space-around;
-    width: 600px;
+    /* width: 600px; */
     height: 55px;
+    min-width: 32vw
+    max-width: 90vw
     background-color: rgba(255, 255, 255, 0.1);
     backdrop-filter: blur(4px);
     border: 1px solid rgba(0, 0, 0, 0.2); /* 添加黑色的边框，宽度为 2px */

src/components/TitileCard.astro

@@ -29,11 +29,10 @@ const { title, date, wordNum } = Astro.props;
     flex-direction: column;
     gap: 10px; /* 行间距 */
     align-items: center;
-    max-width: 600px;
-    min-width: 380px;
+    max-width: 90vw;
+    min-width: 32vw;
     height: 130px;
-    margin-top: 20px;
-    margin-bottom: 10px;
+    margin: 20px 20px 10px 20px;
     border: 1px solid rgba(0, 0, 0, 0.2); /* 添加黑色的边框，宽度为 2px */
     border-radius: 10px;
     padding: 10px 25px; /* 给容器添加左右内边距 */

src/layouts/BaseLayout.astro

@@ -97,7 +97,7 @@ const { description, keywords ,selected} = Astro.props;
   }
 
   header {
-    padding: 30px;
+    padding: 30px 0;
   }
 
   main {