Files
EmailBill/openspec/changes/archive/2026-02-12-simplify-calendar-holiday-highlight/tasks.md

41 lines
1.7 KiB
Markdown
Raw Normal View History

## 1. 模板结构调整
- [x] 1.1 在 Calendar.vue 模板中移除节假日徽章 `<span class="holiday-badge">` 元素
- [x] 1.2 确认 `.day-number` 元素保留 `day-holiday``day-workday` 类名(用于样式)
## 2. 样式重构 - 节假日背景
- [x] 2.1 将 `.day-holiday` 的渐变背景改为纯色(浅绿色),使用 CSS 变量或固定色值
- [x] 2.2 将 `.day-workday` 的渐变背景改为纯色(浅橙色),使用 CSS 变量或固定色值
- [x] 2.3 调整节假日文字颜色为深色系,确保可读性(绿色/橙色)
## 3. 样式清理
- [x] 3.1 删除 `.holiday-badge` 及其相关样式position, background, border-radius 等)
- [x] 3.2 移除 `.day-number``position: relative`(如果仅用于徽章定位)
- [x] 3.3 清理不再使用的 CSS 变量或注释
## 4. 状态优先级验证
- [x] 4.1 测试节假日 + 选中状态:确认选中状态优先显示
- [x] 4.2 测试节假日 + 有数据状态:确认交易金额显示不被遮挡
- [x] 4.3 测试节假日 + 其他月份:确认非当月日期的透明度正常
## 5. 功能回归测试
- [x] 5.1 验证长按节假日日期 500ms 后显示浮层
- [x] 5.2 验证浮层内容正确(节假日名称、类型)
- [x] 5.3 验证点击浮层外部可关闭
- [x] 5.4 确认普通周末(无 API 数据)仍正确显示为休息日
## 6. 无障碍性增强(可选)
- [x] 6.1 为节假日日期添加 `aria-label`(如 "2026-01-01 春节 休息日"
- [x] 6.2 确认屏幕阅读器能正确读取节假日信息
## 7. 视觉验证与调整
- [x] 7.1 在浅色主题下检查节假日颜色对比度
- [x] 7.2 在深色主题下检查节假日颜色对比度(如果支持)
- [x] 7.3 对比简化前后截图,确认视觉简洁性提升