Skip to content

开源项目 · 导航起始页

StarDream-v3 星梦启航 V3

把常用站点和工具,收进一张会呼吸的桌面。

星梦启航 V3:模仿 iTab 的卡片式起始页,左侧是应用、代码、设计、摸鱼分类,中间是时钟和搜索框,背景可以换成图片或视频。

  • Vue
  • iTab
  • 导航页
  • 动态背景
StarDream-v3 首页:时钟、搜索框、分类侧栏和动态壁纸
V3 首页:时钟、搜索、分类侧栏与动态壁纸。
类型
导航起始页
技术
Vue 3 + Vite
路由
Vue Router(hash)
模块
应用 / 代码 / 设计 / 摸鱼

页面组成 ​

V3 把起始页拆成几个可以互相切换的模块:

  • AppList:应用卡片,按网格排列,带搜索。
  • CodeList:常用代码/工具入口。
  • DesignList:设计资源分类。
  • PlayList:摸鱼和娱乐入口。

还有搜索栏、时钟、每日一句、侧边栏、应用卡片和自定义弹窗。路由使用 hash 模式,切换分类时地址会变成 #/code、#/design、#/Play 这样的形式。

交互与视觉 ​

  • iTab 风格的卡片网格和分类侧栏。
  • 搜索框可以直接跳转到搜索引擎。
  • 自定义弹窗和过渡动画。
  • 背景支持图片 / 视频,窗口大小变化时重新计算应用列数。
  • 深色背景搭配半透明面板,适合做个人浏览器起始页。

本地运行 ​

bash
npm install
npm run dev

生产构建:

bash
npm run build

技术栈是 Vue 3 + Vite + Vue Router + ECharts + jQuery。项目没有单独的 README,部分应用数据仍是占位内容;想改成自己的导航页,先看 src/components/ 和 src/router/index.js,把数据源和链接替换掉。

说明 ​

这是星梦启航早期的 V3 实验版本,当前站点已经迁移到 VitePress。它更适合作为“iTab 风格起始页”的代码参考,不建议直接当成成熟产品部署;尤其是登录、数据持久化和移动端适配都需要自己补。

相关入口 ​

开源项目

喜欢这页纸,就去 GitHub 点个 Star。

问题、建议或想要的功能,欢迎在仓库里提 Issue。

打开 GitHub

本站收录内容源自互联网,不对其网站内容或交易负责。 | 如有内容侵犯权益,请联系站长删除相关内容!

今日和总访问量