dekun
a487b17165
Use numeric /learn/{num} routes, register Tailwind coin animations with方孔铜钱 UI, expand to 34 provinces, and surface missing OPENAI_API_KEY clearly.
Co-authored-by: Cursor <cursoragent@cursor.com>
56 lines
1.7 KiB
TypeScript
56 lines
1.7 KiB
TypeScript
import Link from "next/link";
|
||
import PageShell from "@/components/page-shell";
|
||
import {
|
||
getGuaName,
|
||
guaNumFromMark,
|
||
listGuaMarks,
|
||
} from "@/lib/content/zhouyi";
|
||
|
||
export default async function LearnPage() {
|
||
const guaMarks = await listGuaMarks("traditional");
|
||
|
||
return (
|
||
<PageShell className="max-w-3xl px-4 py-8">
|
||
<div className="mb-6">
|
||
<h1 className="text-2xl font-bold">易经学习</h1>
|
||
<p className="mt-2 text-muted-foreground">
|
||
周易六十四卦原文详解（繁体精简版）
|
||
</p>
|
||
<Link
|
||
href="/learn/other"
|
||
className="mt-2 inline-block text-sm text-primary underline underline-offset-4"
|
||
>
|
||
切换到简体图文版 →
|
||
</Link>
|
||
</div>
|
||
<div className="overflow-x-auto rounded-lg border">
|
||
<table className="w-full text-sm">
|
||
<thead className="bg-muted/50">
|
||
<tr>
|
||
<th className="px-4 py-2 text-left font-medium">序号</th>
|
||
<th className="px-4 py-2 text-left font-medium">卦名</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
{guaMarks.map((mark) => (
|
||
<tr key={mark} className="border-t">
|
||
<td className="px-4 py-2 font-mono text-muted-foreground">
|
||
{guaNumFromMark(mark)}
|
||
</td>
|
||
<td className="px-4 py-2">
|
||
<Link
|
||
href={`/learn/${guaNumFromMark(mark)}`}
|
||
className="text-primary underline-offset-4 hover:underline"
|
||
>
|
||
{getGuaName(mark)}
|
||
</Link>
|
||
</td>
|
||
</tr>
|
||
))}
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</PageShell>
|
||
);
|
||
}
|