pacnpal/thrilltrack-explorer
1
0
Fork 0
mirror of https://github.com/pacnpal/thrilltrack-explorer.git synced 2025-12-22 12:31:12 -05:00
Code Issues Packages Projects Releases Wiki Activity

Refactor: Optimize card density

Browse Source
This commit is contained in:
gpt-engineer-app[bot]
2025-10-17 22:22:24 +00:00
parent fc53015448
commit ebd0f0fd56
7 changed files with 33 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/operators/OperatorCard.tsx
View File

@@ -27,7 +27,7 @@ const OperatorCard = ({ company }: OperatorCardProps) => {
onClick={handleClick}
>
{/* Logo/Image Section */}
<div className="aspect-[4/3] relative bg-gradient-to-br from-primary/20 via-primary/10 to-transparent overflow-hidden">
<div className="aspect-[3/2] relative bg-gradient-to-br from-primary/20 via-primary/10 to-transparent overflow-hidden">
{(company.card_image_url || company.card_image_id) ? (
<img
src={company.card_image_url || getCloudflareImageUrl(company.card_image_id, 'card')}
@@ -54,7 +54,7 @@ const OperatorCard = ({ company }: OperatorCardProps) => {
{/* Logo Display */}
<div className="absolute inset-0 flex items-center justify-center">
{company.logo_url ? (
<div className="w-20 h-20 bg-background/90 rounded-xl overflow-hidden shadow-lg backdrop-blur-sm border border-border/50">
<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`}
@@ -63,7 +63,7 @@ const OperatorCard = ({ company }: OperatorCardProps) => {
/>
</div>
) : (
<div className="w-20 h-20 bg-background/90 rounded-xl shadow-lg backdrop-blur-sm border border-border/50 flex items-center justify-center">
<div className="w-12 h-12 text-muted-foreground/30">
{getCompanyIcon()}
</div>
)}
@@ -72,9 +72,9 @@ const OperatorCard = ({ company }: OperatorCardProps) => {
)}
</div>
<CardContent className="p-4 space-y-3">
<CardContent className="p-3 space-y-2">
{/* Company Name */}
<h3 className="text-lg font-semibold group-hover:text-primary transition-colors line-clamp-2 min-h-[3.5rem]">
<h3 className="text-base font-semibold group-hover:text-primary transition-colors line-clamp-2">
{company.name}
</h3>