mirror of
https://github.com/hanzoai/calendar.git
synced 2026-10-30 14:46:43 +00:00
zeekay
b95e61fc6e
@hanzo/font 1.9.1 exports Zen. The name table, zen.css and every stylesheet call the family Zen, so ZenSans named a family that does not exist; twenty files imported it and would not resolve against the version they depend on. The SDK examples bound it to `inter` and `poppins` — index.tsx held two names for one Zen — so a customer copying them read the sans as Inter. The atoms theme set --font-sans from --font-inter, which nothing defines, while --font-zen-sans is the property the package publishes.
48 lines
1.5 KiB
TypeScript
48 lines
1.5 KiB
TypeScript
import { Zen } from "@hanzo/font";
|
|
import { _generateMetadataForStaticPage } from "app/_utils";
|
|
import type { Metadata } from "next";
|
|
import localFont from "next/font/local";
|
|
|
|
import { IconSprites } from "@calcom/ui/components/icon";
|
|
import type { IconName } from "@calcom/ui/components/icon";
|
|
|
|
import { lucideIconList } from "../../../../packages/ui/components/icon/icon-list.mjs";
|
|
import { IconGrid } from "./IconGrid";
|
|
|
|
export const dynamic = "force-static";
|
|
|
|
export async function generateMetadata(): Promise<Metadata> {
|
|
return await _generateMetadataForStaticPage("Icons Showcase", "", undefined, undefined, "/icons");
|
|
}
|
|
|
|
const sansFont = Zen;
|
|
const calFont = localFont({
|
|
src: "../../fonts/Zen-SemiBold.woff2",
|
|
variable: "--font-cal",
|
|
preload: true,
|
|
display: "swap",
|
|
weight: "600",
|
|
});
|
|
|
|
export default function IconsPage() {
|
|
const icons = Array.from(lucideIconList).sort() as IconName[];
|
|
|
|
return (
|
|
<div className={`${sansFont.variable} ${calFont.variable}`}>
|
|
<div className="bg-subtle flex h-screen">
|
|
<IconSprites />
|
|
<div className="bg-default m-auto min-w-full rounded-md p-10 text-right ltr:text-left">
|
|
<h1 className="text-emphasis font-cal text-2xl font-medium">Icons Showcase</h1>
|
|
<IconGrid title="Regular Icons" icons={icons} />
|
|
<IconGrid
|
|
title="Filled Icons"
|
|
icons={icons}
|
|
rootClassName="bg-inverted text-inverted"
|
|
iconClassName="fill-blue-500"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|