Display puzzle title on puzzle page outside the pause modal - #580
Display puzzle title on puzzle page outside the pause modal#580Abdellox wants to merge 2 commits into
Conversation
Fixes crosshare-org#573 The puzzle title was only visible inside the pause/begin overlay, not on the active puzzle page itself. This is a problem for puzzles where the title is a hint (e.g. 'Distant Lands'). Added a title bar below the TopBar that: - Shows the puzzle title when the puzzle is active (timer running or solved) - Is hidden when the pause/begin overlay is showing (redundant there) - Is hidden in Slate (embed) mode, where SlateHeader already shows the title - Truncates long titles with text-overflow: ellipsis to avoid multiline wrapping
|
Thanks for contributing! Can you post some screenshots of how this looks at different breakpoints? My strong inclination is to avoid adding a separate bar - especially on mobile where vertical space is often so constrained. |
Avoids adding an extra bar below the TopBar which takes mobile vertical space. The title is now rendered inside the existing header row using the built-in embedTitle styling (ellipsis truncation, flex-grow, hidden on narrow screens via media query). The TopBar already receives title as a prop (used in embed mode); adding a showTitle boolean lets the puzzle page opt into the same inline display when the puzzle is actively being solved. Changes: - TopBar: add showTitle prop; render title inside headerInner using embedTitle class when showTitle && !isEmbed && !isSlate - Puzzle: pass showTitle instead of rendering a separate div - Puzzle.module.scss: remove the standalone .puzzleTitle class
|
Thanks for the feedback, @mdirolf! I've reworked the implementation to avoid adding a separate bar. Instead of a new row below the TopBar, the title is now rendered inside the existing header row using the built-in
Regarding screenshots -- I don't have a running instance set up to capture them right now, but the change reuses the existing embed behavior (visible on desktop, hidden on narrow screens). You can preview by checking the updated diff. Happy to adjust further if you have a different placement in mind. |
Fixes #573
The puzzle title was only visible inside the pause/begin overlay, making it invisible while solving. This matters for puzzles where the title is a hint (e.g. 'Distant Lands').
Changes