Repository navigation
Conversation
On a phone the ⋯ toggle opened the composer's controls as one no-wrap strip of 32px icon+label chips pinned to the row's bottom-right, over the attach button and the model picker. `nowrap` meant a strip wider than the space left of the toggle overflowed the screen instead of wrapping, and the ✕ was one more chip at the end of the strip. Make it a floating window over the composer instead: - components/ChatInput.tsx: the composer's fieldset (.chat-input-shell) becomes position: relative and the phone branch's controls container position: absolute at right: 4, bottom: 4. The panel's bottom edge lands on the composer's, so it covers the draft and the attach/model row and grows up over the transcript. All of it is the isMobile branch: the desktop chips keep their 32px row unchanged. - One 34px row per control, icon then label with the state at the right: Reasoning, Tools, Compact, Stop, Sound. The two rows that open a menu carry a small up-chevron, and their existing dropdowns are untouched and open above the panel, which is why the panel sets no overflow: an auto or hidden box would clip them. - Those two menus are sized for the screen inside the panel: right: 0 and maxWidth: calc(100vw - 16px), where they used to grow right from the row at left: 0 and put the tools menu's 288px past the edge; and maxHeight: calc(100dvh - 230px) with overflow-y: auto, the room above the panel's first row being the viewport less its own ~190px and that row's 34px, so a full reasoning list scrolls instead of running off the top of the screen. - A header row replaces the trailing ✕ chip: chat.moreControls in small mono capitals with the collapse button at its right, the container named #chat-controls-panel and role="group", aria-controls on the ⋯ toggle. Outside-click closing is unchanged: the panel stays inside the controlsMenuRef subtree, and so does the keyboard-open rule that hides it with the row. - No max height or scrolling on the panel itself: at most five rows are ever shown (idle has Reasoning, Tools, Compact, Sound; a run has Stop for the ones it drops), which is 184px measured. - i18n: five row labels, chat.controlsReasoning/Tools/Sound/On/Off, in en, zh-CN and zh-TW. - Docs: client-platform.md gains the phone controls panel note: the shell it anchors to, why it has no overflow, and how its two menus are kept on screen.
This branch has not been deployed
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.
Change tools fly-out from horizontal row to a vertical list.