CDF ·

视口锁死响应式设计、侧边栏重构与 Shadcn 视觉打磨

实现了视口锁死响应式页面布局,避免出现双滚动条 Bug;重构了模块化的侧边栏导航组件;集成了 Shadcn UI 与全局色彩主题系统。

Git Commit: 502f4bf

今日工作内容:

  1. 响应式视口布局与抗溢出设计 (Layout Reset)

    • 编写了全局视口锁死布局,使用 overflow-hidden 嵌套,对移动端/窄屏下的 Flex 布局追加了 min-w-0 重置,防止极窄屏幕下布局被撑大溢出。
    • 优化了聊天流列表(vertical waterfall chat),舍弃了头像框,改用更纯粹、精致的对话气泡;限制了气泡的最大响应宽度比例。
    • 优化了 Mac 顶栏拖拽控制区域(Drag Region),实现原生标题栏与应用主题配色的自然融为一体。
  2. 模块化侧边栏 (Modular Sidebar)

    • 将侧边栏(Sidebar)进行组件化重构,集成了手风琴式的工作空间目录树导航,并为设置菜单等层级提供面包屑后退路由导航支持。
  3. 视觉走查与主题配置

    • 集成了 @shadcn/ui 基础组件。在 CSS 中利用 @theme 重新声明注册了全站颜色自定义属性,修复了边界颜色渲染报错。
    • 调试并通过了 Phase 1 阶段的 10 个关键 UAT 测试,主题存盘持久化及侧边栏跳转无故障。