Repository navigation
Fill the chess board on phones - #14
Merged
Merged
Conversation
On an iPhone-width screen the board was capped at 72vw, so each piece was about 26px and square names sat on top of the glyphs. The board now uses the card width, pieces scale with the squares, and file/rank labels stay in a slim gutter. Co-authored-by: Weldon Sams <wsams@users.noreply.github.com>
Typing used a fixed fraction of the screen width, so the keyboard could cover the moves. The board and the field now pin to the visible viewport and the board shrinks only as much as the keyboard requires. Co-authored-by: Weldon Sams <wsams@users.noreply.github.com>
wsams
marked this pull request as ready for review
October 3, 2026 02:51
…fill-4fb2 # Conflicts: # web/app.css # web/app.js Co-authored-by: Weldon Sams <wsams@users.noreply.github.com>
Contributor
|
🎉 This PR is included in version 1.9.0 🎉 The release is available on GitHub release Your semantic-release bot 📦🚀 |
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
2 participants
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.
On a phone the board was locked to 72% of the screen width, so the squares stayed small and the piece glyphs were hard to read. It now uses the width of the card.
On an iPhone 14 Pro (393px) each square grows from about 31px to 44px, and the piece art fills that square instead of sitting in an 84% inset with a square name drawn over it. File letters and rank numbers stay in a slim gutter beside the board, so they still orient the position without covering the pieces.
When the moves field is focused, the board and the field pin to the visible area above the keyboard. The board stays as large as that space allows (nearly full width for a normal iPhone keyboard) and only shrinks further if the keyboard is especially tall. Clocks, captured pieces, and the action buttons tuck away while typing; the board still updates live as you type. Dismissing the keyboard restores them.
iPhone board before, narrow with small pieces
iPhone board after, full width with larger pieces
Board and moves field above an open keyboard
To show artifacts inline, enable in settings.