차트 수정

This commit is contained in:
2026-02-13 16:41:10 +09:00
parent b73867c65d
commit 276ef09d89
8 changed files with 421 additions and 177 deletions

View File

@@ -31,28 +31,28 @@ export function StockHeader({
: "text-foreground";
return (
<div className="bg-white px-3 py-2 dark:bg-brand-900/22 sm:px-4 sm:py-3">
<div className="bg-white px-3 py-1.5 dark:bg-brand-900/22 sm:px-4 sm:py-2">
{/* ========== STOCK SUMMARY ========== */}
<div className="flex items-start justify-between gap-3">
<div className="min-w-0">
<h1 className="truncate text-lg font-bold leading-tight text-foreground dark:text-brand-50 sm:text-xl">
<h1 className="truncate text-base font-bold leading-tight text-foreground dark:text-brand-50 sm:text-lg">
{stock.name}
</h1>
<span className="mt-0.5 block text-xs text-muted-foreground dark:text-brand-100/70 sm:text-sm">
<span className="mt-0.5 block text-[11px] text-muted-foreground dark:text-brand-100/70 sm:text-xs">
{stock.symbol}/{stock.market}
</span>
</div>
<div className={cn("shrink-0 text-right", colorClass)}>
<span className="block text-2xl font-bold tracking-tight">{price}</span>
<span className="text-xs font-medium sm:text-sm">
<span className="block text-xl font-bold tracking-tight sm:text-2xl">{price}</span>
<span className="text-[11px] font-medium sm:text-xs">
{changeRate}% <span className="ml-1 text-[11px] sm:text-xs">{change}</span>
</span>
</div>
</div>
{/* ========== STATS ========== */}
<div className="mt-2 grid grid-cols-3 gap-2 text-xs md:hidden">
<div className="mt-1.5 grid grid-cols-3 gap-2 text-xs md:hidden">
<div className="rounded-md bg-muted/40 px-2 py-1.5 dark:border dark:border-brand-800/45 dark:bg-brand-900/25">
<p className="text-[11px] text-muted-foreground dark:text-brand-100/70"></p>
<p className="font-medium text-red-500">{high || "--"}</p>
@@ -67,10 +67,10 @@ export function StockHeader({
</div>
</div>
<Separator className="mt-2 md:hidden" />
<Separator className="mt-1.5 md:hidden" />
{/* ========== DESKTOP STATS ========== */}
<div className="hidden items-center justify-end gap-6 pt-1 text-sm md:flex">
<div className="hidden items-center justify-end gap-5 pt-1 text-sm md:flex">
<div className="flex flex-col items-end">
<span className="text-muted-foreground text-xs dark:text-brand-100/70"></span>
<span className="font-medium text-red-500">{high || "--"}</span>