fix(web): align the sidebar T3 Code lockup on a shared baseline

[meisolated]

The wordmark and "Code" in the sidebar header were centered as two separate flex boxes, with a -translate-y-px nudge on the text to make them look level. Centering aligns boxes, not baselines, so the pair only lined up for a font whose ascent and descent match the default stack. With a custom interface font (Settings -> Appearance) the word drifts above the mark — measured ~2px on THICCCBOI (0.80em/0.20em) vs Segoe UI (1.079em/0.251em) — and the fixed 1px nudge does not scale with the interface font size either.

Now the mark and the word share one line box, so the mark rides the text baseline as an inline replaced element and follows whatever font is set. align-baseline overrides Tailwind preflight's svg { vertical-align: middle }. The fixed gap-1 becomes a real word space that scales with the font.

Before

"Code" sits ~2px above the mark's baseline (interface font THICCCBOI at 16px).

After

Mark and word end on the same baseline row.

---

Note

Low Risk
Cosmetic sidebar header markup/CSS only; no auth, data, or routing behavior changes.

Overview
Reworks the desktop sidebar “T3 Code” brand so the SVG wordmark and label share one inline line box instead of sitting in separate flex children with a fixed -translate-y-px offset.

The link drops gap-1 between siblings; the mark and “Code” live in a single truncating text-sm span with a normal word space between them. T3Wordmark switches from shrink-0 block-style sizing to inline + align-baseline so the SVG follows the text baseline (overriding preflight’s vertical-align: middle on SVGs), which fixes misalignment when users pick a custom interface font or change font size.

The threadSidebarWidth regression test is updated to assert the new link class string (overflow-hidden instead of gap-1).

^{Reviewed by Cursor Bugbot for commit f3713a0. Bugbot is set up for automated code reviews on this repo. Configure here.}

Note

Align the T3 Code wordmark SVG to the text baseline in the sidebar

Fixes a visual misalignment between the T3Wordmark SVG and the "Code" label in the sidebar brand link. The SVG's class is changed from block/flex layout to inline with align-baseline, and the two elements are wrapped in a single truncating span, replacing the previous flex gap approach.

^{Macroscope summarized f3713a0.}

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 8a2d3eb3-da34-40b0-a27b-bab405e16482

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

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

[macroscopeapp]

One blocking issue: the class-string change breaks an existing source-text assertion in threadSidebarWidth.test.ts. Details inline.

^{Posted via Macroscope — UI Consistency}

[macroscopeapp]

Approvability

Verdict: Approved 0b8bf89

Pure CSS layout fix adjusting text/icon baseline alignment in the sidebar brand lockup. No logic or runtime behavior changes - only Tailwind class modifications and corresponding test update.

^{You can customize Macroscope's approvability policy. Learn more.}

Dismissing prior approval to re-evaluate 0b8bf89