fix: spacing on icon page, lower cards
This commit is contained in:
parent
0aa4849e76
commit
ab6b6901db
1 changed files with 16 additions and 12 deletions
|
|
@ -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">
|
||||||
|
|
|
||||||
Reference in a new issue