fix(web): sidebar "Code" label no longer clips its letter tops

[akbarakma]

Problem

In the sidebar header, the "Code" label next to the T3 mark has its letters cut flat: the top of "C", the ascender of "d", and the bottoms of "C", "o", "d" and "e". It shows on the desktop app and in browsers that support text-box (Chromium, Safari 18.2+).

Change

The label combines [text-box:trim-both_cap_alphabetic] (added in #11906) with truncate. The trim shrinks the span's box to cap height, and truncate's overflow: hidden clips everything outside that box, which is exactly the overshoot of round letters and the "d" ascender.

This adds supports-[text-box:trim-both_cap_alphabetic]:py-1, the same guard WorkspaceBreadcrumbText and the menu item label already use for this combination. The padding is equal top and bottom, so the capitals stay centered on the T3 mark. Browsers without text-box render exactly as before.

Scope and approval

A very small, focused fix for an obvious visual bug: one class and a one-line comment in one file, with no behavior change.

Verification

• Desktop dev build (Electron 44, macOS Retina, interface size 18): captured the window with the fix toggled off and on. 37 device pixels come back, all on the clip edges: the top and bottom rows of "C", the top two rows of the "d" stem, and the bottom row of "o", "d", "e". Two "after" captures taken before and after the toggle are pixel-identical.
• Safari 27 (web dev build): the "Code" strokes shift 0 rows between before and after, the "d" ascender comes back, and the T3 mark is unchanged.
• Alignment at default size: computed cap box of "Code" is y 21.06–30.93, the T3 mark is 21.07–30.93.
• vp lint apps/web/src/components/sidebar/SidebarChrome.tsx --deny-warnings and vp run --filter @t3tools/web typecheck pass.
• Not checked: Windows and Linux desktop, Firefox, 1x displays.

Each square below is one screen pixel, enlarged 8x. The dashed lines mark the trimmed box; red marks the pixels the fix restores.

Before / after at 4x:

Before:

After:

Built with Claude Opus 5.5 through Claude Code, running in T3 Code.

[macroscopeapp]

Approvability

Verdict: Approved at fe1bdaf

Macroscope's review found this PR approvable — This is a one-file, support-gated styling fix that restores clipped glyph pixels in the sidebar label while leaving unsupported browsers unchanged. It introduces no API, default, deployment, security, or static-analysis changes.

^{You can add or adjust custom eligibility rules. Learn more.}

[coderabbitai]

Navigate logical layers of code changes, visualize relationships, and explore their blast radius.

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

• Configuration used: Repository: pingdotgg/t3code/.coderabbit.yaml
• Review profile: CHILL
• Plan: Advanced
• Run ID: f9df5d44-11e0-41a9-b377-226331b91fef

📥 Commits

Reviewing files that changed from the base of the PR and between 3e6b450 and fe1bdaf.

📒 Files selected for processing (1)

• apps/web/src/components/sidebar/SidebarChrome.tsx

Included review availability: This review used your included allowance. Your plan provides up to 10 included reviews per hour; 9 remain after this review.

---

📝 Walkthrough

Walkthrough

The sidebar wordmark text span applies vertical padding when the browser supports text-box: trim-both_cap_alphabetic. Unsupported browsers retain the existing truncation styling.

Changes

Sidebar wordmark

Layer / File(s)	Summary
Conditional wordmark padding apps/web/src/components/sidebar/SidebarChrome.tsx	The wordmark text span adds vertical padding when the browser supports text-box: trim-both_cap_alphabetic.

Priority: ⬇️ Low

Estimated code review effort: 1 (Trivial) | ~3 minutes

Change: Bug fix

Suggested reviewers: flamboh

Merge Risk: ⚪ Minimal · up to fe1bd

The sidebar wordmark receives conditional padding in supporting browsers. No actionable regression is established, so the change appears mergeable with normal checks.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 1 functions across 1 files.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly identifies the fix for clipping in the sidebar “Code” label.
Description check	✅ Passed	The description covers the problem, change, scope rationale, verification results, unchecked platforms, and before-and-after screenshots. It follows the repository template.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

• Fix all pre-merge checks with AI

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create a new PR

• Autopilot · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

---

_{Comment @coderabbitai help to get the list of available commands.}