Skip to content

story: Wrap long questionnaire summaries inside their section - #3776

Merged
madcodelife merged 1 commit into
longbridge:mainfrom
vinhnx:fix/questionnaire-summary-wrap
Nov 3, 2026
Merged

madcodelife merged 1 commit into
longbridge:mainfrom
vinhnx:fix/questionnaire-summary-wrap

Conversation

@vinhnx

@vinhnx vinhnx commented Nov 3, 2026

Copy link
Copy Markdown
Contributor

Summary

Long debug summaries in the Questionnaire story overflowed their GroupBox and were clipped on both sides in the 748px documentation embed (?story=Questionnaire), as reported in #2997.

The answer/navigation/status lines, event logs, keyboard instructions, and focus line were laid out at their intrinsic width inside a fixed-width section. GPUI centered the overflow and the GroupBox's overflow_x_hidden cut off both ends.

  • Constrain those lines to the section width (w_full + text_center) so they wrap inside the card.
  • Replace the fixed .w(px(448.)) / .w(px(600.)) section widths with .max_w(...), matching the StatusBar fix in website: Fit StatusBar demo sections to narrow windows #3301, so the sections also shrink with narrower windows instead of pushing content past the card.

Verification

Built crates/story-web locally and rendered ?story=Questionnaire at 748×900 (documentation embed width) and 480×900 (minimum gallery window width).

  • Before: the Answers summary and the keyboard instructions were clipped at both card edges at 748px.
  • After: every line wraps inside the card; the 748px layout is otherwise unchanged, and the sections now fit a 480px window.

cargo fmt --all -- --check and cargo clippy -p gpui-component-story-web --no-deps --target wasm32-unknown-unknown -- --deny warnings pass.

No public API changes.

Part of #2997.

The Questionnaire story laid out its answer, navigation, event-log, and
keyboard-instruction lines at their intrinsic width inside a fixed-width
section. Long debug output, especially the Answers summary, overflowed the
GroupBox and was clipped on both sides in the 748px documentation embed.

Constrain those lines to the section width and keep them centered. Replace
the fixed section widths with maximums so the sections also shrink with
narrower windows instead of forcing their content past the card.

Verified by building story-web and rendering ?story=Questionnaire at 748px
and 480px viewports.
@madcodelife
madcodelife merged commit f6c2069 into longbridge:main Nov 3, 2026
18 checks passed
@madcodelife

Copy link
Copy Markdown
Member

Thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants