Skip to content

fix(docs): constrain content images and shrink demo GIF#3696

Merged
dgageot merged 1 commit into
mainfrom
docs/fix-tui-demo-image
Jul 17, 2026
Merged

fix(docs): constrain content images and shrink demo GIF#3696
dgageot merged 1 commit into
mainfrom
docs/fix-tui-demo-image

Conversation

@aheritier

Copy link
Copy Markdown
Contributor

Problem

On the TUI feature page, the demo GIF renders oversized and overflows the content column (pushing past the table of contents).

Two root causes:

  • The page embeds docs/demo.gif (intrinsic 2000×1600px) as a bare Markdown image.
  • docs/css/style.css had no general content-image constraint — only scoped .flow-diagram img and .demo-container img/video rules — so the GIF rendered at native 2000px.

Changes

  • docs/css/style.css — add a catch-all responsive rule so every in-article image scales to its container:
    .content img {
      max-width: 100%;
      height: auto;
    }
  • docs/demo.gif — re-encoded to reduce page weight (kept as a GIF):
    • 2000×1600 → 1280×1024 (2× the ~640px column, retina-crisp)
    • 25fps → 12.5fps
    • 1.0 MB → 555 KB (~46% smaller); full 14.7s animation preserved

Notes

The frozen .flow-diagram / .demo-container rules are untouched, and no Markdown pages were edited.

@aheritier
aheritier requested a review from a team as a code owner July 16, 2026 19:37
@aheritier aheritier added area/docs Documentation changes kind/fix PR fixes a bug (maps to fix:). Use on PRs only. labels Jul 16, 2026
@aheritier
aheritier force-pushed the docs/fix-tui-demo-image branch from 4abb351 to 670210a Compare July 17, 2026 07:27
The TUI feature page embedded demo.gif (2000x1600, 1.0MB) as a bare
Markdown image, and the stylesheet had no general content-image
constraint, so it overflowed the content column.

- Add .content img { max-width: 100%; height: auto } so in-article
  images scale to their container.
- Re-encode demo.gif to 1280x1024 at 12.5fps (1.0MB -> 555KB) while
  keeping the full animation.
@aheritier
aheritier force-pushed the docs/fix-tui-demo-image branch from 670210a to 4fb0bea Compare July 17, 2026 07:37
@dgageot
dgageot merged commit 96380ef into main Jul 17, 2026
18 checks passed
@dgageot
dgageot deleted the docs/fix-tui-demo-image branch July 17, 2026 07:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area/docs Documentation changes kind/fix PR fixes a bug (maps to fix:). Use on PRs only.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants