Fix narrow embedded LPV movetext layout by markoub · Pull Request #20773 · lichess-org/lila · GitHub
Skip to content

Fix narrow embedded LPV movetext layout#20773

Open
markoub wants to merge 1 commit into
lichess-org:masterfrom
markoub:markoub/lpv-mobile-movetext
Open

Fix narrow embedded LPV movetext layout#20773
markoub wants to merge 1 commit into
lichess-org:masterfrom
markoub:markoub/lpv-mobile-movetext

Conversation

@markoub

@markoub markoub commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

Fixes #16977.

What changed

  • Stack showMoves: auto LPV embeds at widths up to 500px so the movetext panel does not keep the side-by-side minimum width.
  • Let the movetext side panel use the full embed width while preserving the existing board/control height budget and the 200px minimum board size.

Proof

At a 420px embedded LPV viewport, the old CSS kept the stacked movetext panel at 200px wide. With this patch, the same rendered fixture gives a 420px movetext panel and no horizontal document overflow.

LPV embed movetext comparison

Measured with Chromium against compiled bits.lpv CSS:

before: document.clientWidth=420, movesWidth=200, columns=200px
after:  document.clientWidth=420, movesWidth=420, columns=420px

Validation

  • ./ui/build bits --no-install
  • pnpm exec stylelint ui/bits/css/build/bits.lpv.scss
  • pnpm exec oxfmt --check ui/bits/css/build/bits.lpv.scss
  • git diff --check origin/master...HEAD
  • Chromium visual proof at 500, 480, 451, 450, 420, and 360px embed widths

AI assistance disclosure

I used OpenAI Codex to inspect the reported LPV embed layout issue, locate the relevant Sass entrypoint, implement this scoped CSS change, run the local validation commands above, and generate the manual Chromium proof image. I reviewed the final diff and can explain each line.

@markoub

markoub commented Jun 25, 2026

Copy link
Copy Markdown
Contributor Author

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.

lpv/ lpv embed gets movetext cut off at small viewports

1 participant