Fix: Standardize card fields for consistency

This commit is contained in:
gpt-engineer-app[bot]
2025-10-17 22:29:05 +00:00
parent ebd0f0fd56
commit 8f47dd899f
7 changed files with 88 additions and 79 deletions

View File

@@ -31,7 +31,7 @@ export function DesignerCard({ company }: DesignerCardProps) {
<div className="absolute inset-0 bg-gradient-to-br from-primary/5 via-transparent to-accent/5" />
{/* Company Type Badge */}
<div className="absolute top-3 left-3">
<div className="absolute top-3 right-3">
<Badge variant="secondary" className="text-xs bg-background/80 backdrop-blur-sm border border-border/50">
Designer
</Badge>
@@ -40,15 +40,17 @@ export function DesignerCard({ company }: DesignerCardProps) {
{/* Logo or Icon */}
<div className="relative z-10 flex items-center justify-center">
{company.logo_url ? (
<img
src={company.logo_url}
alt={`${company.name} logo`}
className="max-w-16 max-h-16 object-contain filter drop-shadow-sm"
loading="lazy"
/>
<div className="w-12 h-12 md:w-16 md:h-16 bg-background/90 rounded-xl overflow-hidden shadow-lg backdrop-blur-sm border border-border/50">
<img
src={company.logo_url}
alt={`${company.name} logo`}
className="w-full h-full object-contain p-2"
loading="lazy"
/>
</div>
) : (
<div className="w-12 h-12 text-muted-foreground/30">
<Ruler className="w-full h-full" />
<Ruler className="w-5 h-5" />
</div>
)}
</div>
@@ -72,26 +74,16 @@ export function DesignerCard({ company }: DesignerCardProps) {
{/* Location */}
{company.headquarters_location && (
<div className="flex items-center gap-2">
<MapPin className="w-3 h-3 text-muted-foreground flex-shrink-0" />
<span className="text-muted-foreground line-clamp-1">{company.headquarters_location}</span>
</div>
)}
{/* Rating */}
{company.average_rating > 0 && (
<div className="flex items-center gap-2">
<Star className="w-3 h-3 text-yellow-500 fill-yellow-500 flex-shrink-0" />
<span className="font-medium">{company.average_rating.toFixed(1)}</span>
{company.review_count > 0 && (
<span className="text-muted-foreground">({company.review_count} reviews)</span>
)}
<div className="flex items-center gap-1">
<MapPin className="w-3 h-3 flex-shrink-0" />
<span className="text-muted-foreground truncate">{company.headquarters_location}</span>
</div>
)}
</div>
{/* Stats Display */}
<div className="flex flex-wrap gap-x-4 gap-y-1 text-sm">
<div className="flex items-center justify-between text-sm">
<div className="flex flex-wrap gap-x-4 gap-y-1">
{company.ride_count && company.ride_count > 0 && (
<div className="flex items-center gap-1">
<FerrisWheel className="w-3 h-3 text-muted-foreground" />
@@ -115,6 +107,17 @@ export function DesignerCard({ company }: DesignerCardProps) {
<span className="text-muted-foreground">concepts</span>
</div>
)}
</div>
{company.average_rating > 0 && (
<div className="flex items-center gap-1">
<Star className="w-3 h-3 fill-yellow-400 text-yellow-400" />
<span className="text-sm font-medium">{company.average_rating.toFixed(1)}</span>
{company.review_count > 0 && (
<span className="text-xs text-muted-foreground">({company.review_count})</span>
)}
</div>
)}
</div>
</CardContent>
</Card>