Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
本次修改重构了 ChatAction 组件,将原有的“展开式按钮”替换为更稳定的纯 CSS Tooltip 交互。解决了布局抖动问题,并实现了更整洁的 UI 风格。
Key Changes
代码重构 (chat.tsx)
移除冗余逻辑: 删除了用于计算按钮宽度的复杂 JS 逻辑 (useRef, getBoundingClientRect)。
简化组件: ChatAction 现在是一个简单的函数组件,专注于渲染图标和结构。
样式更新 (chat.module.scss)
Tooltip 实现:
text 标签现在作为 Tooltip 在鼠标悬浮时居中显示在按钮上方。
白底黑字风格: 采用浅色主题(白色背景、黑色文字、边框),符合你的审美偏好。
定位: 使用绝对定位 (bottom: 100%) 确保其悬浮在 UI 顶层,不影响文档流。
3.思考折叠 (thinking.tsx)
思考框思考中时默认展开,完成后自动折叠。
移除动画:
移除了宽度的过渡动画。
移除了鼠标悬停时的图标上浮动画,保证操作的稳定感。
层级控制: 添加 z-index: 100 防止被遮挡。