Skip to content

Show all text format buttons in the question card on phones - #289

Merged
PhilReinking merged 4 commits into
mainfrom
fix/bits-294-toolbar-on-phones
Oct 17, 2026
Merged

PhilReinking merged 4 commits into
mainfrom
fix/bits-294-toolbar-on-phones

Conversation

@PhilReinking

Copy link
Copy Markdown
Contributor

What changed

On a phone, the text format buttons in an open question now wrap onto extra lines instead of scrolling sideways. All 12 show. Desktop is unchanged.

One class list changed in Editor.vue: the bar wraps at every width (it did only from lg up) and no longer scrolls sideways. The buttons already had the 44 px size.

Tested

Own server, headless Brave, an open question card, main vs this branch. Measured in the browser:

  • 360 px: 12 buttons, each at least 44 x 44 px, bar scrollWidth 272 = clientWidth 272 (before: 592 vs 272). Bar is 3 rows high.
  • 390 px: same, scrollWidth 302 = clientWidth 302 (before: 592 vs 302).
  • 1280 px: same button sizes (27 x 28 at the smallest) and same bar height (28 px) as on main.
  • npm run lint, npm run vue-tsc, npx vitest run (65 files, 504 tests) pass.

Screenshots, before and after side by side at 360, 390 and 1280 px, are on the ticket.

Not tested

Real phone. Only a headless browser at those widths.

I chose wrapping over a "More" button: it meets every criterion with one class change.

Steps after merge: none.

Fixes BITS-294

🤖 Generated with Claude Code

PhilReinking and others added 2 commits October 16, 2026 20:49
Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

@PhilReinking PhilReinking left a comment

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OK at 66005bb, one nit. Checked beyond the PR text in Brave at 360, 390, 800, 1024, 1280 px, in all three editors (question, end screen card, Settings end screen): 12 buttons, at least 44x44 below lg, no hidden scroll. The Settings box is narrower, so 4 rows there. From 1024 px the bar matches main. At 800 px main hid buttons too; now they wrap. Typing on a short phone screen keeps the text in view.

Comment thread CHANGELOG.md Outdated

### Fixed

- On a phone, the text format buttons in an open question now wrap onto a second line, so all of them show. Before, half were hidden past the edge. (#289)

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nit: on a phone it's 3 rows (4 in Settings), and it also covers the end screen text.

Suggested change
- On a phone, the text format buttons in an open question now wrap onto a second line, so all of them show. Before, half were hidden past the edge. (#289)
- On a phone, the text format buttons now wrap onto more lines, so all of them show. Before, half were hidden past the edge. (#289)

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

@PhilReinking PhilReinking left a comment

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OK at 62a3efc. Since 66005bb only the changelog line changed, and it now says what the bar does. CI green.

@PhilReinking PhilReinking left a comment

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OK at 0142b05, CI green. Re-check of the changelog merge only: merging main conflicted only in CHANGELOG.md and changes no other file. The code diff vs main is the same as at 62a3efc. The #289 line is word for word as before, 1 line added and 0 removed, right above the #284 line in Fixed. It merges cleanly with #287 and #290, in pairs and all 3 together. The OK at 62a3efc covers the rest.

@PhilReinking
PhilReinking merged commit 3635d9d into main Oct 17, 2026
6 checks passed
@PhilReinking
PhilReinking deleted the fix/bits-294-toolbar-on-phones branch October 17, 2026 00:32
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.

1 participant