chenshoulin
8721e8ab0b
今日视图 - 补上「待办」组。此前只收 逾期 / 今天到期 / 进行中，导致待办列里没设 截止日期的任务在今日视图里完全消失 —— 用户明明有一堆事没做，却看到 「今天没有待办事项」。现在只要任务未完成且未归档，就必定出现在某个 分组里（归属优先级：逾期 > 今天到期 > 进行中 > 待办）。 - 统计卡片改为与分组一一对应（逾期 / 今天到期 / 进行中 / 本周完成）， 不再用「今日待办」这种把四组混在一起、与列表长度对不上的指标。 键盘操作（可访问性） - 卡片可聚焦（Tab / 点击），← → 换列、↑ ↓ 列内调序、Enter 打开详情。 - 换列时追加到目标列末尾：用全量长度而不是可见下标，筛选态下也安全； 列内调序要求该列渲染的是全量，否则禁用（与拖拽的规则一致）。 - 移动后手动恢复焦点 —— 卡片跨列会被重建，不恢复的话连续按键会失效。 深色模式 - 三态：跟随系统 / 浅色 / 深色，选择持久化到 localStorage。 - index.html 内联脚本在首帧之前应用主题，避免深色下闪白。 - 用 @custom-variant dark 做 class 控制（而不是纯 media query）， 才能支持「强制浅色」；html 的 color-scheme 让原生控件与滚动条跟随。 验证：单元测试 480 个、端到端测试 25 个全部通过，lint 与构建无错误。 截图脚本新增深色与移动端深色两组，便于后续对照。
37 lines
1.5 KiB
HTML
37 lines
1.5 KiB
HTML
<!doctype html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
|
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta name="theme-color" content="#0284c7" />
|
|
<meta name="description" content="轻量的个人看板工具，数据保存在本机浏览器" />
|
|
<meta name="mobile-web-app-capable" content="yes" />
|
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
|
|
<meta name="apple-mobile-web-app-title" content="看板" />
|
|
<title>看板 · 个人任务管理</title>
|
|
<script>
|
|
// 在首帧之前应用主题，避免深色模式下先闪一下白屏。
|
|
// 键名与 src/stores/theme.ts 中的 THEME_STORAGE_KEY 保持一致。
|
|
;(function () {
|
|
try {
|
|
var mode = localStorage.getItem('kanban.theme') || 'system'
|
|
var prefersDark =
|
|
window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
|
|
if (mode === 'dark' || (mode === 'system' && prefersDark)) {
|
|
document.documentElement.classList.add('dark')
|
|
}
|
|
} catch (error) {
|
|
// 读不到偏好就按浅色渲染，不影响使用
|
|
}
|
|
})()
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div id="app"></div>
|
|
<script type="module" src="/src/main.ts"></script>
|
|
</body>
|
|
</html>
|