Skip to content

component: Fix text descender clipping - #3023

Open
huacnlee wants to merge 2 commits into
mainfrom
fix-text-descender-clipping
Open

component: Fix text descender clipping#3023
huacnlee wants to merge 2 commits into
mainfrom
fix-text-descender-clipping

Conversation

@huacnlee

@huacnlee huacnlee commented Sep 9, 2026

Copy link
Copy Markdown
Member

Summary

Text descendants that inherit a line height of 1 can lose the bottoms of g, y, p, q, and j when truncate() or an ancestor clips their line box, even when the outer control has enough space.

Use a default line height of 1.25 for Button, Toggle, Tab, Tag, GroupBox titles, DialogTitle, and DialogFooter. Let Checkbox and Radio labels inherit their text container's 1.25 line height instead of overriding it with 1.

Explicit Button, Toggle, and Tab frame sizes stay the same. Content-sized labels, titles, and tags may become slightly taller. This default addresses the reproduced font metrics; it does not guarantee that every custom font or explicitly constrained height will fit.

Align Checkbox and Radio indicators with the first text line by accounting for half of the additional line spacing. Wrapped labels keep first-line alignment, and indicators without content keep their original position.

Test Plan

  • Built and ran a temporary text clipping example with bundled IBM Plex Sans on macOS; the example was removed after verification.
  • Passed git diff --check.
  • Ran the example on macOS and visually checked descenders in the affected controls, including XS, SM, MD, and LG sizes. Compared the initial controls before and after the fix.
  • Visually checked Checkbox and Radio alignment with single-line labels, wrapped labels, and standalone indicators.
  • Windows and Linux visual checks were not run.

Implementation was generated with Codex and reviewed in this session.

Suggested .rules additions

For crates/component: Avoid forcing text-bearing containers to a line height of 1 for alignment when they or their descendants can clip text. Check descenders with a bundled font, including custom truncate() children; an adequate outer control height does not make a tight inner line box safe.

Release Notes:

  • Fixed clipped text descenders in compact controls, labels, and titles.

huacnlee and others added 2 commits September 9, 2026 14:46
Co-authored-by: Codex <codex@openai.com>
Remove the temporary text clipping example after visual verification.

Co-authored-by: Codex <codex@openai.com>
@huacnlee
huacnlee enabled auto-merge (squash) September 9, 2026 12:12
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