feat(panel): resizable file panel width (180-420px, persisted) - #70
Open
moyu12-ae wants to merge 1 commit into
Open
feat(panel): resizable file panel width (180-420px, persisted)#70moyu12-ae wants to merge 1 commit into
moyu12-ae wants to merge 1 commit into
Conversation
Implement the resizable panel accepted in design.md: the panel's right edge offers a lightweight drag hot zone (no permanent handle icon, hover stripe only) to resize between 180px and 420px. The choice persists in localStorage and is applied at module load so the first paint already uses it. The hot zone hides with the panel, and pointer capture keeps the drag alive over iframes and selected text. Closes the width half of marswaveai#64.
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
1 participant
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.
解决的问题
实现 design.md 刚刚接受的「可调文件面板」规格，并彻底解决 issue #64 中「宽度不能拖动，长标题显示不全」的宽度部分（tooltip 缓解部分在 #68）。
改动内容
cursor: col-resize；按 design.md 要求不显示常驻把手图标，仅 hover / 拖拽中显示主题色细条反馈（color-mix(var(--link-color))派生，随主题适配）。180px–420px，默认仍为220px。localStorage('file-panel-width')，模块加载时先应用再渲染，首帧即为保存的宽度、无闪跳。margin-left与面板宽度共用同一 CSS 变量--file-panel-width，拖拽时正文实时让位，不会出现面板遮挡正文；实现说明
宽度全部走 CSS 变量：
#file-panel的width与body.show-file-panel #editor/#source-editor的margin-left引用同一--file-panel-width，两处永远同步（初版曾漏改 margin 一处导致遮挡，已在实测中修复并回归）。验证
tsc --noEmit、electron-vite build、check:theme-colors（12 主题）通过。