fix(anfragencenter): use aspectRatio 3/2 for match card images like PropertyIntelligenceCard

Replaces fixed height: 90px with aspectRatio: '3/2' — the same ratio used in
supply property cards. Ensures consistent, undistorted image crops across all
card surfaces. objectFit: cover guaranteed via <img> element.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Benjamin Sutter
2026-06-10 23:47:11 +02:00
parent cf9089b5a2
commit f783cf6881
@@ -92,20 +92,19 @@ export function RelatedPropertyCardPanel({ propertyId, inquiryId, compact }: Rel
>
<Box
sx={{
height: 80,
aspectRatio: '3/2',
borderRadius: 1.5,
overflow: 'hidden',
bgcolor: '#e8e7e4',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
bgcolor: '#f4f3f0',
}}
>
{image ? (
<Box component="img" src={image} alt={property.title}
sx={{ width: '100%', height: '100%', objectFit: 'cover', display: 'block' }} />
) : (
<Building2 size={32} color="#94a3b8" />
<Box sx={{ width: '100%', height: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
<Building2 size={32} color="#94a3b8" />
</Box>
)}
</Box>
@@ -193,8 +192,8 @@ function MatchSliderCard({ match }: { match: AdditionalPropertyMatch }) {
},
}}
>
{/* Image with consistent aspect ratio */}
<Box sx={{ position: 'relative', height: 90, overflow: 'hidden', bgcolor: '#f4f3f0' }}>
{/* Image — same aspectRatio: '3/2' as PropertyIntelligenceCard */}
<Box sx={{ position: 'relative', aspectRatio: '3/2', bgcolor: '#f4f3f0', overflow: 'hidden' }}>
{match.imageUrl ? (
<Box
component="img"
@@ -203,7 +202,7 @@ function MatchSliderCard({ match }: { match: AdditionalPropertyMatch }) {
sx={{ width: '100%', height: '100%', objectFit: 'cover', display: 'block' }}
/>
) : (
<Box sx={{ height: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
<Box sx={{ width: '100%', height: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
<Building2 size={20} color="#94a3b8" />
</Box>
)}