fix: match the header logo size to the console

[easymac]

Status

READY

Description

The docs header logo rendered much larger than the same wordmark in the console. Starlight's SiteTitle.astro sizes the logo to fill the nav bar (height: calc(var(--sl-nav-height) - 2 * var(--sl-nav-pad-y))), which works out to 40px tall on desktop and 32px below the 50em breakpoint. The console renders the identical lockup at 22px ([&>svg]:h-5.5 in app/components/nav/app-sidebar.tsx).

This pins .site-title img to 1.5rem (24px) — a hair above the console's 22px, which read as slightly too small in the docs header.

Both SVGs share viewBox="0 0 642 140", so setting the height alone gives the matching width for free: 183.4px to 110.1px.

Worth knowing:

• The size is now fixed at every viewport. It previously grew from 32px to 40px at the 50em breakpoint, because --sl-nav-height changes there. The console has no responsive variants, so neither does this.
• Only height is overridden. Starlight's width: auto and max-width: 100% still apply, so the aspect ratio and the narrow-viewport clamp are unchanged.
• The rule is unlayered, so it beats Starlight's @layer starlight.core without !important. Moving it inside a layer would break that.

Verified in the dev server in both light and dark themes.