From a0f6a14b5dfda9282815d05d1113c076402c5e60 Mon Sep 17 00:00:00 2001
From: qing <1776177662@qq.com>
Date: Wed, 29 Jul 2026 11:05:20 +0800
Subject: [PATCH] =?UTF-8?q?style(dnfs):=20=E7=AC=94=E8=AE=B0=E5=8D=A1?=
 =?UTF-8?q?=E7=89=87=E5=B0=BA=E5=AF=B8=E9=9A=8F=E5=86=85=E5=AE=B9=E8=87=AA?=
 =?UTF-8?q?=E9=80=82=E5=BA=94?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- recommend-list 改为 flex 纵向布局，gap 统一间距，隐藏 JS 遗留 <br> 分隔符
- 卡片宽度 fit-content 包裹内容，min-width 240px 保底、max-width 100% 封顶
- 内容图片限宽防撑破自适应布局
---
 static/public/css/theme.css | 22 +++++++++++++++++++++-
 1 file changed, 21 insertions(+), 1 deletion(-)

diff --git a/static/public/css/theme.css b/static/public/css/theme.css
index 3627224..e6c6dfb 100644
--- a/static/public/css/theme.css
+++ b/static/public/css/theme.css
@@ -212,7 +212,27 @@ input[type="button"]:disabled {
 #article-content { font-size: 0.95rem; line-height: 1.7; margin-bottom: 1.25rem; }
 
 /* ===== Recommend List (dnfs) ===== */
-.recommend-list .card { margin-bottom: 0.75rem; width: 100%; max-width: none; }
+/* 卡片尺寸随内容自适应：宽度包裹内容（fit-content），上限为容器宽度；高度天然随内容伸缩 */
+.recommend-list {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 0.75rem;
+    width: 100%;
+}
+.recommend-list br { display: none; }	/* JS 追加的 <br> 分隔符，改由 flex gap 统一控制间距 */
+.recommend-list .card {
+    width: fit-content;
+    min-width: min(240px, 100%);
+    max-width: 100%;
+    margin-bottom: 0;
+}
+/* 防止内容中的大图撑破自适应宽度 */
+.recommend-list .card img {
+    max-width: 100%;
+    height: auto;
+    border-radius: var(--radius-sm);
+}
 .recommend-list center {
     cursor: pointer;
     padding: 0.4rem;