feat: 全局 UI 优化与邮件模板系统
- 新增动画系统 CSS 变量(时长、缓动函数、状态层透明度) - 新增 prefers-reduced-motion 媒体查询支持 - 优化按钮组件样式,移除渐变背景,添加涟漪效果 - 优化分享按钮错落有致的展开动画 - 优化评论区展开动画效果 - 新增设置面板 Material 3 风格分段控件 - 新增玻璃拟态(Glassmorphism)主题变体 - 新增新拟态(Neumorphism)主题变体 - 新增邮件模板系统(base.php、comment-notify.php、reply-notify.php) - 新增邮件模板后台设置(主题色、Logo、社交链接、预览功能) - 集成邮件模板到评论回复通知 - 版本更新至 1.5.0
This commit is contained in:
@@ -2,7 +2,7 @@
|
||||
|
||||
## Overview
|
||||
|
||||
本实现计划将 Argon 主题的 UI 优化分为 6 个主要任务,按照依赖关系顺序执行。首先建立动画系统基础,然后逐步优化各个组件,最后添加新的主题变体。
|
||||
本实现计划将 Argon 主题的 UI 优化分为多个主要任务,按照依赖关系顺序执行。首先建立动画系统基础,然后逐步优化各个组件,添加新的主题变体,最后实现统一的邮件模板系统。
|
||||
|
||||
## Tasks
|
||||
|
||||
@@ -95,17 +95,76 @@
|
||||
- 绑定点击事件切换样式
|
||||
- _Requirements: 6.5_
|
||||
|
||||
- [ ] 7. Checkpoint - 验证所有功能
|
||||
- [x] 7. Checkpoint - 验证 UI 优化功能
|
||||
- 确保所有样式修改正确应用
|
||||
- 测试各种浏览器兼容性
|
||||
- 验证暗色模式下的显示效果
|
||||
- 确保动画流畅无卡顿
|
||||
- 如有问题请询问用户
|
||||
|
||||
- [x] 8. 实现邮件模板基础系统
|
||||
- [x] 8.1 创建邮件模板目录和基础模板文件
|
||||
- 创建 email-templates/ 目录
|
||||
- 创建 email-templates/base.php 基础模板
|
||||
- 实现页眉、内容区、页脚三段式结构
|
||||
- 使用表格布局确保邮件客户端兼容性
|
||||
- _Requirements: 7.1, 7.7_
|
||||
- [x] 8.2 实现邮件模板渲染函数
|
||||
- 在 functions.php 中添加 argon_get_email_template() 函数
|
||||
- 添加 argon_render_email() 模板变量替换函数
|
||||
- 添加 argon_send_email() 统一邮件发送函数
|
||||
- _Requirements: 7.1_
|
||||
|
||||
- [x] 9. 实现邮件模板后台设置
|
||||
- [x] 9.1 添加邮件模板设置选项
|
||||
- 在 settings.php 中添加"邮件模板"设置区域
|
||||
- 添加主题色选择器(颜色选择器控件)
|
||||
- 添加 Logo 图片上传控件
|
||||
- 添加博客显示名称输入框
|
||||
- _Requirements: 7.2, 7.3_
|
||||
- [x] 9.2 添加页脚和社交链接设置
|
||||
- 添加页脚版权信息文本框
|
||||
- 添加社交链接输入组(Twitter、GitHub、微博等)
|
||||
- 实现设置保存和读取逻辑
|
||||
- _Requirements: 7.4_
|
||||
- [x] 9.3 实现邮件预览功能
|
||||
- 添加 AJAX 预览接口 argon_preview_email
|
||||
- 创建预览模态框 UI
|
||||
- 支持预览评论通知和回复通知两种类型
|
||||
- _Requirements: 7.8_
|
||||
|
||||
- [x] 10. 实现具体邮件类型模板
|
||||
- [x] 10.1 创建评论通知邮件模板
|
||||
- 创建 email-templates/comment-notify.php
|
||||
- 包含评论者名称、文章标题、评论内容
|
||||
- 添加"查看评论"按钮链接
|
||||
- _Requirements: 7.5_
|
||||
- [x] 10.2 创建评论回复通知邮件模板
|
||||
- 创建 email-templates/reply-notify.php
|
||||
- 包含原评论内容、回复者名称、回复内容
|
||||
- 添加"查看回复"按钮链接
|
||||
- _Requirements: 7.6_
|
||||
- [x] 10.3 集成邮件模板到现有通知逻辑
|
||||
- 修改 functions.php 中的评论通知发送逻辑
|
||||
- 替换原有邮件内容为新模板渲染结果
|
||||
- 确保向后兼容(设置为空时使用默认值)
|
||||
- _Requirements: 7.5, 7.6_
|
||||
|
||||
- [x] 11. Checkpoint - 验证邮件模板功能
|
||||
- 测试邮件模板设置保存和读取
|
||||
- 测试邮件预览功能
|
||||
- 发送测试邮件验证实际效果
|
||||
- 在 Gmail、Outlook 中验证显示效果
|
||||
- 如有问题请询问用户
|
||||
|
||||
## Notes
|
||||
|
||||
- 所有 CSS 修改应在 style.css 文件中进行
|
||||
- JavaScript 修改应在 argontheme.js 文件中进行
|
||||
- PHP 模板修改应在 template-parts/post-actions.php 中进行
|
||||
- 邮件模板文件放置在 email-templates/ 目录
|
||||
- 邮件模板设置添加到 settings.php
|
||||
- 邮件模板函数添加到 functions.php
|
||||
- 优先使用 CSS 变量以保持一致性和可维护性
|
||||
- 动画应使用 GPU 加速属性(transform, opacity)以确保性能
|
||||
- 邮件模板必须使用内联样式和表格布局以确保客户端兼容性
|
||||
|
||||
Reference in New Issue
Block a user