Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
5a6da7e507 | ||
|
|
b58640beb2 | ||
|
|
140ba10df6 | ||
|
|
48c31388db | ||
|
|
68b0e4d0bd |
@@ -24,7 +24,7 @@ export default async function DevicesPage({
|
||||
</div>
|
||||
<Card className="bp-glass">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base">Known devices</CardTitle>
|
||||
<CardTitle className="text-sm">Known devices</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="flex flex-col gap-3">
|
||||
<DevicesTable devices={devices} />
|
||||
|
||||
+2
-2
@@ -18,7 +18,7 @@ export default async function DashboardPage() {
|
||||
return (
|
||||
<div className="flex flex-col gap-8">
|
||||
<Card className="bp-glass overflow-hidden">
|
||||
<CardContent className="flex flex-col items-start gap-4 py-8">
|
||||
<CardContent className="flex flex-col items-start gap-4 py-4">
|
||||
<BrandMark size={48} animated className="rounded-[9px]" />
|
||||
<h1 className="font-heading text-3xl font-semibold">Welcome back</h1>
|
||||
<p className="max-w-xl text-sm text-muted-foreground">
|
||||
@@ -56,7 +56,7 @@ export default async function DashboardPage() {
|
||||
|
||||
<Card className="bp-glass">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base">Recent sessions</CardTitle>
|
||||
<CardTitle className="text-sm">Recent sessions</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="flex flex-col gap-3">
|
||||
<SessionsTable sessions={recentSessions} />
|
||||
|
||||
@@ -72,7 +72,7 @@ export default async function SessionDetailPage({ params }: { params: Promise<{
|
||||
|
||||
<Card className="bp-glass">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base">Intensity timeline</CardTitle>
|
||||
<CardTitle className="text-sm">Intensity timeline</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<SessionTimelineChart timeline={timeline} />
|
||||
@@ -81,7 +81,7 @@ export default async function SessionDetailPage({ params }: { params: Promise<{
|
||||
|
||||
<Card className="bp-glass">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base">Devices</CardTitle>
|
||||
<CardTitle className="text-sm">Devices</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="flex flex-col gap-1">
|
||||
{detail.devices.map((d) => (
|
||||
|
||||
@@ -24,7 +24,7 @@ export default async function SessionsPage({
|
||||
</div>
|
||||
<Card className="bp-glass">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base">History</CardTitle>
|
||||
<CardTitle className="text-sm">History</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="flex flex-col gap-3">
|
||||
<SessionsTable sessions={sessions} />
|
||||
|
||||
+6
-5
@@ -181,12 +181,13 @@ body {
|
||||
}
|
||||
|
||||
/* Console-module surface: translucent + blurred so the animated background
|
||||
sweep shines through. ring-0 zeroes out Card's own default
|
||||
`ring-1 ring-foreground/10` (components/ui/card.tsx) - shadow-xl's
|
||||
box-shadow formula reads the same --tw-ring-shadow custom property, so
|
||||
without this the ring bleeds through regardless of shadow-xl "winning". */
|
||||
sweep shines through. Card's own default ring (components/ui/card.tsx:
|
||||
`ring-1 ring-foreground/10`) still shows - ring-accent recolors it to the
|
||||
accent token instead of resetting it. border-accent is currently a no-op
|
||||
(neither Card nor this rule sets a border-width utility to give it a
|
||||
border to color). */
|
||||
.bp-glass {
|
||||
@apply shadow-xl ring-0 border-0;
|
||||
@apply shadow-xs ring-accent border-accent;
|
||||
background: color-mix(in srgb, var(--card) 55%, transparent);
|
||||
backdrop-filter: blur(20px) saturate(150%);
|
||||
}
|
||||
|
||||
@@ -64,7 +64,29 @@ export function SessionTimelineChart({ timeline }: { timeline: TimelineRow[] })
|
||||
className="bp-readout text-xs"
|
||||
/>
|
||||
<YAxis domain={[0, 100]} tickLine={false} axisLine={false} width={32} className="bp-readout text-xs" />
|
||||
<ChartTooltip content={<ChartTooltipContent />} />
|
||||
<ChartTooltip
|
||||
content={
|
||||
<ChartTooltipContent
|
||||
formatter={(value, name) => {
|
||||
const itemConfig = config[name as string];
|
||||
return (
|
||||
<>
|
||||
<div
|
||||
className="h-2.5 w-2.5 shrink-0 rounded-[2px]"
|
||||
style={{ backgroundColor: itemConfig?.color }}
|
||||
/>
|
||||
<div className="flex flex-1 items-center justify-between gap-4 leading-none">
|
||||
<span className="text-muted-foreground">{itemConfig?.label ?? name}</span>
|
||||
<span className="bp-readout font-medium text-foreground">
|
||||
{typeof value === "number" ? value.toLocaleString() : String(value)}
|
||||
</span>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}}
|
||||
/>
|
||||
}
|
||||
/>
|
||||
{series.map(([sessionDeviceId]) => (
|
||||
<Area
|
||||
key={sessionDeviceId}
|
||||
|
||||
@@ -16,7 +16,7 @@ export function DeviceUsageTable({ devices }: { devices: DeviceUsageRow[] }) {
|
||||
return (
|
||||
<Card className="bp-glass">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base">Device usage</CardTitle>
|
||||
<CardTitle className="text-sm">Device usage</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="text-sm text-muted-foreground">No device activity yet.</CardContent>
|
||||
</Card>
|
||||
@@ -26,7 +26,7 @@ export function DeviceUsageTable({ devices }: { devices: DeviceUsageRow[] }) {
|
||||
return (
|
||||
<Card className="bp-glass">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base">Device usage</CardTitle>
|
||||
<CardTitle className="text-sm">Device usage</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<Table>
|
||||
|
||||
+1
-1
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "sexy",
|
||||
"version": "0.9.1",
|
||||
"version": "0.9.5",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev",
|
||||
|
||||
Reference in New Issue
Block a user