mirror of
https://github.com/hanzoai/shadcn.git
synced 2026-10-30 18:22:59 +00:00
zeekay
2560695a39
- Add /themes page with ThemeCustomizer and CardsDemo - Copy cards components from shadcn (14 card demos) - Update theme-customizer.tsx with latest version from shadcn - Fix all registry imports from new-york-v4 to new-york - Enables full theme customization UI with color pickers and copy/paste
64 lines
2.4 KiB
TypeScript
64 lines
2.4 KiB
TypeScript
import { CardsActivityGoal } from "@/components/cards/activity-goal"
|
|
import { CardsCalendar } from "@/components/cards/calendar"
|
|
import { CardsChat } from "@/components/cards/chat"
|
|
import { CardsCookieSettings } from "@/components/cards/cookie-settings"
|
|
import { CardsCreateAccount } from "@/components/cards/create-account"
|
|
import { CardsExerciseMinutes } from "@/components/cards/exercise-minutes"
|
|
import { CardsForms } from "@/components/cards/forms"
|
|
import { CardsPayments } from "@/components/cards/payments"
|
|
import { CardsReportIssue } from "@/components/cards/report-issue"
|
|
import { CardsShare } from "@/components/cards/share"
|
|
import { CardsStats } from "@/components/cards/stats"
|
|
import { CardsTeamMembers } from "@/components/cards/team-members"
|
|
|
|
export function CardsDemo() {
|
|
return (
|
|
<div className="md:grids-col-2 grid **:data-[slot=card]:shadow-none md:gap-4 lg:grid-cols-10 xl:grid-cols-11">
|
|
<div className="grid gap-4 lg:col-span-4 xl:col-span-6">
|
|
<CardsStats />
|
|
<div className="grid gap-1 sm:grid-cols-[auto_1fr] md:hidden">
|
|
<CardsCalendar />
|
|
<div className="pt-3 sm:pt-0 sm:pl-2 xl:pl-4">
|
|
<CardsActivityGoal />
|
|
</div>
|
|
<div className="pt-3 sm:col-span-2 xl:pt-4">
|
|
<CardsExerciseMinutes />
|
|
</div>
|
|
</div>
|
|
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-1 xl:grid-cols-2">
|
|
<div className="flex flex-col gap-4">
|
|
<CardsForms />
|
|
<CardsTeamMembers />
|
|
<CardsCookieSettings />
|
|
</div>
|
|
<div className="flex flex-col gap-4">
|
|
<CardsCreateAccount />
|
|
<CardsChat />
|
|
<div className="hidden xl:block">
|
|
<CardsReportIssue />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="flex flex-col gap-4 lg:col-span-6 xl:col-span-5">
|
|
<div className="hidden gap-1 sm:grid-cols-[auto_1fr] md:grid">
|
|
<CardsCalendar />
|
|
<div className="pt-3 sm:pt-0 sm:pl-2 xl:pl-3">
|
|
<CardsActivityGoal />
|
|
</div>
|
|
<div className="pt-3 sm:col-span-2 xl:pt-3">
|
|
<CardsExerciseMinutes />
|
|
</div>
|
|
</div>
|
|
<div className="hidden md:block">
|
|
<CardsPayments />
|
|
</div>
|
|
<CardsShare />
|
|
<div className="xl:hidden">
|
|
<CardsReportIssue />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|