diff --git a/web/static/dev.html b/web/static/dev.html
index 915332a..ff1d207 100644
--- a/web/static/dev.html
+++ b/web/static/dev.html
@@ -16,6 +16,7 @@
--bg: #f7f7f7;
--panel: #ffffff;
--border: #e3e3e3;
+ --border-soft: #ececec;
--text: #222;
--muted: #888;
--accent: #c0392b;
@@ -37,7 +38,8 @@
}
button {
background: #fff; border: 1px solid var(--border);
- padding: 4px 10px; border-radius: 4px; cursor: pointer;
+ padding: 4px 10px; border-radius: 6px; cursor: pointer;
+ transition: color .15s, border-color .15s, background .15s, box-shadow .15s;
}
button:hover { background: var(--hover); }
button.primary { background: var(--accent); color: #fff; border-color: var(--accent); }
@@ -46,7 +48,7 @@
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
textarea, select {
background: #fff; border: 1px solid var(--border);
- padding: 5px 8px; border-radius: 4px; width: 100%;
+ padding: 5px 8px; border-radius: 6px; width: 100%;
}
input[type="checkbox"], input[type="radio"] { cursor: pointer; }
textarea { resize: vertical; min-height: 60px; }
@@ -143,8 +145,17 @@
header {
grid-area: head; background: #fff; border-bottom: 1px solid var(--border);
padding: 8px 14px; display: flex; align-items: center; gap: 12px;
+ box-shadow: 0 1px 2px rgba(0,0,0,.03);
}
- header .title { font-weight: 600; }
+ header .brand { display: flex; align-items: center; gap: 8px; }
+ header .brand .logo {
+ width: 24px; height: 24px; border-radius: 6px;
+ background: linear-gradient(135deg, var(--accent), #8e2a20);
+ color: #fff; font-weight: 700; font-size: 13px;
+ display: flex; align-items: center; justify-content: center;
+ box-shadow: 0 2px 6px rgba(192,57,43,.28);
+ }
+ header .title { font-weight: 600; font-size: 15px; letter-spacing: .2px; }
header .who { color: var(--muted); font-size: 12px; font-family: monospace; }
header .spacer { flex: 1; }
@@ -161,15 +172,16 @@
}
.pane-head .label { font-weight: 600; font-size: 13px; white-space: nowrap; flex-shrink: 0; }
.pane-head .spacer { flex: 1; }
- /* 对话顶栏按钮:语义化常态上色 — 完成 绿/导出 蓝/废弃 橙/删除 红 */
- #btn-done { color: #27ae60; border-color: #a9dfbf; }
- #btn-export { color: #2980b9; border-color: #aed6f1; }
- #btn-abandon { color: #e67e22; border-color: #f5cba7; }
- #btn-delete-task { color: #c0392b; border-color: #f5b7b1; }
- #btn-done:hover:not(:disabled) { background: #e9f7ef; }
- #btn-export:hover:not(:disabled) { background: #ebf5fb; }
- #btn-abandon:hover:not(:disabled) { background: #fef5e7; }
- #btn-delete-task:hover:not(:disabled) { background: #fdedec; }
+ /* 左 pane:title 行(#fafafa)下面的 filter / sort 子行换成白底 + 极淡分隔,弱化层级 */
+ #pane-left .pane-head + .pane-head {
+ background: #fff;
+ border-bottom: 1px solid var(--border-soft);
+ }
+ /* 对话顶栏按钮:常态中性 + hover 上语义色 — 完成 绿/导出 蓝/废弃 橙/删除 红 */
+ #btn-done:hover:not(:disabled) { color: #27ae60; border-color: #a9dfbf; background: #e9f7ef; }
+ #btn-export:hover:not(:disabled) { color: #2980b9; border-color: #aed6f1; background: #ebf5fb; }
+ #btn-abandon:hover:not(:disabled) { color: #e67e22; border-color: #f5cba7; background: #fef5e7; }
+ #btn-delete-task:hover:not(:disabled) { color: #c0392b; border-color: #f5b7b1; background: #fdedec; }
#pane-mid > .pane-head > button.small:disabled { opacity: 0.4; cursor: not-allowed; }
/* ───── floating dropdown menu ───── */
@@ -183,7 +195,7 @@
#floating-menu {
display: none; position: fixed;
min-width: 132px; background: #fff;
- border: 1px solid var(--border); border-radius: 4px;
+ border: 1px solid var(--border); border-radius: 6px;
box-shadow: 0 4px 14px rgba(0,0,0,0.12);
z-index: 60; padding: 4px 0;
}
@@ -233,7 +245,7 @@
min-height: 0; /* 同上,允许在 flex 容器里收缩 + 触发自身滚动 */
}
.msg {
- border: 1px solid var(--border); border-radius: 4px; padding: 8px 12px;
+ border: 1px solid var(--border); border-radius: 6px; padding: 8px 12px;
max-width: 92%;
}
.msg.user { background: var(--user-bg); align-self: flex-end; }
@@ -338,10 +350,10 @@
}
#src-picker-modal.show { display: flex; }
#src-picker-modal .card {
- background: var(--panel); border-radius: 6px;
+ background: var(--panel); border-radius: 8px;
width: 560px; max-height: 82vh;
display: flex; flex-direction: column;
- box-shadow: 0 8px 24px rgba(0,0,0,.15);
+ box-shadow: 0 12px 32px rgba(0,0,0,.18);
}
#src-picker-modal h3 {
margin: 0; padding: 14px 18px; font-size: 16px;
@@ -386,10 +398,8 @@
#src-picker-modal .actions .count {
flex: 1; font-size: 12px; color: var(--muted);
}
- #sp-copy { color: #1565c0; border-color: #aed6f1; }
- #sp-copy:hover:not(:disabled) { background: #ebf5fb; }
- #sp-move { color: #c77800; border-color: #f5cba7; }
- #sp-move:hover:not(:disabled) { background: #fef5e7; }
+ #sp-copy:hover:not(:disabled) { color: #1565c0; border-color: #aed6f1; background: #ebf5fb; }
+ #sp-move:hover:not(:disabled) { color: #c77800; border-color: #f5cba7; background: #fef5e7; }
#sp-copy:disabled, #sp-move:disabled { opacity: 0.4; cursor: not-allowed; }
/* ───── new task modal ───── */
@@ -399,8 +409,8 @@
}
#new-task-modal.show { display: flex; }
#new-task-modal .card {
- background: var(--panel); padding: 20px; border-radius: 6px;
- width: 420px; box-shadow: 0 8px 24px rgba(0,0,0,.15);
+ background: var(--panel); padding: 20px; border-radius: 8px;
+ width: 420px; box-shadow: 0 12px 32px rgba(0,0,0,.18);
}
#new-task-modal h3 { margin: 0 0 12px; font-size: 16px; }
#new-task-modal label { display: block; margin-top: 8px; font-size: 12px; color: var(--muted); }
@@ -414,10 +424,10 @@
}
#file-preview-modal.show { display: flex; }
#file-preview-modal .card {
- background: var(--panel); border-radius: 6px;
+ background: var(--panel); border-radius: 8px;
width: 90vw; height: 90vh; max-width: 1200px;
display: flex; flex-direction: column;
- box-shadow: 0 8px 24px rgba(0,0,0,.2);
+ box-shadow: 0 12px 32px rgba(0,0,0,.22);
}
#file-preview-modal .hdr {
display: flex; align-items: center; gap: 8px;
@@ -526,7 +536,10 @@
- zcbot
+
@@ -546,11 +559,11 @@
-