Skip to content

Commit 44ef5cf

Browse files
committed
fix(v2): render match-rom covers at full width in Safari
The manual "Match ROM" dialog wrapped each GameCard in a block-level cell, so the card's aspect-ratio-derived width resolved against a shrink-to-fit containing block. WebKit collapses that circular case to a near-zero width, rendering covers as thin slivers (Chromium is fine). Lay the cell out as a flex container so the card sizes via flex intrinsic sizing, the same path the gallery row already uses. Fixes #3761 Generated-By: PostHog Code Task-Id: 85199a96-11de-4403-a30e-e533cf9a8e48
1 parent 92e4074 commit 44ef5cf

1 file changed

Lines changed: 6 additions & 0 deletions

File tree

frontend/src/v2/components/MatchRom/MatchRomBodyGrid.vue

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -301,6 +301,12 @@ watch(
301301
/* Shrink-wrap the card's natural width and never shrink below it (a fixed
302302
-height card shrunk on the cross axis would crop its cover). */
303303
flex: 0 0 auto;
304+
/* Lay the card out as a flex item (not a block child). GameCard derives its
305+
width from a fixed height via the cover's `aspect-ratio`; as a block child
306+
of a shrink-to-fit cell that width resolution is circular, and WebKit
307+
(Safari) collapses it to a thin sliver. Flex intrinsic sizing resolves it
308+
correctly, the same path the gallery row already relies on. */
309+
display: flex;
304310
/* …but never wider than the grid: a wide cover (landscape provider art, or
305311
a card wider than a narrow phone) draws its width from the cover aspect
306312
and is otherwise unbounded, so it would spill past the right edge. Cap it

0 commit comments

Comments
 (0)