fae8dea971
fix(QrCodePreview): use shadcn Button instead of manual button styles
...
Replace hand-written button class strings with shadcn Button component
using outline and default variants. Removes ~15 lines of duplicated
Tailwind classes.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com >
2026-05-27 13:50:36 +08:00
da667ccb13
refactor: 重构 QrCodePreview 组件，继承 HTMLDiv 属性并统一 shadcn 样式
...
- 组件改为继承 `React.HTMLAttributes<HTMLDivElement>`，支持外部传入 className 和事件
- 使用 `cn()` 函数合并外部类名
- 空白状态改用 `border border-dashed` 和更浅的 `bg-muted/40` 背景
- 正常状态改为纯白背景柔边圆角容器包裹二维码，确保暗黑模式下黑白对比度
- 下载/复制按钮完全对齐 shadcn 的 Outline 与 Default 样式规范
- 更新测试用例中的 alt 文本为 "QR Code Preview"
2026-05-22 20:48:14 +08:00
de7da9f1db
fix: 修复暗黑模式样式兼容性
...
- 在 tailwind.config.js 中启用 darkMode: 'class' 并扩展语义化颜色变量
- 将全项目硬编码颜色（bg-white、text-gray-*、border-gray-* 等）替换为语义化类名
- 修复 popup/index.html 硬编码浅色背景色
- 同步更新相关单元测试中的类名断言
2026-05-22 16:04:50 +08:00
83bf9dd342
用 Tailwind CSS 重写 QrCode 页面及相关组件
2026-05-21 23:46:44 +08:00
8e2ac5200d
fix(i18n): 统一使用 useLazyTranslation 避免翻译 key 闪烁
2026-05-21 00:50:01 +08:00
2870e01610
refactor(qrcode): 提取独立组件并添加单元测试
...
- 创建 pages/QrCode/types.ts 定义状态类型接口
- 提取 QrCodePreview 组件用于二维码预览和操作
- 提取 ImageUploader 组件封装图片上传、拖拽、粘贴逻辑
- 重构 UrlToQrCodeSection 状态提升到父组件
- 重构 QrCodeToUrlSection 通过回调传递解析结果
- 更新主页面 index.tsx 集中管理所有状态
- 为 QrCodePreview 和 ImageUploader 添加单元测试 (23 个用例)
2026-05-20 21:59:57 +08:00
雨霖铃