mirror of https://github.com/helloxz/onenav.git
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
3.2 KiB
3.2 KiB
OneNav Modern Bootstrap 主题
主题特色
这是一个基于 Bootstrap 4 的简约现代化 OneNav 主题,经过精心优化,具有以下特点:
✨ 主要功能
- 🎨 简约设计: 干净简洁的白色背景,优雅的卡片式布局
- 📱 完全响应式: 完美适配手机、平板和PC端
- 🔍 实时搜索: 强大的实时搜索功能,支持标题、URL和描述搜索
- 🏷️ 分类导航: 顶部标签式分类导航,快速切换分类
- 🔒 私有标识: 私有链接和分类的可视化标识
- 📋 快捷操作: 一键复制链接、生成二维码
- ⌨️ 键盘支持: 支持快捷键操作(Ctrl+K 搜索,ESC 清除等)
🎯 设计理念
- 简约至上: 去除花里胡哨的装饰,专注内容本身
- 易读性: 高对比度配色,确保文字清晰可读
- 用户友好: 直观的交互设计,降低使用门槛
- 性能优化: 分页加载,避免性能问题
- 现代化: 符合当前简约设计趋势
<EFBFBD> 布局特性
- 非全宽: 使用 Bootstrap container 确保适宜的阅读宽度
- 网格布局: 使用 CSS Grid 实现灵活的响应式布局
- 卡片设计: 每个书签都是独立的卡片,信息层次清晰
- 操作按钮: 右下角集中放置所有浮动操作按钮
<EFBFBD>📱 响应式特性
- 桌面端: 自适应网格布局,最大化空间利用
- 平板端: 合理的卡片大小,保持良好可读性
- 手机端: 单列布局,触摸友好的操作
🎨 配色方案
- 主色调: Bootstrap 蓝色 (#007bff)
- 背景色: 浅灰色 (#f5f7fa) 提供舒适的视觉体验
- 卡片背景: 纯白色确保内容清晰
- 文字颜色: 深灰色确保良好的可读性
- 边框: 浅灰色边框提供清晰的视觉分隔
🚀 快捷功能
- 搜索快捷键:
Ctrl+K
或Cmd+K
快速搜索 - 清除搜索:
ESC
键清除搜索结果 - 返回顶部: 右下角快速返回顶部
- 分类过滤: 顶部标签快速过滤分类
🔧 技术特性
- Bootstrap 4.x 框架
- jQuery 3.x
- Font Awesome 4.7
- CSS3 Grid 布局
- HTML5 语义化标签
- 现代 JavaScript ES6+
使用说明
- 将主题文件放置在
templates/default3/
目录下 - 在后台管理中选择此主题
- 建议使用以下配置以获得最佳体验
推荐配置
full_width_mode
: 关闭(确保适宜的阅读宽度)link_description
: 显示(提供更多信息)favicon
: 在线获取(更好的视觉效果)
浏览器支持
- Chrome 60+
- Firefox 55+
- Safari 12+
- Edge 79+
- 移动端浏览器
更新日志
v1.0.0 (2025-08-14)
- 优化配色方案,提高可读性
- 修复分类导航文字可见性问题
- 改为非全宽布局,提供更好的阅读体验
- 使用 CSS Grid 优化书签卡片布局
- 将所有浮动按钮集中到右下角
- 简化动画效果,提升性能
- 优化移动端体验
v1.0.0 (2025-01-15)
- 初始版本发布
- 基于 Bootstrap 4 的全新设计
- 实现实时搜索功能
- 完全响应式布局
- 现代化用户界面
反馈与支持
如有问题或建议,请访问 OneNav 官网 获取支持。