模板:首页/styles.css：修订间差异

←上一编辑

@@ 第15行： / 第15行： @@
 .subject-item {
-    display: flex;              /* ← 关键 */
+	display: flex;
      align-items: center;        /* ← 垂直居中 */
      border: 1px solid var(--border-color-base);
-    border-radius: 8px;
      background: var(--background-color-base);
      overflow: hidden;
-    line-height: 1;
 }
@@ 第28行： / 第26行： @@
      display: flex;
      align-items: center;
-     gap: 1em;
+     gap: 0.4em;
-     padding: 0.6em 0.6em;
+     padding: 0.4em 0.6em;
      width: 100%;
      height: 100%;
      color: var(--color-link);
      text-decoration: none;
-     white-space: nowrap; /* emoji + 文字永不换行 */
+     white-space: normal;
+}
+@media (max-width: 480px) {
+    .subject-item > a {
+        padding: 0.4em 0.3em;
+        gap: 0.3em;
+    }
 }
 /* hover 效果 */
@@ 第45行： / 第50行： @@
 .info-card {
      border: 1px solid var(--border-color-base);
-    border-radius: 8px;
      padding: 0.8em 1em;
      background: var(--background-color-base);
@@ 第89行： / 第93行： @@
 .homepage-grid {
      display: grid;
-     grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
+     grid-template-columns: repeat(auto-fit, minmax(min(100%, 450px), 1fr));
-	gap: 1em;
+    gap: 1em;
      grid-auto-flow: dense;
 }
 @media (max-width: 480px) {
      .homepage-grid {
@@ 第102行： / 第107行： @@
 .homepage-dyk {
 	background: var(--background-color-notice-subtle);
-     border-left: 3px solid var(--border-color-base); /* 你要的竖线 */
+     border-left: 3px solid var(--border-color-base); /* 你要的竖线 */ /* 和 info-card 一样的圆角 */
-    border-radius: 8px; /* 和 info-card 一样的圆角 */
      padding: 0.8em 1em; /* 和 info-card 一样的内边距 */
      white-space: revert !important;
@@ 第113行： / 第117行： @@
      white-space: normal;
      min-width: 0;
+}
+.mw-parser-output {
+    min-width: 0 !important;
+}
+@media (max-width: 450px) {
+    .homepage-grid {
+        grid-template-columns: 1fr !important;
+    }
 }

MM 喵了个​（留言 | 贡献）

MM 喵了个（留言 | 贡献）