fix: spacing on icon page, lower cards

This commit is contained in:
Face 2025-05-27 15:06:37 +03:00
parent 0aa4849e76
commit ab6b6901db

View file

@ -355,7 +355,10 @@
<div class="mt-1 flex items-center gap-2"> <div class="mt-1 flex items-center gap-2">
<Badge variant="outline" class="text-lg">*{coin.symbol}</Badge> <Badge variant="outline" class="text-lg">*{coin.symbol}</Badge>
{#if $isConnectedStore} {#if $isConnectedStore}
<Badge variant="outline" class="border-green-500 text-xs text-green-500 animate-pulse"> <Badge
variant="outline"
class="animate-pulse border-green-500 text-xs text-green-500"
>
● LIVE ● LIVE
</Badge> </Badge>
{/if} {/if}
@ -539,8 +542,8 @@
<!-- Statistics Grid --> <!-- Statistics Grid -->
<div class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-4"> <div class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-4">
<!-- Market Cap --> <!-- Market Cap -->
<Card.Root> <Card.Root class="gap-1">
<Card.Header class="pb-2"> <Card.Header>
<Card.Title class="flex items-center gap-2 text-sm font-medium"> <Card.Title class="flex items-center gap-2 text-sm font-medium">
<DollarSign class="h-4 w-4" /> <DollarSign class="h-4 w-4" />
Market Cap Market Cap
@ -554,8 +557,8 @@
</Card.Root> </Card.Root>
<!-- 24h Volume --> <!-- 24h Volume -->
<Card.Root> <Card.Root class="gap-1">
<Card.Header class="pb-2"> <Card.Header>
<Card.Title class="flex items-center gap-2 text-sm font-medium"> <Card.Title class="flex items-center gap-2 text-sm font-medium">
<ChartColumn class="h-4 w-4" /> <ChartColumn class="h-4 w-4" />
24h Volume 24h Volume
@ -569,24 +572,25 @@
</Card.Root> </Card.Root>
<!-- Circulating Supply --> <!-- Circulating Supply -->
<Card.Root> <Card.Root class="gap-1">
<Card.Header class="pb-2"> <Card.Header>
<Card.Title class="flex items-center gap-2 text-sm font-medium"> <Card.Title class="flex items-center gap-2 text-sm font-medium">
<Coins class="h-4 w-4" /> <Coins class="h-4 w-4" />
Circulating Supply Circulating Supply
</Card.Title> </Card.Title>
</Card.Header> </Card.Header>
<Card.Content class="pt-0"> <Card.Content class="pt-0">
<p class="text-xl font-bold">{formatSupply(coin.circulatingSupply)}</p> <p class="text-xl font-bold">
<p class="text-muted-foreground text-xs"> {formatSupply(coin.circulatingSupply)}<span class="text-muted-foreground text-xs ml-1">
of {formatSupply(coin.initialSupply)} total of {formatSupply(coin.initialSupply)} total
</span>
</p> </p>
</Card.Content> </Card.Content>
</Card.Root> </Card.Root>
<!-- 24h Change --> <!-- 24h Change -->
<Card.Root> <Card.Root class="gap-1">
<Card.Header class="pb-2"> <Card.Header>
<Card.Title class="text-sm font-medium">24h Change</Card.Title> <Card.Title class="text-sm font-medium">24h Change</Card.Title>
</Card.Header> </Card.Header>
<Card.Content class="pt-0"> <Card.Content class="pt-0">