improve web ui

2026-06-26 05:43:34 +00:00
parent 764c814483
commit 187738ed86
73 changed files with 3373 additions and 2847 deletions
@@ -1,45 +1,45 @@
-import type { Meta, StoryObj } from '@storybook/react-vite'
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
 import {
-  Card,
-  CardContent,
-  CardDescription,
-  CardFooter,
-  CardHeader,
-  CardTitle,
-} from '@/components/ui/card'
-import { Button } from '@/components/ui/button'
-import { Badge } from '@/components/ui/badge'
+	Card,
+	CardContent,
+	CardDescription,
+	CardFooter,
+	CardHeader,
+	CardTitle,
+} from "@/components/ui/card";

 const meta = {
-  title: 'UI/Card',
-  component: Card,
-  // Card requires `children`; every story supplies its own via `render`, so this
-  // is just a placeholder to satisfy the arg type.
-  args: { children: null },
-} satisfies Meta<typeof Card>
+	title: "UI/Card",
+	component: Card,
+	// Card requires `children`; every story supplies its own via `render`, so this
+	// is just a placeholder to satisfy the arg type.
+	args: { children: null },
+} satisfies Meta<typeof Card>;

-export default meta
-type Story = StoryObj<typeof meta>
+export default meta;
+type Story = StoryObj<typeof meta>;

 export const HostCard: Story = {
-  render: () => (
-    <Card className="max-w-sm">
-      <CardHeader>
-        <div className="flex items-center justify-between">
-          <CardTitle>ENRICOS-DESKTOP</CardTitle>
-          <Badge variant="success">online</Badge>
-        </div>
-        <CardDescription>RTX 5070 Ti · NVENC · 5120×1440 @ 240</CardDescription>
-      </CardHeader>
-      <CardContent className="text-sm text-muted-foreground">
-        Paired 2 days ago. Last session 11 ms p50 capture→present.
-      </CardContent>
-      <CardFooter className="gap-2">
-        <Button size="sm">Connect</Button>
-        <Button size="sm" variant="outline">
-          Details
-        </Button>
-      </CardFooter>
-    </Card>
-  ),
-}
+	render: () => (
+		<Card className="max-w-sm">
+			<CardHeader>
+				<div className="flex items-center justify-between">
+					<CardTitle>ENRICOS-DESKTOP</CardTitle>
+					<Badge variant="success">online</Badge>
+				</div>
+				<CardDescription>RTX 5070 Ti · NVENC · 5120×1440 @ 240</CardDescription>
+			</CardHeader>
+			<CardContent className="text-sm text-muted-foreground">
+				Paired 2 days ago. Last session 11 ms p50 capture→present.
+			</CardContent>
+			<CardFooter className="gap-2">
+				<Button size="sm">Connect</Button>
+				<Button size="sm" variant="outline">
+					Details
+				</Button>
+			</CardFooter>
+		</Card>
+	),
+};