chun_qiu/subtrack
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(v1.11.0): 通行证/深渊模式、淡蓝配色与触控小键盘修复

Browse Source 
- 触控小键盘补回 3×4 网格样式：上一版重写 CSS 时漏掉了 .keypad/.key，
  按钮退化成行内小方块；现在恢复 46px 圆角键、⌫/✓ 功能键和「触控」开关态。
- 通行证（原「包赛季」）：整段有效期在独立日历上按套餐色连续着色（18% 透明度），
  每一格显示同一个「已完成 / 总单数」（0/1 或 1/1）；完成后色块保留并显示 1/1。
  沿用 season_done 记录完成日期，交互动线不变。
- 新增深渊模式：套餐设置周期天数 N 与周期数 X；开通时从开始日排出 X 个 N 天周期，
  结束日 = 开始日 + N×X − 1。周期内任意一天完成即算该周期完成；同一周期重复完成
  不重复计数；撤销该周期最后一条完成打卡会回退计数。独立日历连续着色，每格显示
  同一个「已完成周期 / 总周期数」。
- 全量把「包赛季」改名为「通行证」；套餐表单新增通行证 / 深渊选项，深渊显示 N/X 字段；
  客户开通表单、套餐批量开通、订阅列表、客户订阅卡片、日历待办行同步适配，
  通行证 / 深渊不再显示「追加时长」（提交也会被服务端拒绝）。
- 快速完成 / 批量完成对通行证改为整段完成，对深渊走周期打卡，不再错误地按日写打卡。
- 配色改为淡蓝 / 暗蓝：亮色用暗蓝主色 + 淡蓝纸底，暗色用海军蓝底 + 淡蓝强调；
  默认套餐色改为 #3B6EA5；大屏同步蓝调并修正热力图例与今日数字的对比度。
- 大屏页签排除通行证 / 深渊（它们不计每日热力，避免点开是空日历）；「今日待打」
  仍会列出待处理的通行证 / 深渊。
- 数据迁移：packages.abyss / packages.cycle_days / subscriptions.abyss /
  subscriptions.cycle_days，老库启动自动补列。
- 修复手机端整段色块把 7 列日历撑出屏幕：日历改成 minmax(0,1fr)，小屏色块缩小。
- 版本号 1.10.0 → 1.11.0。

验证：gofmt / go vet / go test 全绿；亮暗两套、1440 与 390 两档截图走查；
通行证 0/1 → 1/1、深渊 1/4 → 2/4、同周期重复完成不重复计数、撤销回退均实测通过。
This commit is contained in:
chun_qiu
2026-10-20 02:33:57 +08:00
parent 8b9c347649
commit bc5076ee41
25 changed files with 770 additions and 230 deletions
Download Patch File Download Diff File Expand all files Collapse all files
internal/web/static/app.css
+93 -46
View File
@@ -11,30 +11,30 @@
:root,
[data-bs-theme="light"] {
--app-bg: #f5f6f2;
--app-bg: #f4f7fb;
--app-surface: #ffffff;
--app-surface-2: #f8faf7;
--app-surface-3: #eef3ee;
--app-border: #e2e7df;
--app-border-strong: #cbd5cc;
--app-text: #16211c;
--app-text-2: #45564d;
--app-text-3: #55675d;
--app-accent: #1f6b52;
--app-accent-strong: #175844;
--app-accent-solid: #1f6b52;
--app-accent-solid-hover: #175844;
--app-accent-soft: #e6f1eb;
--app-accent-ink: #124434;
--app-surface-2: #f7f9fc;
--app-surface-3: #e9eff7;
--app-border: #dee6ef;
--app-border-strong: #c6d3e2;
--app-text: #14202b;
--app-text-2: #3d5064;
--app-text-3: #506478;
--app-accent: #2f5f9e;
--app-accent-strong: #244a7c;
--app-accent-solid: #2f5f9e;
--app-accent-solid-hover: #244a7c;
--app-accent-soft: #e8eff9;
--app-accent-ink: #1b3f6b;
--app-danger: #b3261e;
--app-danger-soft: #fbeae8;
--app-warn: #8a5200;
--app-warn-soft: #fdf3e3;
--app-info: #3c556e;
--app-info-soft: #eaf0f6;
--app-ring: rgba(31, 107, 82, 0.18);
--app-shadow-sm: 0 1px 2px rgba(16, 32, 24, 0.06);
--app-shadow: 0 18px 40px -28px rgba(16, 32, 24, 0.45);
--app-info: #4a5b6e;
--app-info-soft: #edf1f6;
--app-ring: rgba(47, 95, 158, 0.18);
--app-shadow-sm: 0 1px 2px rgba(20, 32, 43, 0.06);
--app-shadow: 0 18px 40px -28px rgba(20, 32, 43, 0.45);
--app-radius: 12px;
--app-radius-sm: 8px;
--app-sans: "Microsoft YaHei UI", "PingFang SC", "Hiragino Sans GB", "Noto Sans SC",
@@ -57,10 +57,10 @@
--bs-heading-color: var(--app-text);
--bs-link-color: var(--app-accent);
--bs-link-hover-color: var(--app-accent-strong);
--bs-primary: #1f6b52;
--bs-primary-rgb: 31, 107, 82;
--bs-success: #1f6b52;
--bs-success-rgb: 31, 107, 82;
--bs-primary: #2f5f9e;
--bs-primary-rgb: 47, 95, 158;
--bs-success: #2f5f9e;
--bs-success-rgb: 47, 95, 158;
--bs-border-radius: var(--app-radius);
--bs-border-radius-sm: var(--app-radius-sm);
--bs-border-radius-lg: 16px;
@@ -69,28 +69,28 @@
}
[data-bs-theme="dark"] {
--app-bg: #0c1310;
--app-surface: #131b17;
--app-surface-2: #17211c;
--app-surface-3: #1e2b24;
--app-border: #26362e;
--app-border-strong: #35493e;
--app-text: #e6f0ea;
--app-text-2: #b9ccc1;
--app-text-3: #8ea69a;
--app-accent: #5cc4a3;
--app-accent-strong: #7bd7b8;
--app-accent-solid: #2b7d61;
--app-accent-solid-hover: #339374;
--app-accent-soft: rgba(92, 196, 163, 0.14);
--app-accent-ink: #a9ecd6;
--app-bg: #0a111a;
--app-surface: #101a26;
--app-surface-2: #142131;
--app-surface-3: #1b2b3d;
--app-border: #223447;
--app-border-strong: #31485f;
--app-text: #e6eef7;
--app-text-2: #b4c6d8;
--app-text-3: #8aa0b6;
--app-accent: #6fa8dc;
--app-accent-strong: #93c4ee;
--app-accent-solid: #2b5d94;
--app-accent-solid-hover: #356ea9;
--app-accent-soft: rgba(111, 168, 220, 0.15);
--app-accent-ink: #b9dcfa;
--app-danger: #f08a82;
--app-danger-soft: rgba(240, 138, 130, 0.14);
--app-warn: #e0b072;
--app-warn-soft: rgba(224, 176, 114, 0.14);
--app-info: #9db4cc;
--app-info-soft: rgba(157, 180, 204, 0.14);
--app-ring: rgba(92, 196, 163, 0.24);
--app-ring: rgba(111, 168, 220, 0.24);
--app-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
--app-shadow: 0 24px 48px -28px rgba(0, 0, 0, 0.8);
--app-nav-h: 58px;
@@ -109,10 +109,10 @@
--bs-heading-color: var(--app-text);
--bs-link-color: var(--app-accent);
--bs-link-hover-color: var(--app-accent-strong);
--bs-primary: #2b7d61;
--bs-primary-rgb: 43, 125, 97;
--bs-success: #2b7d61;
--bs-success-rgb: 43, 125, 97;
--bs-primary: #2b5d94;
--bs-primary-rgb: 43, 93, 148;
--bs-success: #2b5d94;
--bs-success-rgb: 43, 93, 148;
--bs-border-radius: var(--app-radius);
--bs-border-radius-sm: var(--app-radius-sm);
--bs-border-radius-lg: 16px;
@@ -762,13 +762,14 @@ fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
overflow: hidden;
box-shadow: var(--app-shadow-sm);
}
.cal-dow { display: grid; grid-template-columns: repeat(7, 1fr); background: var(--app-surface-2); border-bottom: 1px solid var(--app-border); }
.cal-dow { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); background: var(--app-surface-2); border-bottom: 1px solid var(--app-border); }
.cal-dow span { padding: 8px 0; text-align: center; font-size: 0.75rem; color: var(--app-text-3); }
.cal-week { display: grid; grid-template-columns: repeat(7, 1fr); }
.cal-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cal-cell {
position: relative;
display: flex; flex-direction: column; gap: 4px;
min-width: 0;
min-height: 112px; padding: 8px 9px 10px 12px;
border-right: 1px solid var(--app-border);
border-bottom: 1px solid var(--app-border);
@@ -795,6 +796,26 @@ fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.cal-cell.heat-4 { background: color-mix(in srgb, var(--app-accent) 18%, transparent); }
.cal-cell.heat-1:hover, .cal-cell.heat-2:hover, .cal-cell.heat-3:hover, .cal-cell.heat-4:hover { background: var(--app-surface-2); }
/* 通行证 / 深渊：整段连续着色，每格显示同一个「已完成/总数」 */
.cal-cell.has-block {
background: color-mix(in srgb, var(--block) 18%, var(--app-surface));
border-color: color-mix(in srgb, var(--block) 24%, var(--app-border));
}
.cal-cell.has-block:hover { background: color-mix(in srgb, var(--block) 26%, var(--app-surface)); }
.cal-cell.has-block.today .dnum { background: var(--block); color: #fff; }
.cell-block {
display: inline-flex; align-items: center; gap: 4px;
align-self: flex-start;
padding: 1px 7px; border-radius: 999px;
font-family: var(--app-mono); font-size: 0.75rem; font-weight: 700;
color: var(--app-text);
background: color-mix(in srgb, var(--block) 20%, var(--app-surface));
border: 1px solid color-mix(in srgb, var(--block) 48%, transparent);
white-space: nowrap;
}
.cell-block::before { content: ""; width: 6px; height: 6px; border-radius: 2px; background: var(--block); }
.cal-cell > .cell-block:last-child { margin-top: auto; margin-bottom: 2px; }
.cell-top { display: flex; align-items: center; justify-content: space-between; gap: 4px; min-width: 0; }
.cell-badges { display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto; }
.dnum { font-family: var(--app-mono); font-size: 0.8125rem; font-weight: 700; line-height: 1.4; color: var(--app-text); }
@@ -843,7 +864,7 @@ fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.pkg-tabs a em { font-family: var(--app-mono); font-style: normal; font-size: 0.6875rem; color: var(--app-text-3); background: var(--app-surface-2); border-radius: 999px; padding: 0 6px; }
.pkg-tabs a:hover { border-color: var(--app-accent); color: var(--app-text); text-decoration: none; }
.pkg-tabs a.on { background: var(--app-accent-solid); border-color: var(--app-accent-solid); color: #fff; }
.pkg-tabs a.on em { background: rgba(255, 255, 255, 0.2); color: #fff; }
.pkg-tabs a.on em { background: rgba(0, 0, 0, 0.2); color: #fff; }
.pkg-tabs a.on i { background: #fff; }
/* ---------- 12. 当日抽屉 ---------- */
@@ -905,6 +926,29 @@ fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
}
.quick-hint { margin: 0 0 10px !important; font-size: 0.6875rem; line-height: 1.45; }
/* 触控小键盘：3 列 4 行，底行 ⌫ 0 ✓ */
.keypad { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 10px 0 12px; }
.keypad .key {
height: 46px; padding: 0;
border: 1px solid var(--app-border); border-radius: 10px;
background: var(--app-surface); color: var(--app-text);
font-family: var(--app-mono); font-size: 1.0625rem; font-weight: 600;
cursor: pointer; user-select: none;
transition: background 0.1s ease, border-color 0.1s ease, transform 0.06s ease;
-webkit-tap-highlight-color: transparent;
}
.keypad .key:hover { border-color: var(--app-accent); color: var(--app-accent); }
.keypad .key:active { transform: translateY(1px); background: var(--app-accent-soft); }
.keypad .key-fn { font-size: 0.9375rem; color: var(--app-text-2); background: var(--app-surface-2); }
.keypad .key-ok { background: var(--app-accent-solid); border-color: var(--app-accent-solid); color: #fff; font-size: 1.125rem; }
.keypad .key-ok:hover { background: var(--app-accent-solid-hover); border-color: var(--app-accent-solid-hover); color: #fff; }
.keypad-toggle { min-width: 44px; }
.keypad-toggle.on {
background: var(--app-accent-soft);
border-color: color-mix(in srgb, var(--app-accent) 40%, transparent);
color: var(--app-accent-ink);
}
.picker { margin: 8px 0 12px; padding: 10px; border: 1px solid var(--app-accent); border-radius: var(--app-radius-sm); background: var(--app-surface-2); }
.picker-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.picker-head h4 { font-size: 0.8125rem; }
@@ -1169,6 +1213,9 @@ fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.cell-load { display: none; }
.cell-count b { font-size: 1rem; }
.cell-count span { font-size: 0.625rem; }
.cell-block { font-size: 0.5625rem; padding: 1px 3px; gap: 2px; }
.cell-block::before { width: 4px; height: 4px; }
.cal-cell { padding-left: 6px; }
.cal-cell.today .dnum { width: 18px; height: 18px; }
.table { min-width: 0; }
/* 手机上隐藏低优先级列，避免横向滚动 */