Skip to content

Enhance UI themes and optimize performance for better user experience#25

Merged
nowscott merged 10 commits intomainfrom
developer
Mar 17, 2026
Merged

Enhance UI themes and optimize performance for better user experience#25
nowscott merged 10 commits intomainfrom
developer

Conversation

@nowscott
Copy link
Copy Markdown
Owner

No description provided.

- 将浅色主题背景色从 orange-50/50 改为更明确的 amber-50 (#fffbeb)
- 更新搜索框背景和边框颜色以增强视觉层次
- 同步调整移动端主题色 meta 标签和全局样式
- 保持深色主题颜色不变,确保夜间模式一致性
- 使用 `transition-[background-color,border-color,color]` 替代 `transition-all` 以减少不必要的属性动画,提升性能
- 为 `WebList` 和 `Tags` 组件添加 `React.memo` 以避免不必要的重新渲染
- 在主题切换期间(`.switching-theme`)禁用过渡和滤镜以减轻浏览器负担
- 实现基于 `document.startViewTransition` 的平滑主题切换动画,增强用户体验
- 统一各组件过渡时长为 300ms 或 400ms,确保视觉一致性
统一将浅色模式下的背景色从 sky-50/50 改为 sky-100/70,边框从 sky-200 改为 sky-300,文字颜色微调以提高对比度和视觉层次感。深色模式样式保持不变。
将深色主题背景色从墨绿色(#051005)统一改为纯黑色(#000000)和深灰(#1C1C1E, #2C2C2E),并调整相关组件的文本颜色和边框色以匹配新的配色方案,提升视觉一致性和现代感
在浅色和深色主题下分别为应用添加随机生成的纸张纹理背景
- 替换 pages/about.js 和 components/MainPage.js 中的硬编码背景类为 app-background
- 在 pages/_app.js 中添加 useEffect 钩子,在应用加载时随机生成 CSS 自定义属性值
- 在 styles/globals.css 中定义 app-background 类,使用 CSS 渐变和变量创建纸张纹理效果
将浅色主题的背景色从琥珀色(#fffbeb)改为石板色(#f4f7fb),并相应调整多个组件的边框、阴影和渐变颜色,以提供更现代和一致的视觉体验。同时优化了深色主题下的边框对比度和阴影细节。
将全局主题色从 slate-50 (#f4f7fb) 更改为 warm-neutral (#faf6ef),使整体色调更温暖。
更新了多个组件的背景渐变,使用基于橙/黄的暖色渐变替代了原有的蓝/天蓝色渐变。
同步更新了 _document.js 中的 theme-color meta 标签和 ThemeContext 中的逻辑。
调整 WebList 组件顶部边框和阴影样式,使其更符合设计语言
优化关于页面按钮的边框、渐变背景和悬停效果,增强交互视觉反馈
- 扩展搜索框提示文本以说明支持拼音搜索
- 在搜索结果过滤时动态更新可见标签,仅显示与当前搜索匹配的标签
- 当标签列表为空时显示相应的提示信息,提升用户体验
@vercel
Copy link
Copy Markdown
Contributor

vercel bot commented Mar 17, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
indwebindex Ready Ready Preview, Comment Mar 17, 2026 9:05am

移除 package-lock.json 的忽略规则,确保依赖锁文件被提交到版本控制中,以提高依赖安装的一致性和可复现性。
@nowscott nowscott merged commit 0cc4e85 into main Mar 17, 2026
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant