Flatten dashboard sections and emphasize data regions

This commit is contained in:
2026-03-08 10:38:27 -04:00
parent 7a70545f09
commit 21246df434
16 changed files with 123 additions and 100 deletions

View File

@@ -192,7 +192,7 @@ export default function PortfolioPage() {
)}
>
{error ? (
<Panel>
<Panel variant="surface">
<p className="text-sm text-[#ffb5b5]">{error}</p>
</Panel>
) : null}
@@ -215,7 +215,7 @@ export default function PortfolioPage() {
</div>
<div className="grid grid-cols-1 gap-6 xl:grid-cols-2">
<Panel title="Allocation">
<Panel title="Allocation" variant="surface">
{loading ? (
<p className="text-sm text-[color:var(--terminal-muted)]">Loading chart...</p>
) : allocationData.length > 0 ? (
@@ -251,7 +251,7 @@ export default function PortfolioPage() {
)}
</Panel>
<Panel title="Performance %">
<Panel title="Performance %" variant="surface">
{loading ? (
<p className="text-sm text-[color:var(--terminal-muted)]">Loading chart...</p>
) : performanceData.length > 0 ? (
@@ -296,7 +296,7 @@ export default function PortfolioPage() {
</div>
<div className="grid grid-cols-1 gap-6 xl:grid-cols-[1.5fr_1fr]">
<Panel title="Holdings Table" subtitle="Live mark-to-market values from latest refresh.">
<Panel title="Holdings Table" subtitle="Live mark-to-market values from latest refresh." variant="surface">
{loading ? (
<p className="text-sm text-[color:var(--terminal-muted)]">Loading holdings...</p>
) : holdings.length === 0 ? (
@@ -409,7 +409,7 @@ export default function PortfolioPage() {
))}
</div>
<div className="hidden max-w-full overflow-x-auto lg:block">
<div className="data-table-wrap hidden max-w-full lg:block">
<table className="data-table min-w-[1020px]">
<thead>
<tr>
@@ -514,7 +514,7 @@ export default function PortfolioPage() {
)}
</Panel>
<Panel title={editingHoldingId === null ? 'Add Holding' : 'Edit Holding'}>
<Panel title={editingHoldingId === null ? 'Add Holding' : 'Edit Holding'} variant="surface">
<form onSubmit={submitHolding} className="space-y-3">
<div>
<label className="mb-1 block text-xs uppercase tracking-[0.16em] text-[color:var(--terminal-muted)]">Ticker</label>