Template:首页导航：修订间差异

@@ 第1行： / 第1行： @@
-<div class="nav-container" style="
+<div id="mainpagenav" style="
-   max-width: 95%;
+   max-width: 100%;
-   margin: 20px auto;
+   margin: 16px auto;
-   font-family: Arial, sans-serif;
+   border: 1px solid var(--border-color-base, #a2a9b1);
-   box-shadow: 0 2px 10px rgba(0,0,0,0.1);
+   background-color: var(--color-surface-0, #ffffff);
-   border-radius: 8px;
+   color: var(--color-base, #202122);
-   overflow: hidden;
+   box-sizing: border-box;
 ">
-   <!-- 标题 -->
+   <!-- 标题区域 -->
-   <div class="nav-header" style="
+   <div style="
-     background-color: #4CAF50;
+     background-color: var(--color-primary, #36c);
-     color: white;
+     color: #ffffff;
-     font-size: 1.2em;
+     padding: 12px 16px;
-     height: 60px;
+     font-weight: 700;
-     display: flex;
+     font-size: 1.1em;
-     align-items: center;
+     letter-spacing: 0.05em;
-     justify-content: center;
+     text-transform: uppercase;
-     border-top-left-radius: 8px;
+     border-bottom: 1px solid var(--border-color-subtle, #004bb3);
-    border-top-right-radius: 8px;
    ">
-精简导航
+<span style="margin-right: 8px;">&#x1F5FA;</span>精简导航
-  </div>
+</div>
-   <!-- 主内容区 -->
+   <!-- 主内容区：使用 Flexbox 模拟网格 -->
-   <div class="nav-grid" style="
+   <div style="
      display: flex;
      flex-wrap: wrap;
-     background: white;
+     background-color: var(--color-surface-0, #ffffff);
    ">
-     <!-- 每个栏目区块 -->
-     <div class="nav-column" style="
+     <!-- 栏目1：动物园 -->
-       flex: 1;
+     <div style="
-       min-width: 250px;
+       flex: 1 1 280px;
-       border: 1px solid #ddd;
+      padding: 16px 20px;
-       padding: 12px 15px;
+       border-bottom: 1px solid var(--border-color-subtle, #eaecf0);
+       border-right: 1px solid var(--border-color-subtle, #eaecf0);
+       border-left: 5px solid #4CAF50;
+      box-sizing: border-box;
      ">
-       <div class="nav-main-link" style="
+       <div style="
-         text-align: center;
+         font-weight: 700;
-         margin-bottom: 10px;
+         margin-bottom: 12px;
-         font-weight: bold;
+         color: var(--color-base, #202122);
-         font-size: 1.1em;
+         font-size: 1.05em;
+        padding-bottom: 6px;
+        border-bottom: 1px solid var(--border-color-subtle, #eee);
        ">
-[[导航:泛ACG亚文化百科/动物园文化＆吉吉国文化|'''动物园文化＆吉吉国文化''']]
+[[导航:泛ACG亚文化百科/动物园文化＆吉吉国文化|&#x267f; 动物园 & 吉吉国]]
-      </div>
+</div>
-      <div class="nav-sub-links">
+<div style="line-height: 1.8; font-size: 0.95em;">
-[[导航:泛ACG亚文化百科/动物园文化＆吉吉国文化/电棍otto|{{color|blue|电棍otto}}]]<br/>
+        <div style="display:flex; align-items:center;">
-[[导航:泛ACG亚文化百科/动物园文化＆吉吉国文化/山泥若|{{color|darkred|山泥若}}]]<br/>
+<span style="display:inline-block; width:8px; height:8px; background:#2196F3; margin-right:8px; flex-shrink:0;"></span>
-[[导航:泛ACG亚文化百科/动物园文化＆吉吉国文化/炫神|{{color|#e6ac23|炫神}}]]<br/>
+[[导航:泛ACG亚文化百科/动物园文化＆吉吉国文化/电棍otto|电棍otto]]
-[[导航:泛ACG亚文化百科/动物园文化＆吉吉国文化/重要人物＆重要团体|动物园UP主]]
+        </div>
-      </div>
+        <div style="display:flex; align-items:center;">
-    </div>
+<span style="display:inline-block; width:8px; height:8px; background:#d32f2f; margin-right:8px; flex-shrink:0;"></span>
+[[导航:泛ACG亚文化百科/动物园文化＆吉吉国文化/山泥若|山泥若]]
+</div>
+<div style="display:flex; align-items:center;">
+<span style="display:inline-block; width:8px; height:8px; background:#e6ac23; margin-right:8px; flex-shrink:0;"></span>
+[[导航:泛ACG亚文化百科/动物园文化＆吉吉国文化/炫神|炫神]]
+</div>
+<div style="margin-top:6px; font-weight:600; font-size:0.9em; opacity:0.8;">
+[[导航:泛ACG亚文化百科/动物园文化＆吉吉国文化/重要人物＆重要团体|→ 更多动物园人物 ↓下滑其它]]
+</div>
+</div>
+</div>
-     <div class="nav-column" style="
+    <!-- 栏目2：蕾忍宗 -->
-       flex: 1;
+     <div style="
-       min-width: 250px;
+       flex: 1 1 280px;
-       border: 1px solid #ddd;
+       padding: 16px 20px;
-       padding: 12px 15px;
+      border-bottom: 1px solid var(--border-color-subtle, #eaecf0);
+       border-right: 1px solid var(--border-color-subtle, #eaecf0);
+       border-left: 5px solid #757575;
+      box-sizing: border-box;
      ">
-       <div class="nav-main-link" style="
+       <div style="
-         text-align: center;
+         font-weight: 700;
-         margin-bottom: 10px;
+         margin-bottom: 12px;
-         font-weight: bold;
+         color: var(--color-base, #202122);
-         font-size: 1.1em;
+         font-size: 1.05em;
+        padding-bottom: 6px;
+        border-bottom: 1px solid var(--border-color-subtle, #eee);
        ">
-[[导航:泛ACG亚文化百科/哈基米音乐|'''哈基米音乐''']]
+[[导航:泛ACG亚文化百科/蕾忍宗|&#x1F977; 蕾忍宗]]
        </div>
-       <div class="nav-sub-links">
+       <div style="line-height: 1.8; font-size: 0.95em;">
-[[猫反七|{{color|#b39d7b|猫反七}}]]<br/>
+<div>&#x1F539; [[忍者]]</div>
-[[奇诺の旅的奇诺|{{color|#838476|奇诺の旅的奇诺}}]]<br/>
+<div>&#x1F539; [[安奈师傅]]</div>
-[[显卡人|{{color|#b89265|显卡人}}]]<br/>
+<div>&#x1F539; [[叛忍999]]</div>
-[[圆头耄耋|{{color|#dbb07d|圆头耄耋}}]]<br/>
-[[导航:泛ACG亚文化百科/哈基米音乐/用语|相关用语]]
+        <div style="visibility:hidden;">.</div>
        </div>
      </div>
-     <div class="nav-column" style="
+    <!-- 栏目3：豌豆笑传 -->
-       flex: 1;
+     <div style="
-       min-width: 250px;
+       flex: 1 1 280px;
-       border: 1px solid #ddd;
+      padding: 16px 20px;
-       padding: 12px 15px;
+       border-bottom: 1px solid var(--border-color-subtle, #eaecf0);
+       border-left: 5px solid #ef6c00;
+       box-sizing: border-box;
      ">
-       <div class="nav-main-link" style="
+       <div style="
-         text-align: center;
+         font-weight: 700;
-         margin-bottom: 10px;
+         margin-bottom: 12px;
-         font-weight: bold;
+         color: var(--color-base, #202122);
-         font-size: 1.1em;
+         font-size: 1.05em;
+        padding-bottom: 6px;
+        border-bottom: 1px solid var(--border-color-subtle, #eee);
        ">
-[[导航:泛ACG亚文化百科/蕾忍宗|'''蕾忍宗''']]
+[[导航:泛ACG亚文化百科/豌豆笑传|&#x1F418; 豌豆笑传]]
        </div>
-       <div class="nav-sub-links">
+       <div style="line-height: 1.8; font-size: 0.95em;">
-[[LexBurner|{{color|silver|LexBurner}}]]<br/>
+<div>&#x1F539; [[袁伟江]]</div>
-[[忍者|{{color|#5e5e5e|忍者}}]]<br/>
+<div>&#x1F539; [[栗瑞明]]</div>
-[[安奈师傅|{{color|#5e5e5e|安奈师傅}}]]<br/>
+<div>&#x1F539; [[豌豆]]</div>
-[[叛忍999|{{color|#5e5e5e|叛忍999}}]]
+<div>&#x1F539; [[大蓝象]] / [[踩踩背]]</div>
-      </div>
-    </div>
-    <div class="nav-column" style="
-      flex: 1;
-      min-width: 250px;
-      border: 1px solid #ddd;
-      padding: 12px 15px;
-    ">
-      <div class="nav-main-link" style="
-        text-align: center;
-        margin-bottom: 10px;
-        font-weight: bold;
-        font-size: 1.1em;
-      ">
-[[导航:泛ACG亚文化百科/豌豆笑传|'''豌豆笑传''']]
-</div>
-      <div class="nav-sub-links">
-[[袁伟江]]<br/>
-[[栗瑞明]]<br/>
-[[豌豆]]<br/>
-[[大蓝象]]<br/>
-[[踩踩背]]
        </div>
      </div>
    </div>
-   <!-- 底部链接 -->
+   <!-- 底部区域 -->
-  <div class="nav-footer" style="
+<div style="
-     padding: 12px 15px;
+     padding: 12px;
-     border: 1px solid #ddd;
+     background-color: var(--color-surface-1, #f8f9fa); /* 浅灰背景，深色模式下会变深灰 */
      text-align: right;
-     border-bottom-left-radius: 8px;
+     border-top: 1px solid var(--border-color-base, #a2a9b1);
-     border-bottom-right-radius: 8px;
+    display: flex;
-     background: white;
+     align-items: center;
+    justify-content: flex-end;
+     gap: 10px;
    ">
-[[泛ACG亚文化百科|查看完整导航 →]]
+<span>需要查找更多内容？</span>
+{{CustomButton|泛ACG亚文化百科|查看完整导航 →|class=mw-ui-progressive}}
    </div>
 </div>
+[[分类:首页模板]]

棍牧典​（留言 | 贡献）

2026年1月8日 (四) 20:00的最新版本

棍牧典（留言 | 贡献）