diff --git a/frontend/src/features/listings/components/ListingCard.vue b/frontend/src/features/listings/components/ListingCard.vue index 28868ad..776ce19 100644 --- a/frontend/src/features/listings/components/ListingCard.vue +++ b/frontend/src/features/listings/components/ListingCard.vue @@ -252,6 +252,10 @@ function formatStatNumber(value: number) { padding: 0; } +.listing-card-v2.compact .card-details { + gap: 7px; +} + .listing-card-v2.relaxed .card-details { align-content: center; gap: 14px; @@ -376,13 +380,20 @@ function formatStatNumber(value: number) { display: flex; align-items: center; gap: 8px; - height: 40px; + height: 36px; min-width: 0; - padding: 8px 10px; + padding: 6px 10px; border-radius: 10px; background: #f8fafc; } +.listing-card-v2.compact .skin-line, +.listing-card-v2.compact .resource-line { + height: 32px; + padding: 4px 8px; + border-radius: 8px; +} + .skin-line { overflow: hidden; border: 1px solid #edf2f7; @@ -409,7 +420,7 @@ function formatStatNumber(value: number) { .skin-count { flex: 0 0 auto; - padding: 3px 7px; + padding: 2px 7px; border-radius: 999px; background: #e0f2fe; color: #0369a1; @@ -433,6 +444,11 @@ function formatStatNumber(value: number) { font-weight: 900; } +.listing-card-v2.compact .resource-chip { + min-height: 24px; + padding: 0 9px; +} + .resource-chip em { overflow: hidden; font-style: normal;