40 lines
1.8 KiB
TypeScript
40 lines
1.8 KiB
TypeScript
import Link from "next/link";
|
||
|
||
import { ScanClient } from "@/components/scan-client";
|
||
|
||
export default function ScanPage() {
|
||
return (
|
||
<main className="mx-auto min-h-screen max-w-5xl px-4 py-8 sm:px-6 lg:px-8">
|
||
<section className="grid gap-6 lg:grid-cols-[0.82fr_1.18fr]">
|
||
<div className="rounded-[36px] border border-white/70 bg-white/78 p-6 shadow-[0_30px_70px_rgba(115,76,42,0.14)] backdrop-blur">
|
||
<p className="text-sm font-medium tracking-[0.18em] text-[var(--copper)] uppercase">
|
||
扫码绑定
|
||
</p>
|
||
<h1 className="mt-4 font-[family-name:var(--font-display)] text-4xl leading-[1.15] text-[var(--ink)]">
|
||
对准老人手机里的家人连接二维码
|
||
</h1>
|
||
<p className="mt-4 text-base leading-8 text-[var(--muted)]">
|
||
扫描成功后，系统会自动把老人的本机 UUID 绑定到当前家属账号。之后，您就能看见老人的留言、最近对话和使用记录。
|
||
</p>
|
||
|
||
<div className="mt-6 space-y-3 rounded-[28px] bg-[var(--paper-soft)] p-5 text-sm leading-7 text-[var(--muted)]">
|
||
<p>1. 让老人打开安卓端的家人连接页。</p>
|
||
<p>2. 把镜头对准屏幕上的二维码，停稳一两秒。</p>
|
||
<p>3. 绑定成功后会自动跳回控制台。</p>
|
||
</div>
|
||
|
||
<div className="mt-6 flex flex-wrap gap-3">
|
||
<Link
|
||
href="/"
|
||
className="inline-flex h-12 items-center justify-center rounded-full border border-[var(--line)] bg-white px-5 text-sm font-semibold text-[var(--ink)] transition hover:bg-[var(--paper-soft)]"
|
||
>
|
||
回到控制台
|
||
</Link>
|
||
</div>
|
||
</div>
|
||
|
||
<ScanClient />
|
||
</section>
|
||
</main>
|
||
);
|
||
} |