From c3f5c0ff03b9674245da179771e9dec72ff76d04 Mon Sep 17 00:00:00 2001
From: kinghwj <kinghwj0605@icloud.com>
Date: Fri, 17 Jul 2026 13:28:08 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=B7=E6=96=B0=E6=8C=89=E9=92=AE=E6=94=B9?=
 =?UTF-8?q?=E7=94=A8=20span=20=E7=BB=93=E6=9E=84=20+=20flex=20=E5=B8=83?=
 =?UTF-8?q?=E5=B1=80=EF=BC=8C=E5=BD=BB=E5=BA=95=E4=BF=AE=E5=A4=8D=E9=AB=98?=
 =?UTF-8?q?=E5=BA=A6=E6=8A=96=E5=8A=A8\n\n=E9=97=AE=E9=A2=98=EF=BC=9A\n-?=
 =?UTF-8?q?=20width:120px=20+=20=E5=AD=97=E7=AC=A6=20=E2=86=BB=20=E5=9C=A8?=
 =?UTF-8?q?=E6=9F=90=E4=BA=9B=E5=AD=97=E4=BD=93=E4=B8=8B=E8=A2=AB=E5=BD=93?=
 =?UTF-8?q?=E6=88=90=E5=A4=A7=E5=B0=BA=E5=AF=B8=E5=AD=97=E7=AC=A6=E6=B8=B2?=
 =?UTF-8?q?=E6=9F=93\n-=20=E6=96=87=E5=AD=97=E5=BC=BA=E5=88=B6=E6=8D=A2?=
 =?UTF-8?q?=E8=A1=8C=E6=88=90=E4=B8=A4=E8=A1=8C=EF=BC=8C=E6=8C=89=E9=92=AE?=
 =?UTF-8?q?=E9=AB=98=E5=BA=A6=E6=9A=B4=E6=B6=A8=E5=88=B0=20150px+=20?=
 =?UTF-8?q?=E5=8F=98=E6=88=90=E7=AB=96=E9=95=BF=E6=96=B9=E5=BD=A2\n\n?=
 =?UTF-8?q?=E4=BF=AE=E5=A4=8D=EF=BC=9A\n-=20=E6=94=B9=E7=94=A8=20=E2=9F=B3?=
 =?UTF-8?q?=20(U+27F3)=20=E5=AD=97=E7=AC=A6=EF=BC=8C=E6=9B=B4=E7=A8=B3?=
 =?UTF-8?q?=E5=AE=9A\n-=20HTML=20=E7=BB=93=E6=9E=84=EF=BC=9A<span=20class?=
 =?UTF-8?q?=3D"btn-icon">=E2=9F=B3</span><span=20class=3D"btn-text">?=
 =?UTF-8?q?=E5=88=B7=E6=96=B0</span>\n-=20CSS=20=E6=94=B9=E7=94=A8=20displ?=
 =?UTF-8?q?ay:inline-flex=20+=20align-items:center=20+=20justify-content:c?=
 =?UTF-8?q?enter\n-=20=E5=9B=BA=E5=AE=9A=20height:36px=20+=20padding:0=201?=
 =?UTF-8?q?6px\n-=20JS=20=E9=80=9A=E8=BF=87=20.btn-text=20=E9=80=89?=
 =?UTF-8?q?=E6=8B=A9=E5=99=A8=E5=8D=95=E7=8B=AC=E6=9B=B4=E6=96=B0=E6=96=87?=
 =?UTF-8?q?=E5=AD=97=EF=BC=8C=E4=BF=9D=E7=95=99=E5=9B=BE=E6=A0=87=20span?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .workbuddy/memory/2026-07-17.md |  7 +++++++
 static/css/style.css            | 18 ++++++++++++++----
 static/js/app.js                |  7 ++++---
 templates/index.html            |  5 ++++-
 4 files changed, 29 insertions(+), 8 deletions(-)

diff --git a/.workbuddy/memory/2026-07-17.md b/.workbuddy/memory/2026-07-17.md
index df4f774..4a236ce 100644
--- a/.workbuddy/memory/2026-07-17.md
+++ b/.workbuddy/memory/2026-07-17.md
@@ -136,3 +136,10 @@
 
 ### 测试验证
 - /api/sync 返回 ok:true，406本书同步成功
+
+## 13:25 Flask 静态文件缓存导致 CSS 不生效
+
+- 现象：磁盘上 CSS 已更新（width:120px），但服务器仍返回旧版本
+- 原因：Flask 开发服务器缓存静态文件，修改后需重启服务才能生效
+- 解决：pkill + 重启 app.py
+- 提示用户浏览器也要 Cmd+Shift+R 强制刷新清除缓存
diff --git a/static/css/style.css b/static/css/style.css
index 39b7cfc..92e4e86 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -767,7 +767,8 @@ body {
 }
 
 .shelf-refresh-btn {
-    padding: 7px 16px;
+    padding: 0 16px;
+    height: 36px;
     border: 1px solid var(--border);
     border-radius: var(--radius-sm);
     font-size: 13px;
@@ -775,10 +776,19 @@ body {
     background: var(--bg-card);
     cursor: pointer;
     transition: color 0.2s, border-color 0.2s, opacity 0.2s;
-    white-space: nowrap;
-    width: 120px;
-    text-align: center;
     box-sizing: border-box;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: 4px;
+    flex-shrink: 0;
+    white-space: nowrap;
+}
+
+.shelf-refresh-btn .btn-icon {
+    display: inline-block;
+    font-size: 14px;
+    line-height: 1;
 }
 
 .shelf-refresh-btn:hover:not(:disabled) {
diff --git a/static/js/app.js b/static/js/app.js
index 62816b8..daf6e68 100644
--- a/static/js/app.js
+++ b/static/js/app.js
@@ -322,9 +322,10 @@ function filterByCategory(fullCategory) {
 
 async function refreshShelf() {
     const btn = document.getElementById("shelfRefreshBtn");
+    const textEl = btn.querySelector(".btn-text");
     btn.disabled = true;
     btn.classList.add("loading");
-    btn.textContent = "↻ 同步中...";
+    textEl.textContent = "同步中...";
 
     try {
         // Step 1: 从微信读书 API 同步数据到 MySQL
@@ -335,7 +336,7 @@ async function refreshShelf() {
         }
 
         // Step 2: 重新加载分类和书架
-        btn.textContent = "↻ 加载中...";
+        textEl.textContent = "加载中...";
         await loadShelfCategories();
         await loadShelf(1);
     } catch (e) {
@@ -344,7 +345,7 @@ async function refreshShelf() {
     } finally {
         btn.disabled = false;
         btn.classList.remove("loading");
-        btn.textContent = "↻ 刷新";
+        textEl.textContent = "刷新";
     }
 }
 
diff --git a/templates/index.html b/templates/index.html
index d839dca..803e317 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -125,7 +125,10 @@
                         <label class="filter-checkbox">
                             <input type="checkbox" id="finishedOnly"> 仅看已读完
                         </label>
-                        <button class="shelf-refresh-btn" id="shelfRefreshBtn" onclick="refreshShelf()" title="重新加载书架数据">↻ 刷新</button>
+                        <button class="shelf-refresh-btn" id="shelfRefreshBtn" onclick="refreshShelf()" title="重新加载书架数据">
+                            <span class="btn-icon">⟳</span>
+                            <span class="btn-text">刷新</span>
+                        </button>
                     </div>
                     <div class="shelf-info" id="shelfInfo"></div>
                 </div>