CrematoriumStep: more generous compact card sizing

Image 140/200px (was 120/160), content padding 2.5 (was 2),
row gap 0.75 (was 0.5). Matches live site proportions better.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-30 21:57:18 +11:00
parent 97c9f9a961
commit 9d67c653ac

View File

@@ -145,14 +145,13 @@ export const CrematoriumStep: React.FC<CrematoriumStepProps> = ({
if (!loading) onContinue(); if (!loading) onContinue();
}} }}
> >
{/* ─── Compact crematorium card ─── */} {/* ─── Crematorium card ─── */}
<Card <Card
variant="outlined" variant="outlined"
padding="none" padding="none"
sx={{ sx={{
display: 'flex', display: 'flex',
overflow: 'hidden', overflow: 'hidden',
minHeight: 100,
mb: 4, mb: 4,
}} }}
> >
@@ -161,7 +160,7 @@ export const CrematoriumStep: React.FC<CrematoriumStepProps> = ({
role="img" role="img"
aria-label={`${crematorium.name} photo`} aria-label={`${crematorium.name} photo`}
sx={{ sx={{
width: { xs: 120, sm: 160 }, width: { xs: 140, sm: 200 },
flexShrink: 0, flexShrink: 0,
backgroundImage: `url(${crematorium.imageUrl})`, backgroundImage: `url(${crematorium.imageUrl})`,
backgroundSize: 'cover', backgroundSize: 'cover',
@@ -175,8 +174,8 @@ export const CrematoriumStep: React.FC<CrematoriumStepProps> = ({
display: 'flex', display: 'flex',
flexDirection: 'column', flexDirection: 'column',
justifyContent: 'center', justifyContent: 'center',
gap: 0.5, gap: 0.75,
p: 2, p: 2.5,
minWidth: 0, minWidth: 0,
}} }}
> >