803f09cc97
All checks were successful
Docker Build & Deploy / Build Docker Image (push) Successful in 27s
Docker Build & Deploy / Deploy to Production (push) Successful in 6s
Docker Build & Deploy / Cleanup Dangling Images (push) Successful in 2s
Docker Build & Deploy / WeChat Notification (push) Successful in 2s
- Introduced a new visual style for holiday highlights in the calendar component, replacing complex gradients with solid colors for better clarity. - Removed the holiday badge to reduce visual noise and enhance user experience. - Ensured that holiday information remains accessible through long-press interactions. - Updated specifications to reflect the new design decisions and requirements for both light and dark themes. - Added tasks for implementation, including style adjustments and accessibility enhancements.
1.7 KiB
1.7 KiB
1. 模板结构调整
- 1.1 在 Calendar.vue 模板中移除节假日徽章
<span class="holiday-badge">元素 - 1.2 确认
.day-number元素保留day-holiday和day-workday类名（用于样式）
2. 样式重构 - 节假日背景
- 2.1 将
.day-holiday的渐变背景改为纯色（浅绿色），使用 CSS 变量或固定色值 - 2.2 将
.day-workday的渐变背景改为纯色（浅橙色），使用 CSS 变量或固定色值 - 2.3 调整节假日文字颜色为深色系，确保可读性（绿色/橙色）
3. 样式清理
- 3.1 删除
.holiday-badge及其相关样式（position, background, border-radius 等） - 3.2 移除
.day-number的position: relative（如果仅用于徽章定位） - 3.3 清理不再使用的 CSS 变量或注释
4. 状态优先级验证
- 4.1 测试节假日 + 选中状态：确认选中状态优先显示
- 4.2 测试节假日 + 有数据状态：确认交易金额显示不被遮挡
- 4.3 测试节假日 + 其他月份：确认非当月日期的透明度正常
5. 功能回归测试
- 5.1 验证长按节假日日期 500ms 后显示浮层
- 5.2 验证浮层内容正确（节假日名称、类型）
- 5.3 验证点击浮层外部可关闭
- 5.4 确认普通周末（无 API 数据）仍正确显示为休息日
6. 无障碍性增强（可选）
- 6.1 为节假日日期添加
aria-label（如 "2026-01-01 春节 休息日"） - 6.2 确认屏幕阅读器能正确读取节假日信息
7. 视觉验证与调整
- 7.1 在浅色主题下检查节假日颜色对比度
- 7.2 在深色主题下检查节假日颜色对比度（如果支持）
- 7.3 对比简化前后截图，确认视觉简洁性提升