增加ai配置和ai广场功能

website/src/components/ContentCard.vue

@@ -42,7 +42,6 @@ const glyph = computed(() => props.item.title.slice(0, 1));
         <span class="content-card__deco" aria-hidden="true"></span>
         <span class="content-card__glyph" aria-hidden="true">{{ glyph }}</span>
       </template>
-      <span class="content-card__badge">{{ categoryLabel }}</span>
     </div>
 
     <div class="content-card__body">
@@ -53,15 +52,18 @@ const glyph = computed(() => props.item.title.slice(0, 1));
       <p class="content-card__summary">{{ item.summary }}</p>
 
       <div class="content-card__foot">
-        <span v-if="item.date" class="content-card__date">
-          <AppIcon name="clock" :size="14" />
-          {{ item.date }}
-        </span>
-        <span v-else class="content-card__tags">
-          <em v-for="tag in (item.tags ?? []).slice(0, 2)" :key="tag">
-            {{ tag }}
-          </em>
-        </span>
+        <div class="content-card__foot-left">
+          <span class="content-card__badge">{{ categoryLabel }}</span>
+          <span v-if="item.date" class="content-card__date">
+            <AppIcon name="clock" :size="14" />
+            {{ item.date }}
+          </span>
+          <span v-else class="content-card__tags">
+            <em v-for="tag in (item.tags ?? []).slice(0, 2)" :key="tag">
+              {{ tag }}
+            </em>
+          </span>
+        </div>
 
         <span class="content-card__more">
           查看详情
@@ -149,17 +151,26 @@ const glyph = computed(() => props.item.title.slice(0, 1));
       opacity 0.4s ease;
   }
 
+  /* 分类标签：位于正文区日期上方，不再覆盖在封面图上 */
   &__badge {
-    position: absolute;
-    left: 22px;
-    top: 22px;
-    padding: 5px 13px;
+    display: inline-flex;
+    align-items: center;
+    align-self: flex-start;
+    padding: 4px 12px;
     border-radius: 100px;
-    background: rgba(255, 255, 255, 0.16);
-    backdrop-filter: blur(6px);
-    font-size: 11.5px;
+    background: @bg-soft;
+    font-size: 12px;
     font-weight: 500;
-    letter-spacing: 0.06em;
+    letter-spacing: 0.04em;
+    color: @ink-600;
+  }
+
+  &__foot-left {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 10px;
+    min-width: 0;
   }
 
   /* ---------------- 正文 ---------------- */
@@ -248,7 +259,7 @@ const glyph = computed(() => props.item.title.slice(0, 1));
     flex-direction: column;
 
     .content-card__cover {
-      height: 176px;
+      aspect-ratio: 25 / 14;
     }
   }
 
@@ -258,7 +269,7 @@ const glyph = computed(() => props.item.title.slice(0, 1));
 
     .content-card__cover {
       width: 300px;
-      min-height: 200px;
+      aspect-ratio: 25 / 14;
     }
 
     .content-card__glyph {
@@ -283,7 +294,7 @@ const glyph = computed(() => props.item.title.slice(0, 1));
   .content-card--list {
     .content-card__cover {
       width: 230px;
-      min-height: 176px;
+      aspect-ratio: 25 / 14;
     }
 
     .content-card__glyph {
@@ -298,7 +309,7 @@ const glyph = computed(() => props.item.title.slice(0, 1));
 
     .content-card__cover {
       width: 100%;
-      min-height: 148px;
+      aspect-ratio: 25 / 14;
     }
   }
 

website/src/components/SiteHeader.vue

@@ -7,6 +7,11 @@ import { navMenus } from "@/config/nav";
 
 const route = useRoute();
 
+// 统一认证中心地址：登录/注册均跳转到认证中心页面
+const AUTH_CENTER = "https://api.yunzer.cn";
+const authLoginUrl = `${AUTH_CENTER}/auth/login`;
+const authRegisterUrl = `${AUTH_CENTER}/auth/register`;
+
 const stuck = ref(false);
 const menuOpen = ref(false);
 
@@ -118,6 +123,12 @@ const onHomeClick = () => {
           </div>
         </nav>
 
+        <!-- 登录 / 注册：跳转统一认证中心 -->
+        <div class="header-auth">
+          <a class="auth-link auth-link--login" :href="authLoginUrl">登录</a>
+          <a class="auth-link auth-link--register" :href="authRegisterUrl">试用</a>
+        </div>
+
         <button
           class="menu-toggle"
           type="button"
@@ -181,6 +192,8 @@ const onHomeClick = () => {
             >
               {{ item.label }}
             </RouterLink>
+            <a :href="authLoginUrl">登录</a>
+            <a :href="authRegisterUrl">试用</a>
           </div>
         </div>
       </nav>
@@ -403,6 +416,52 @@ const onHomeClick = () => {
   }
 }
 
+/* ---------- 登录 / 注册入口 ---------- */
+.header-auth {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  flex-shrink: 0;
+  margin-left: 24px;
+}
+
+.auth-link {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  height: 38px;
+  padding: 0 22px;
+  border-radius: 19px;
+  font-size: 14px;
+  font-weight: 600;
+  letter-spacing: 0.04em;
+  white-space: nowrap;
+  transition: color 0.2s ease, background-color 0.2s ease,
+    border-color 0.2s ease;
+
+  &--login {
+    color: @ink-700;
+    border: 1px solid @ink-300;
+    background: @white;
+
+    &:hover {
+      color: @blue-600;
+      border-color: @blue-600;
+    }
+  }
+
+  &--register {
+    color: @white;
+    background: @blue-600;
+    border: 1px solid @blue-600;
+
+    &:hover {
+      background: darken(@blue-600, 8%);
+      border-color: darken(@blue-600, 8%);
+    }
+  }
+}
+
 .menu-toggle {
   display: none;
   width: 30px;

website/src/views/common/DetailPage.vue

@@ -221,6 +221,10 @@ watch(() => `${section.value.key}|${slug.value}`, load, { immediate: true });
     grid-template-columns: minmax(0, 1fr) 340px;
     gap: 64px;
     align-items: start;
+    /* 全站容器 1680px 偏宽，详情页正文+侧栏收敛到 1400px 居中 */
+    max-width: 1400px;
+    margin-left: auto;
+    margin-right: auto;
   }
 }
 
@@ -390,6 +394,10 @@ watch(() => `${section.value.key}|${slug.value}`, load, { immediate: true });
 /* ---------------- 相关推荐 ---------------- */
 .detail-related {
   margin-top: 96px;
+  /* 与上方正文网格同宽对齐（1400px 居中） */
+  max-width: 1400px;
+  margin-left: auto;
+  margin-right: auto;
 
   &__head {
     display: flex;