The Cisco partner logo is scaled inside overflow-hidden, so the trademark is cropped #239

Closed
opened 2026-09-10 07:07:23 -05:00 by null · 0 comments
Owner

Found at build a25077d. Live on production since the tiles were built.

The Cisco mark ships in a 700x700 canvas it only fills 66% of (artwork bbox 118.6, 142.2, 462.3 x 388.6), so object-contain rendered it visibly smaller than the 8x8 logo beside it. Both pages compensated by scaling it up inside a clipping box:

  • /: p-1 overflow-hidden with scale-[1.5]: a 105px image in an 80px container, 13px cut off
  • /about: p-1 overflow-hidden with scale-[2]: a 112px image in a 64px container, 24px cut off

Reported on all ten device profiles, as clipped (blocking) and media_overflow (high).

Fix: crop the asset's own viewBox to the artwork plus an even margin (82 105 537 463) and drop the scale and the clipping box, so the tile's padding is the clear space. Nothing is scaled, nothing is clipped, and the mark now renders at 62x46 on /, the same size as the 8x8 logo next to it.

/about also moves from Cisco-Partner-Logo_trasnp_w.png to cisco-partner-logo-white.svg, which is the same artwork and takes the same crop, so there is one asset to keep correct rather than two. The PNG is left in public/ unreferenced rather than deleted in a CSS commit.

Verify: node scripts/device-sweep.mjs reports no clipped or media_overflow finding on / or /about; restoring scale-[1.5] overflow-hidden on Home makes it report both again.

Found at build a25077d. Live on production since the tiles were built. The Cisco mark ships in a 700x700 canvas it only fills 66% of (artwork bbox 118.6, 142.2, 462.3 x 388.6), so `object-contain` rendered it visibly smaller than the 8x8 logo beside it. Both pages compensated by scaling it up inside a clipping box: - `/`: `p-1 overflow-hidden` with `scale-[1.5]`: a 105px image in an 80px container, **13px cut off** - `/about`: `p-1 overflow-hidden` with `scale-[2]`: a 112px image in a 64px container, **24px cut off** Reported on all ten device profiles, as `clipped` (blocking) and `media_overflow` (high). Fix: crop the asset's own `viewBox` to the artwork plus an even margin (`82 105 537 463`) and drop the scale and the clipping box, so the tile's padding is the clear space. Nothing is scaled, nothing is clipped, and the mark now renders at 62x46 on `/`, the same size as the 8x8 logo next to it. `/about` also moves from `Cisco-Partner-Logo_trasnp_w.png` to `cisco-partner-logo-white.svg`, which is the same artwork and takes the same crop, so there is one asset to keep correct rather than two. The PNG is left in `public/` unreferenced rather than deleted in a CSS commit. Verify: `node scripts/device-sweep.mjs` reports no `clipped` or `media_overflow` finding on `/` or `/about`; restoring `scale-[1.5] overflow-hidden` on Home makes it report both again.
null added this to the Batch 19: Layout defects found by device emulation milestone 2026-09-10 07:07:23 -05:00
null added the
P2
bug
ui
labels 2026-09-10 07:07:23 -05:00
null closed this issue 2026-09-10 07:09:38 -05:00
Sign in to join this conversation.
No project
No Assignees
1 Participants
Notifications
Due Date
The due date is invalid or out of range. Please use the format 'yyyy-mm-dd'.

No due date set.

Dependencies

No dependencies set.

Reference: null/Queue-North-Website#239
No description provided.