视口锁死响应式设计、侧边栏重构与 Shadcn 视觉打磨
实现了视口锁死响应式页面布局,避免出现双滚动条 Bug;重构了模块化的侧边栏导航组件;集成了 Shadcn UI 与全局色彩主题系统。
今日工作内容:
-
响应式视口布局与抗溢出设计 (Layout Reset):
- 编写了全局视口锁死布局,使用
overflow-hidden嵌套,对移动端/窄屏下的 Flex 布局追加了min-w-0重置,防止极窄屏幕下布局被撑大溢出。 - 优化了聊天流列表(vertical waterfall chat),舍弃了头像框,改用更纯粹、精致的对话气泡;限制了气泡的最大响应宽度比例。
- 优化了 Mac 顶栏拖拽控制区域(Drag Region),实现原生标题栏与应用主题配色的自然融为一体。
- 编写了全局视口锁死布局,使用
-
模块化侧边栏 (Modular Sidebar):
- 将侧边栏(Sidebar)进行组件化重构,集成了手风琴式的工作空间目录树导航,并为设置菜单等层级提供面包屑后退路由导航支持。
-
视觉走查与主题配置:
- 集成了
@shadcn/ui基础组件。在 CSS 中利用@theme重新声明注册了全站颜色自定义属性,修复了边界颜色渲染报错。 - 调试并通过了 Phase 1 阶段的 10 个关键 UAT 测试,主题存盘持久化及侧边栏跳转无故障。
- 集成了