Initialized repository for chat Decolonize time website
Co-authored-by: Jeff Emmett <46964190+Jeff-Emmett@users.noreply.github.com>
|
|
@ -0,0 +1,30 @@
|
|||
# Decolonize time website
|
||||
|
||||
*Automatically synced with your [v0.app](https://v0.app) deployments*
|
||||
|
||||
[](https://vercel.com/jeff-emmetts-projects/v0-decolonize-time-website)
|
||||
[](https://v0.app/chat/qm0z8NH71WW)
|
||||
|
||||
## Overview
|
||||
|
||||
This repository will stay in sync with your deployed chats on [v0.app](https://v0.app).
|
||||
Any changes you make to your deployed app will be automatically pushed to this repository from [v0.app](https://v0.app).
|
||||
|
||||
## Deployment
|
||||
|
||||
Your project is live at:
|
||||
|
||||
**[https://vercel.com/jeff-emmetts-projects/v0-decolonize-time-website](https://vercel.com/jeff-emmetts-projects/v0-decolonize-time-website)**
|
||||
|
||||
## Build your app
|
||||
|
||||
Continue building your app on:
|
||||
|
||||
**[https://v0.app/chat/qm0z8NH71WW](https://v0.app/chat/qm0z8NH71WW)**
|
||||
|
||||
## How It Works
|
||||
|
||||
1. Create and modify your project using [v0.app](https://v0.app)
|
||||
2. Deploy your chats from the v0 interface
|
||||
3. Changes are automatically pushed to this repository
|
||||
4. Vercel deploys the latest version from this repository
|
||||
|
|
@ -0,0 +1,173 @@
|
|||
@import "tailwindcss";
|
||||
@import "tw-animate-css";
|
||||
|
||||
@custom-variant dark (&:is(.dark *));
|
||||
|
||||
:root {
|
||||
/* Earthy warm cream background */
|
||||
--background: oklch(0.95 0.02 70);
|
||||
--foreground: oklch(0.25 0.03 60);
|
||||
|
||||
/* Card colors - slightly lighter cream */
|
||||
--card: oklch(0.98 0.015 70);
|
||||
--card-foreground: oklch(0.25 0.03 60);
|
||||
|
||||
/* Popover */
|
||||
--popover: oklch(0.98 0.015 70);
|
||||
--popover-foreground: oklch(0.25 0.03 60);
|
||||
|
||||
/* Deep forest green as primary */
|
||||
--primary: oklch(0.35 0.08 155);
|
||||
--primary-foreground: oklch(0.98 0.015 70);
|
||||
|
||||
/* Soft sage secondary */
|
||||
--secondary: oklch(0.75 0.05 130);
|
||||
--secondary-foreground: oklch(0.25 0.03 60);
|
||||
|
||||
/* Muted earth tones */
|
||||
--muted: oklch(0.88 0.02 70);
|
||||
--muted-foreground: oklch(0.5 0.02 60);
|
||||
|
||||
/* Warm terracotta accent */
|
||||
--accent: oklch(0.65 0.15 35);
|
||||
--accent-foreground: oklch(0.98 0.015 70);
|
||||
|
||||
--destructive: oklch(0.55 0.2 25);
|
||||
--destructive-foreground: oklch(0.98 0.015 70);
|
||||
|
||||
--border: oklch(0.85 0.02 70);
|
||||
--input: oklch(0.85 0.02 70);
|
||||
--ring: oklch(0.35 0.08 155);
|
||||
|
||||
/* Chart colors - earthy palette */
|
||||
--chart-1: oklch(0.5 0.12 155);
|
||||
--chart-2: oklch(0.65 0.15 35);
|
||||
--chart-3: oklch(0.6 0.1 120);
|
||||
--chart-4: oklch(0.55 0.12 80);
|
||||
--chart-5: oklch(0.45 0.1 180);
|
||||
|
||||
--radius: 0.5rem;
|
||||
|
||||
/* Sidebar */
|
||||
--sidebar: oklch(0.98 0.015 70);
|
||||
--sidebar-foreground: oklch(0.25 0.03 60);
|
||||
--sidebar-primary: oklch(0.35 0.08 155);
|
||||
--sidebar-primary-foreground: oklch(0.98 0.015 70);
|
||||
--sidebar-accent: oklch(0.88 0.02 70);
|
||||
--sidebar-accent-foreground: oklch(0.25 0.03 60);
|
||||
--sidebar-border: oklch(0.85 0.02 70);
|
||||
--sidebar-ring: oklch(0.35 0.08 155);
|
||||
}
|
||||
|
||||
.dark {
|
||||
/* Deep night background */
|
||||
--background: oklch(0.18 0.02 240);
|
||||
--foreground: oklch(0.95 0.015 70);
|
||||
|
||||
--card: oklch(0.22 0.02 240);
|
||||
--card-foreground: oklch(0.95 0.015 70);
|
||||
|
||||
--popover: oklch(0.22 0.02 240);
|
||||
--popover-foreground: oklch(0.95 0.015 70);
|
||||
|
||||
/* Lighter forest green for dark mode */
|
||||
--primary: oklch(0.6 0.12 155);
|
||||
--primary-foreground: oklch(0.18 0.02 240);
|
||||
|
||||
--secondary: oklch(0.35 0.04 155);
|
||||
--secondary-foreground: oklch(0.95 0.015 70);
|
||||
|
||||
--muted: oklch(0.28 0.02 240);
|
||||
--muted-foreground: oklch(0.65 0.02 70);
|
||||
|
||||
/* Warm glow accent */
|
||||
--accent: oklch(0.7 0.15 45);
|
||||
--accent-foreground: oklch(0.18 0.02 240);
|
||||
|
||||
--destructive: oklch(0.6 0.22 25);
|
||||
--destructive-foreground: oklch(0.95 0.015 70);
|
||||
|
||||
--border: oklch(0.32 0.02 240);
|
||||
--input: oklch(0.32 0.02 240);
|
||||
--ring: oklch(0.6 0.12 155);
|
||||
|
||||
/* Chart colors - dark mode */
|
||||
--chart-1: oklch(0.6 0.15 155);
|
||||
--chart-2: oklch(0.7 0.18 40);
|
||||
--chart-3: oklch(0.65 0.12 130);
|
||||
--chart-4: oklch(0.62 0.14 90);
|
||||
--chart-5: oklch(0.55 0.12 190);
|
||||
|
||||
/* Sidebar dark */
|
||||
--sidebar: oklch(0.22 0.02 240);
|
||||
--sidebar-foreground: oklch(0.95 0.015 70);
|
||||
--sidebar-primary: oklch(0.6 0.12 155);
|
||||
--sidebar-primary-foreground: oklch(0.18 0.02 240);
|
||||
--sidebar-accent: oklch(0.28 0.02 240);
|
||||
--sidebar-accent-foreground: oklch(0.95 0.015 70);
|
||||
--sidebar-border: oklch(0.32 0.02 240);
|
||||
--sidebar-ring: oklch(0.6 0.12 155);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--font-sans: "Geist", "Geist Fallback";
|
||||
--font-serif: "Crimson Text", serif;
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
}
|
||||
|
||||
@layer base {
|
||||
* {
|
||||
@apply border-border outline-ring/50;
|
||||
}
|
||||
body {
|
||||
@apply bg-background text-foreground;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
@apply text-balance;
|
||||
}
|
||||
|
||||
p {
|
||||
@apply text-pretty;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,52 @@
|
|||
import type React from "react"
|
||||
import type { Metadata } from "next"
|
||||
import { Geist, Crimson_Text } from "next/font/google"
|
||||
import { Analytics } from "@vercel/analytics/next"
|
||||
import "./globals.css"
|
||||
|
||||
const geist = Geist({ subsets: ["latin"] })
|
||||
const crimsonText = Crimson_Text({
|
||||
weight: ["400", "600", "700"],
|
||||
subsets: ["latin"],
|
||||
variable: "--font-serif",
|
||||
})
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Decolonize Time - Reclaiming Natural Rhythms",
|
||||
description:
|
||||
"Explore the system construct of time and reconnect with natural, lunar, and seasonal rhythms beyond the imposed 12-60 frequency.",
|
||||
keywords: "lunar calendar, 13 moons, indigenous time, Kairos, Chronos, natural time, decolonize, fractal time",
|
||||
generator: "v0.app",
|
||||
icons: {
|
||||
icon: [
|
||||
{
|
||||
url: "/icon-light-32x32.png",
|
||||
media: "(prefers-color-scheme: light)",
|
||||
},
|
||||
{
|
||||
url: "/icon-dark-32x32.png",
|
||||
media: "(prefers-color-scheme: dark)",
|
||||
},
|
||||
{
|
||||
url: "/icon.svg",
|
||||
type: "image/svg+xml",
|
||||
},
|
||||
],
|
||||
apple: "/apple-icon.png",
|
||||
},
|
||||
}
|
||||
|
||||
export default function RootLayout({
|
||||
children,
|
||||
}: Readonly<{
|
||||
children: React.ReactNode
|
||||
}>) {
|
||||
return (
|
||||
<html lang="en">
|
||||
<body className={`${geist.className} ${crimsonText.variable} font-sans antialiased`}>
|
||||
{children}
|
||||
<Analytics />
|
||||
</body>
|
||||
</html>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
import { Hero } from "@/components/hero"
|
||||
import { Navigation } from "@/components/navigation"
|
||||
import { TimeSystemsSection } from "@/components/time-systems-section"
|
||||
import { KairosChronosSection } from "@/components/kairos-chronos-section"
|
||||
import { IndigenousWisdomSection } from "@/components/indigenous-wisdom-section"
|
||||
import { CalendarTranslator } from "@/components/calendar-translator"
|
||||
import { AlternativeTimekeeping } from "@/components/alternative-timekeeping"
|
||||
import { Footer } from "@/components/footer"
|
||||
|
||||
export default function Page() {
|
||||
return (
|
||||
<main className="min-h-screen">
|
||||
<Navigation />
|
||||
<Hero />
|
||||
<TimeSystemsSection />
|
||||
<KairosChronosSection />
|
||||
<IndigenousWisdomSection />
|
||||
<CalendarTranslator />
|
||||
<AlternativeTimekeeping />
|
||||
<Footer />
|
||||
</main>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema.json",
|
||||
"style": "new-york",
|
||||
"rsc": true,
|
||||
"tsx": true,
|
||||
"tailwind": {
|
||||
"config": "",
|
||||
"css": "app/globals.css",
|
||||
"baseColor": "neutral",
|
||||
"cssVariables": true,
|
||||
"prefix": ""
|
||||
},
|
||||
"aliases": {
|
||||
"components": "@/components",
|
||||
"utils": "@/lib/utils",
|
||||
"ui": "@/components/ui",
|
||||
"lib": "@/lib",
|
||||
"hooks": "@/hooks"
|
||||
},
|
||||
"iconLibrary": "lucide"
|
||||
}
|
||||
|
|
@ -0,0 +1,116 @@
|
|||
import { Card } from "@/components/ui/card"
|
||||
import { Sunrise, Wind, Leaf, Waves } from "lucide-react"
|
||||
|
||||
export function AlternativeTimekeeping() {
|
||||
const methods = [
|
||||
{
|
||||
icon: Sunrise,
|
||||
title: "Solar Rhythms",
|
||||
description:
|
||||
"Wake with sunrise, rest with sunset. Align your circadian rhythm with the natural light-dark cycle.",
|
||||
practices: [
|
||||
"Morning sun exposure within 30 minutes of waking",
|
||||
"Outdoor time during solar noon",
|
||||
"Reduce artificial light after sunset",
|
||||
"Honor solstices and equinoxes",
|
||||
],
|
||||
},
|
||||
{
|
||||
icon: Wind,
|
||||
title: "Seasonal Living",
|
||||
description: "Tune into the four seasons and their unique energies for work, rest, growth, and reflection.",
|
||||
practices: [
|
||||
"Spring: Plant seeds, start projects, expand",
|
||||
"Summer: Full expression, activity, growth",
|
||||
"Autumn: Harvest results, prepare, consolidate",
|
||||
"Winter: Rest, dream, restore, plan",
|
||||
],
|
||||
},
|
||||
{
|
||||
icon: Leaf,
|
||||
title: "Moon Phases",
|
||||
description: "Follow the lunar cycle for planting, creating, releasing, and restoring.",
|
||||
practices: [
|
||||
"New Moon: Set intentions, begin new projects",
|
||||
"Waxing Moon: Build, grow, take action",
|
||||
"Full Moon: Culmination, celebration, illuminate",
|
||||
"Waning Moon: Release, rest, reflect",
|
||||
],
|
||||
},
|
||||
{
|
||||
icon: Waves,
|
||||
title: "Body Wisdom",
|
||||
description: "Listen to your body's natural rhythms for hunger, energy, and rest instead of external schedules.",
|
||||
practices: [
|
||||
"Eat when truly hungry, not by clock",
|
||||
"Rest when tired, move when energized",
|
||||
"Honor menstrual cycles (if applicable)",
|
||||
"Track personal energy patterns",
|
||||
],
|
||||
},
|
||||
]
|
||||
|
||||
return (
|
||||
<section id="alternatives" className="py-20 lg:py-32">
|
||||
<div className="container px-4 lg:px-8">
|
||||
<div className="max-w-3xl mx-auto text-center mb-16">
|
||||
<h2 className="font-serif text-4xl lg:text-5xl font-bold mb-6 text-foreground">
|
||||
Natural Time-Keeping Methods
|
||||
</h2>
|
||||
<p className="text-lg text-muted-foreground leading-relaxed">
|
||||
Practical ways to align your body and mind with the flow of work in line with natural rhythms.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="grid lg:grid-cols-2 gap-8 max-w-6xl mx-auto mb-16">
|
||||
{methods.map((method, index) => {
|
||||
const Icon = method.icon
|
||||
return (
|
||||
<Card key={index} className="p-8">
|
||||
<div className="flex items-start gap-4 mb-6">
|
||||
<div className="p-3 rounded-lg bg-primary/10 shrink-0">
|
||||
<Icon className="h-7 w-7 text-primary" />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="font-serif text-2xl font-bold mb-2 text-foreground">{method.title}</h3>
|
||||
<p className="text-foreground/70 leading-relaxed">{method.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="space-y-2 pl-3">
|
||||
{method.practices.map((practice, i) => (
|
||||
<div key={i} className="flex items-start gap-3">
|
||||
<span className="text-primary mt-1 text-sm">→</span>
|
||||
<span className="text-sm text-foreground/80">{practice}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</Card>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
|
||||
<Card className="p-8 lg:p-12 bg-gradient-to-br from-primary/10 to-accent/10 max-w-4xl mx-auto">
|
||||
<h3 className="font-serif text-3xl font-bold mb-6 text-center text-foreground">
|
||||
The Future: Less Clock, More Life
|
||||
</h3>
|
||||
<div className="space-y-4 text-foreground/80 leading-relaxed">
|
||||
<p>
|
||||
Imagine a world where we measure time not by the minute, but by the season. Where we work when inspired,
|
||||
rest when weary, and celebrate when the moment is ripe. Where children learn by following their curiosity
|
||||
rather than bells, and communities gather by the moon rather than the calendar.
|
||||
</p>
|
||||
<p>
|
||||
This isn't regression—it's remembering. Indigenous cultures have lived this way sustainably for thousands
|
||||
of years. Modern neuroscience confirms what they always knew: our bodies thrive on natural rhythms, not
|
||||
rigid schedules.
|
||||
</p>
|
||||
<p className="text-lg font-semibold text-primary">
|
||||
The path forward isn't to reject all structure, but to choose structure that serves life rather than
|
||||
productivity. To use less Chronos and more Kairos. To decolonize time itself.
|
||||
</p>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,179 @@
|
|||
"use client"
|
||||
|
||||
import { useState } from "react"
|
||||
import { Card } from "@/components/ui/card"
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { Input } from "@/components/ui/input"
|
||||
import { Label } from "@/components/ui/label"
|
||||
import { Moon } from "lucide-react"
|
||||
|
||||
export function CalendarTranslator() {
|
||||
const [gregorianDate, setGregorianDate] = useState("")
|
||||
const [lunarDate, setLunarDate] = useState<{
|
||||
moon: number
|
||||
day: number
|
||||
moonName: string
|
||||
dayOfWeek: string
|
||||
} | null>(null)
|
||||
|
||||
const moonNames = [
|
||||
"Magnetic Moon",
|
||||
"Lunar Moon",
|
||||
"Electric Moon",
|
||||
"Self-Existing Moon",
|
||||
"Overtone Moon",
|
||||
"Rhythmic Moon",
|
||||
"Resonant Moon",
|
||||
"Galactic Moon",
|
||||
"Solar Moon",
|
||||
"Planetary Moon",
|
||||
"Spectral Moon",
|
||||
"Crystal Moon",
|
||||
"Cosmic Moon",
|
||||
]
|
||||
|
||||
const dayNames = ["Dali", "Seli", "Gamma", "Kali", "Alpha", "Limi", "Silio"]
|
||||
|
||||
const convertToLunar = (dateString: string) => {
|
||||
const date = new Date(dateString)
|
||||
const year = date.getFullYear()
|
||||
|
||||
// July 26 is day 1 of the 13-moon calendar
|
||||
const startOfYear = new Date(year, 6, 26) // July 26
|
||||
|
||||
let dayOfYear = Math.floor((date.getTime() - startOfYear.getTime()) / (1000 * 60 * 60 * 24)) + 1
|
||||
|
||||
// If date is before July 26, use previous calendar year
|
||||
if (dayOfYear < 1) {
|
||||
const prevStartOfYear = new Date(year - 1, 6, 26)
|
||||
dayOfYear = Math.floor((date.getTime() - prevStartOfYear.getTime()) / (1000 * 60 * 60 * 24)) + 1
|
||||
}
|
||||
|
||||
// Handle Day Out of Time (July 25)
|
||||
if (dayOfYear > 364) {
|
||||
setLunarDate({
|
||||
moon: 0,
|
||||
day: 0,
|
||||
moonName: "Day Out of Time",
|
||||
dayOfWeek: "Out of Time",
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
// Calculate moon and day
|
||||
const moon = Math.floor((dayOfYear - 1) / 28) + 1
|
||||
const day = ((dayOfYear - 1) % 28) + 1
|
||||
const dayOfWeek = dayNames[(day - 1) % 7]
|
||||
|
||||
setLunarDate({
|
||||
moon,
|
||||
day,
|
||||
moonName: moonNames[moon - 1],
|
||||
dayOfWeek,
|
||||
})
|
||||
}
|
||||
|
||||
const handleConvert = () => {
|
||||
if (gregorianDate) {
|
||||
convertToLunar(gregorianDate)
|
||||
}
|
||||
}
|
||||
|
||||
const handleTodayClick = () => {
|
||||
const today = new Date().toISOString().split("T")[0]
|
||||
setGregorianDate(today)
|
||||
convertToLunar(today)
|
||||
}
|
||||
|
||||
return (
|
||||
<section id="translator" className="py-20 lg:py-32 bg-muted/30">
|
||||
<div className="container px-4 lg:px-8">
|
||||
<div className="max-w-3xl mx-auto text-center mb-12">
|
||||
<h2 className="font-serif text-4xl lg:text-5xl font-bold mb-6 text-foreground">Calendar Translator</h2>
|
||||
<p className="text-lg text-muted-foreground leading-relaxed">
|
||||
Convert any Gregorian calendar date to the 13-moon lunar calendar.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<Card className="max-w-2xl mx-auto p-8 lg:p-12">
|
||||
<div className="space-y-6">
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="gregorian-date" className="text-base">
|
||||
Gregorian Date
|
||||
</Label>
|
||||
<div className="flex gap-3">
|
||||
<Input
|
||||
id="gregorian-date"
|
||||
type="date"
|
||||
value={gregorianDate}
|
||||
onChange={(e) => setGregorianDate(e.target.value)}
|
||||
className="flex-1"
|
||||
/>
|
||||
<Button onClick={handleTodayClick} variant="outline">
|
||||
Today
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Button
|
||||
onClick={handleConvert}
|
||||
className="w-full bg-primary text-primary-foreground hover:bg-primary/90"
|
||||
size="lg"
|
||||
disabled={!gregorianDate}
|
||||
>
|
||||
Convert to Lunar Calendar
|
||||
</Button>
|
||||
|
||||
{lunarDate && (
|
||||
<div className="pt-6 border-t border-border">
|
||||
<div className="flex items-center justify-center gap-3 mb-6">
|
||||
<Moon className="h-8 w-8 text-primary" />
|
||||
<h3 className="font-serif text-2xl font-bold text-foreground">13-Moon Date</h3>
|
||||
</div>
|
||||
|
||||
{lunarDate.moonName === "Day Out of Time" ? (
|
||||
<div className="text-center space-y-4 p-8 bg-accent/10 rounded-lg">
|
||||
<p className="text-3xl font-bold text-accent">Day Out of Time</p>
|
||||
<p className="text-foreground/80">
|
||||
A day for forgiveness, celebration, and preparation for the new year. This day (July 25) exists
|
||||
outside the normal calendar cycle.
|
||||
</p>
|
||||
</div>
|
||||
) : (
|
||||
<div className="grid sm:grid-cols-2 gap-6">
|
||||
<div className="space-y-2 p-6 bg-primary/5 rounded-lg">
|
||||
<p className="text-sm text-muted-foreground uppercase tracking-wide">Moon</p>
|
||||
<p className="text-3xl font-bold text-primary">{lunarDate.moon}</p>
|
||||
<p className="text-lg text-foreground font-serif">{lunarDate.moonName}</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-2 p-6 bg-secondary/20 rounded-lg">
|
||||
<p className="text-sm text-muted-foreground uppercase tracking-wide">Day</p>
|
||||
<p className="text-3xl font-bold text-primary">{lunarDate.day}</p>
|
||||
<p className="text-lg text-foreground font-serif">{lunarDate.dayOfWeek}</p>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="mt-6 p-4 bg-muted/50 rounded-lg">
|
||||
<p className="text-sm text-foreground/70 leading-relaxed">
|
||||
<strong>Note:</strong> The 13-moon calendar begins on July 26 (Gregorian) and consists of 13 perfect
|
||||
moons of 28 days each, plus one "Day Out of Time" on July 25.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
<div className="max-w-3xl mx-auto mt-12 text-center">
|
||||
<p className="text-sm text-muted-foreground leading-relaxed">
|
||||
The 13-moon calendar synchronizes with actual lunar cycles and creates a fractal, harmonic relationship with
|
||||
natural time. Each moon has 28 days (4 weeks of 7 days), mirroring the average menstrual cycle and the
|
||||
moon's orbit around Earth.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
import { Heart } from "lucide-react"
|
||||
|
||||
export function Footer() {
|
||||
return (
|
||||
<footer className="border-t border-border py-12 lg:py-16">
|
||||
<div className="container px-4 lg:px-8">
|
||||
<div className="max-w-4xl mx-auto text-center space-y-6">
|
||||
<h3 className="font-serif text-2xl font-bold text-foreground">decolonizeti.me</h3>
|
||||
<p className="text-muted-foreground leading-relaxed max-w-2xl mx-auto">
|
||||
This website honors the indigenous peoples worldwide who have maintained sacred relationships with time,
|
||||
land, and natural cycles through millennia of colonial oppression.
|
||||
</p>
|
||||
<div className="flex items-center justify-center gap-2 text-sm text-muted-foreground">
|
||||
<span>Made with</span>
|
||||
<Heart className="h-4 w-4 text-accent fill-accent" />
|
||||
<span>in harmony with the rhythms of the Earth</span>
|
||||
</div>
|
||||
<div className="pt-6 border-t border-border">
|
||||
<p className="text-xs text-muted-foreground">
|
||||
{new Date().getFullYear()} • Time is not linear, it is cyclical and sacred
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
import { ArrowDown } from "lucide-react"
|
||||
import { Button } from "@/components/ui/button"
|
||||
|
||||
export function Hero() {
|
||||
return (
|
||||
<section className="relative min-h-screen flex items-center justify-center overflow-hidden">
|
||||
{/* Background Image */}
|
||||
<div className="absolute inset-0 z-0">
|
||||
<img src="/moon-phases-over-natural-landscape-with-stars.jpg" alt="Moon phases" className="w-full h-full object-cover opacity-20" />
|
||||
<div className="absolute inset-0 bg-gradient-to-b from-background/50 via-background/80 to-background" />
|
||||
</div>
|
||||
|
||||
<div className="container relative z-10 px-4 lg:px-8 text-center">
|
||||
<div className="max-w-4xl mx-auto space-y-8">
|
||||
<h1 className="font-serif text-5xl md:text-6xl lg:text-7xl font-bold text-foreground leading-tight">
|
||||
Decolonize Time
|
||||
</h1>
|
||||
<p className="text-xl md:text-2xl text-muted-foreground max-w-2xl mx-auto leading-relaxed">
|
||||
Reclaiming natural rhythms beyond the imposed 12-60 frequency. Reconnect with the 13-20 lunar cycles that
|
||||
align body and mind with Earth's flow.
|
||||
</p>
|
||||
<div className="flex flex-col sm:flex-row items-center justify-center gap-4 pt-4">
|
||||
<Button asChild size="lg" className="bg-primary text-primary-foreground hover:bg-primary/90">
|
||||
<a href="#systems">Explore Time Systems</a>
|
||||
</Button>
|
||||
<Button asChild variant="outline" size="lg">
|
||||
<a href="#translator">Try Calendar Translator</a>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="absolute bottom-8 left-1/2 -translate-x-1/2 animate-bounce">
|
||||
<ArrowDown className="h-6 w-6 text-muted-foreground" />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,77 @@
|
|||
import { Card } from "@/components/ui/card"
|
||||
|
||||
export function IndigenousWisdomSection() {
|
||||
return (
|
||||
<section id="indigenous" className="py-20 lg:py-32">
|
||||
<div className="container px-4 lg:px-8">
|
||||
<div className="max-w-3xl mx-auto text-center mb-16">
|
||||
<h2 className="font-serif text-4xl lg:text-5xl font-bold mb-6 text-foreground">Indigenous Time Wisdom</h2>
|
||||
<p className="text-lg text-muted-foreground leading-relaxed">
|
||||
Ancient cultures across the globe developed sophisticated time-keeping systems aligned with natural cycles.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Turtle Shell */}
|
||||
<div className="max-w-5xl mx-auto mb-16">
|
||||
<Card className="p-8 lg:p-12 bg-gradient-to-br from-primary/5 to-accent/5">
|
||||
<div className="grid lg:grid-cols-2 gap-8 items-center">
|
||||
<div>
|
||||
<img
|
||||
src="/turtle-shell-pattern-showing-13-segments.jpg"
|
||||
alt="Turtle shell with 13 segments"
|
||||
className="w-full h-auto rounded-lg"
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-4">
|
||||
<h3 className="font-serif text-3xl font-bold text-foreground">The Turtle's Teaching</h3>
|
||||
<p className="text-foreground/80 leading-relaxed">
|
||||
Many Indigenous North American nations recognize the turtle as a timekeeper. The turtle's back has 13
|
||||
large segments, representing the 13 moons of the year. The 28 smaller scales around the edge represent
|
||||
the 28 days in each lunar month.
|
||||
</p>
|
||||
<p className="text-foreground/80 leading-relaxed">
|
||||
This isn't coincidence—it's nature's calendar, carried on the back of one of Earth's oldest creatures.
|
||||
The turtle reminds us that we are part of natural time, not separate from it.
|
||||
</p>
|
||||
<p className="text-accent font-semibold">
|
||||
"Turtle Island" (North America) itself is named for this sacred relationship between land, time, and
|
||||
life.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
{/* Indigenous Calendars */}
|
||||
<div className="grid md:grid-cols-3 gap-6 max-w-6xl mx-auto">
|
||||
<Card className="p-6">
|
||||
<h4 className="font-serif text-xl font-bold mb-3 text-foreground">Maya Tzolk'in</h4>
|
||||
<p className="text-sm text-muted-foreground mb-3">Sacred 260-day Calendar</p>
|
||||
<p className="text-foreground/80 text-sm leading-relaxed">
|
||||
The Maya Tzolk'in combines 13 numbers with 20 day signs, creating a 260-day sacred cycle that aligns with
|
||||
human gestation and agricultural rhythms.
|
||||
</p>
|
||||
</Card>
|
||||
|
||||
<Card className="p-6">
|
||||
<h4 className="font-serif text-xl font-bold mb-3 text-foreground">Māori Maramataka</h4>
|
||||
<p className="text-sm text-muted-foreground mb-3">Lunar Planting Calendar</p>
|
||||
<p className="text-foreground/80 text-sm leading-relaxed">
|
||||
Māori people of New Zealand follow the moon phases for planting, fishing, and harvesting, with each lunar
|
||||
night having specific energies and activities.
|
||||
</p>
|
||||
</Card>
|
||||
|
||||
<Card className="p-6">
|
||||
<h4 className="font-serif text-xl font-bold mb-3 text-foreground">Lakota Winter Count</h4>
|
||||
<p className="text-sm text-muted-foreground mb-3">Pictorial Year Tracking</p>
|
||||
<p className="text-foreground/80 text-sm leading-relaxed">
|
||||
Lakota nations recorded history through winter counts, with each year marked by a significant event rather
|
||||
than an arbitrary number, honoring cyclical time.
|
||||
</p>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,107 @@
|
|||
import { Card } from "@/components/ui/card"
|
||||
import { Timer, Heart } from "lucide-react"
|
||||
|
||||
export function KairosChronosSection() {
|
||||
return (
|
||||
<section id="kairos" className="py-20 lg:py-32 bg-muted/30">
|
||||
<div className="container px-4 lg:px-8">
|
||||
<div className="max-w-3xl mx-auto text-center mb-16">
|
||||
<h2 className="font-serif text-4xl lg:text-5xl font-bold mb-6 text-foreground">Kairos vs Chronos</h2>
|
||||
<p className="text-lg text-muted-foreground leading-relaxed">
|
||||
Ancient Greeks understood two fundamentally different types of time. Modern society has forgotten one of
|
||||
them.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="grid lg:grid-cols-2 gap-8 max-w-6xl mx-auto mb-16">
|
||||
{/* Chronos */}
|
||||
<Card className="p-8 lg:p-10">
|
||||
<div className="flex items-center gap-4 mb-6">
|
||||
<div className="p-3 rounded-full bg-muted">
|
||||
<Timer className="h-8 w-8 text-muted-foreground" />
|
||||
</div>
|
||||
<h3 className="font-serif text-3xl font-bold text-foreground">Chronos</h3>
|
||||
</div>
|
||||
<p className="text-sm uppercase tracking-wide text-muted-foreground mb-4">Quantitative Time</p>
|
||||
<p className="text-foreground/80 leading-relaxed mb-6">
|
||||
Sequential, measurable, clock time. The time of schedules, deadlines, and productivity. Chronos marches
|
||||
forward in a straight line, dividing life into units to be managed and optimized.
|
||||
</p>
|
||||
<div className="space-y-3">
|
||||
<div className="flex items-start gap-3">
|
||||
<span className="text-muted-foreground">→</span>
|
||||
<span className="text-sm text-foreground/70">Linear and mechanical</span>
|
||||
</div>
|
||||
<div className="flex items-start gap-3">
|
||||
<span className="text-muted-foreground">→</span>
|
||||
<span className="text-sm text-foreground/70">External and imposed</span>
|
||||
</div>
|
||||
<div className="flex items-start gap-3">
|
||||
<span className="text-muted-foreground">→</span>
|
||||
<span className="text-sm text-foreground/70">Creates stress and urgency</span>
|
||||
</div>
|
||||
<div className="flex items-start gap-3">
|
||||
<span className="text-muted-foreground">→</span>
|
||||
<span className="text-sm text-foreground/70">The time of capitalism</span>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
{/* Kairos */}
|
||||
<Card className="p-8 lg:p-10 bg-primary/5 border-primary/20">
|
||||
<div className="flex items-center gap-4 mb-6">
|
||||
<div className="p-3 rounded-full bg-primary/10">
|
||||
<Heart className="h-8 w-8 text-primary" />
|
||||
</div>
|
||||
<h3 className="font-serif text-3xl font-bold text-foreground">Kairos</h3>
|
||||
</div>
|
||||
<p className="text-sm uppercase tracking-wide text-primary mb-4">Qualitative Time</p>
|
||||
<p className="text-foreground/80 leading-relaxed mb-6">
|
||||
The right moment, opportune time. The time of seasons, ripeness, and synchronicity. Kairos is felt rather
|
||||
than measured—it's the perfect moment to act, create, or rest.
|
||||
</p>
|
||||
<div className="space-y-3">
|
||||
<div className="flex items-start gap-3">
|
||||
<span className="text-primary">→</span>
|
||||
<span className="text-sm text-foreground/70">Cyclical and organic</span>
|
||||
</div>
|
||||
<div className="flex items-start gap-3">
|
||||
<span className="text-primary">→</span>
|
||||
<span className="text-sm text-foreground/70">Internal and intuitive</span>
|
||||
</div>
|
||||
<div className="flex items-start gap-3">
|
||||
<span className="text-primary">→</span>
|
||||
<span className="text-sm text-foreground/70">Creates flow and presence</span>
|
||||
</div>
|
||||
<div className="flex items-start gap-3">
|
||||
<span className="text-primary">→</span>
|
||||
<span className="text-sm text-foreground/70">The time of nature</span>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
<Card className="p-8 lg:p-12 bg-card max-w-4xl mx-auto">
|
||||
<h3 className="font-serif text-2xl font-bold mb-6 text-foreground">Moving Toward Kairos</h3>
|
||||
<div className="space-y-4 text-foreground/80 leading-relaxed">
|
||||
<p>
|
||||
Our obsession with Chronos time—scheduling every minute, optimizing productivity, racing against
|
||||
deadlines—has created an epidemic of burnout and disconnection. We've lost touch with the natural rhythms
|
||||
that governed human life for millennia.
|
||||
</p>
|
||||
<p>
|
||||
Indigenous cultures worldwide have always lived in Kairos time, following the seasons, the moon, and the
|
||||
natural cycles of the land. They plant when the earth is ready, harvest when the crops are ripe, and rest
|
||||
when darkness falls.
|
||||
</p>
|
||||
<p className="font-semibold text-primary">
|
||||
The future isn't about abandoning time entirely—it's about using less Chronos and more Kairos. It's about
|
||||
remembering that not everything that matters can be measured, and that the most important moments in life
|
||||
happen in their own time.
|
||||
</p>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,83 @@
|
|||
"use client"
|
||||
|
||||
import { useState, useEffect } from "react"
|
||||
import { Menu, X } from "lucide-react"
|
||||
import { Button } from "@/components/ui/button"
|
||||
|
||||
export function Navigation() {
|
||||
const [isScrolled, setIsScrolled] = useState(false)
|
||||
const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false)
|
||||
|
||||
useEffect(() => {
|
||||
const handleScroll = () => {
|
||||
setIsScrolled(window.scrollY > 20)
|
||||
}
|
||||
window.addEventListener("scroll", handleScroll)
|
||||
return () => window.removeEventListener("scroll", handleScroll)
|
||||
}, [])
|
||||
|
||||
const navLinks = [
|
||||
{ href: "#systems", label: "Time Systems" },
|
||||
{ href: "#kairos", label: "Kairos vs Chronos" },
|
||||
{ href: "#indigenous", label: "Indigenous Wisdom" },
|
||||
{ href: "#translator", label: "Calendar Translator" },
|
||||
{ href: "#alternatives", label: "Natural Rhythms" },
|
||||
]
|
||||
|
||||
return (
|
||||
<nav
|
||||
className={`fixed top-0 left-0 right-0 z-50 transition-all duration-300 ${
|
||||
isScrolled ? "bg-background/80 backdrop-blur-lg border-b border-border" : "bg-transparent"
|
||||
}`}
|
||||
>
|
||||
<div className="container mx-auto px-4 lg:px-8">
|
||||
<div className="flex items-center justify-between h-16 lg:h-20">
|
||||
<a href="#" className="font-serif text-xl lg:text-2xl font-bold text-primary">
|
||||
decolonizeti.me
|
||||
</a>
|
||||
|
||||
{/* Desktop Navigation */}
|
||||
<div className="hidden md:flex items-center gap-8">
|
||||
{navLinks.map((link) => (
|
||||
<a
|
||||
key={link.href}
|
||||
href={link.href}
|
||||
className="text-sm text-foreground/70 hover:text-foreground transition-colors"
|
||||
>
|
||||
{link.label}
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* Mobile Menu Button */}
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="md:hidden"
|
||||
onClick={() => setIsMobileMenuOpen(!isMobileMenuOpen)}
|
||||
>
|
||||
{isMobileMenuOpen ? <X className="h-5 w-5" /> : <Menu className="h-5 w-5" />}
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
{/* Mobile Menu */}
|
||||
{isMobileMenuOpen && (
|
||||
<div className="md:hidden py-4 border-t border-border">
|
||||
<div className="flex flex-col gap-4">
|
||||
{navLinks.map((link) => (
|
||||
<a
|
||||
key={link.href}
|
||||
href={link.href}
|
||||
className="text-sm text-foreground/70 hover:text-foreground transition-colors py-2"
|
||||
onClick={() => setIsMobileMenuOpen(false)}
|
||||
>
|
||||
{link.label}
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</nav>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
'use client'
|
||||
|
||||
import * as React from 'react'
|
||||
import {
|
||||
ThemeProvider as NextThemesProvider,
|
||||
type ThemeProviderProps,
|
||||
} from 'next-themes'
|
||||
|
||||
export function ThemeProvider({ children, ...props }: ThemeProviderProps) {
|
||||
return <NextThemesProvider {...props}>{children}</NextThemesProvider>
|
||||
}
|
||||
|
|
@ -0,0 +1,113 @@
|
|||
import { Card } from "@/components/ui/card"
|
||||
import { Clock, Moon, Calendar } from "lucide-react"
|
||||
|
||||
export function TimeSystemsSection() {
|
||||
return (
|
||||
<section id="systems" className="py-20 lg:py-32">
|
||||
<div className="container px-4 lg:px-8">
|
||||
<div className="max-w-3xl mx-auto text-center mb-16">
|
||||
<h2 className="font-serif text-4xl lg:text-5xl font-bold mb-6 text-foreground">
|
||||
The System Construct of Time
|
||||
</h2>
|
||||
<p className="text-lg text-muted-foreground leading-relaxed">
|
||||
Our modern calendar is not natural law—it's a colonial construct designed to disconnect us from Earth's
|
||||
rhythms.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-8 max-w-5xl mx-auto mb-16">
|
||||
{/* 12-60 System */}
|
||||
<Card className="p-8 bg-card border-2 border-destructive/20">
|
||||
<div className="flex items-start gap-4 mb-6">
|
||||
<div className="p-3 rounded-lg bg-destructive/10">
|
||||
<Clock className="h-8 w-8 text-destructive" />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="font-serif text-2xl font-bold mb-2 text-foreground">12-60 Frequency</h3>
|
||||
<p className="text-sm text-muted-foreground">The Imposed System</p>
|
||||
</div>
|
||||
</div>
|
||||
<ul className="space-y-3 text-foreground/80">
|
||||
<li className="flex items-start gap-2">
|
||||
<span className="text-destructive mt-1">•</span>
|
||||
<span>12 irregular months (28-31 days)</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-2">
|
||||
<span className="text-destructive mt-1">•</span>
|
||||
<span>60-second minutes, 60-minute hours</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-2">
|
||||
<span className="text-destructive mt-1">•</span>
|
||||
<span>Disconnected from lunar cycles</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-2">
|
||||
<span className="text-destructive mt-1">•</span>
|
||||
<span>Created for taxation & control</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-2">
|
||||
<span className="text-destructive mt-1">•</span>
|
||||
<span>Promotes linear, mechanical thinking</span>
|
||||
</li>
|
||||
</ul>
|
||||
</Card>
|
||||
|
||||
{/* 13-20 System */}
|
||||
<Card className="p-8 bg-card border-2 border-primary/30">
|
||||
<div className="flex items-start gap-4 mb-6">
|
||||
<div className="p-3 rounded-lg bg-primary/10">
|
||||
<Moon className="h-8 w-8 text-primary" />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="font-serif text-2xl font-bold mb-2 text-foreground">13-20 Frequency</h3>
|
||||
<p className="text-sm text-muted-foreground">The Natural Rhythm</p>
|
||||
</div>
|
||||
</div>
|
||||
<ul className="space-y-3 text-foreground/80">
|
||||
<li className="flex items-start gap-2">
|
||||
<span className="text-primary mt-1">•</span>
|
||||
<span>13 perfect 28-day lunar months</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-2">
|
||||
<span className="text-primary mt-1">•</span>
|
||||
<span>20 solar seals (fingers + toes)</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-2">
|
||||
<span className="text-primary mt-1">•</span>
|
||||
<span>Aligned with moon phases & menstruation</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-2">
|
||||
<span className="text-primary mt-1">•</span>
|
||||
<span>Honors cyclical, fractal nature</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-2">
|
||||
<span className="text-primary mt-1">•</span>
|
||||
<span>365 days (13 × 28 + 1 day out of time)</span>
|
||||
</li>
|
||||
</ul>
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
<Card className="p-8 lg:p-12 bg-secondary/20 max-w-4xl mx-auto">
|
||||
<div className="flex items-start gap-6">
|
||||
<div className="p-4 rounded-lg bg-accent/20 shrink-0">
|
||||
<Calendar className="h-10 w-10 text-accent" />
|
||||
</div>
|
||||
<div className="space-y-4">
|
||||
<h3 className="font-serif text-2xl font-bold text-foreground">Why This Matters</h3>
|
||||
<p className="text-foreground/80 leading-relaxed">
|
||||
The Gregorian calendar was imposed globally through colonization, severing indigenous peoples from their
|
||||
ancestral time-keeping systems. By adopting the 12-60 frequency, we've internalized a mechanical,
|
||||
productivity-focused relationship with time that disconnects us from natural cycles, our bodies, and the
|
||||
Earth.
|
||||
</p>
|
||||
<p className="text-foreground/80 leading-relaxed">
|
||||
The 13-moon calendar reflects the actual lunar cycles we observe in nature. Thirteen moons of 28 days
|
||||
each creates a perfect, fractal harmony that resonates with human biology and Earth's rhythms.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,60 @@
|
|||
import * as React from 'react'
|
||||
import { Slot } from '@radix-ui/react-slot'
|
||||
import { cva, type VariantProps } from 'class-variance-authority'
|
||||
|
||||
import { cn } from '@/lib/utils'
|
||||
|
||||
const buttonVariants = cva(
|
||||
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
||||
{
|
||||
variants: {
|
||||
variant: {
|
||||
default: 'bg-primary text-primary-foreground hover:bg-primary/90',
|
||||
destructive:
|
||||
'bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60',
|
||||
outline:
|
||||
'border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50',
|
||||
secondary:
|
||||
'bg-secondary text-secondary-foreground hover:bg-secondary/80',
|
||||
ghost:
|
||||
'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',
|
||||
link: 'text-primary underline-offset-4 hover:underline',
|
||||
},
|
||||
size: {
|
||||
default: 'h-9 px-4 py-2 has-[>svg]:px-3',
|
||||
sm: 'h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5',
|
||||
lg: 'h-10 rounded-md px-6 has-[>svg]:px-4',
|
||||
icon: 'size-9',
|
||||
'icon-sm': 'size-8',
|
||||
'icon-lg': 'size-10',
|
||||
},
|
||||
},
|
||||
defaultVariants: {
|
||||
variant: 'default',
|
||||
size: 'default',
|
||||
},
|
||||
},
|
||||
)
|
||||
|
||||
function Button({
|
||||
className,
|
||||
variant,
|
||||
size,
|
||||
asChild = false,
|
||||
...props
|
||||
}: React.ComponentProps<'button'> &
|
||||
VariantProps<typeof buttonVariants> & {
|
||||
asChild?: boolean
|
||||
}) {
|
||||
const Comp = asChild ? Slot : 'button'
|
||||
|
||||
return (
|
||||
<Comp
|
||||
data-slot="button"
|
||||
className={cn(buttonVariants({ variant, size, className }))}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export { Button, buttonVariants }
|
||||
|
|
@ -0,0 +1,92 @@
|
|||
import * as React from 'react'
|
||||
|
||||
import { cn } from '@/lib/utils'
|
||||
|
||||
function Card({ className, ...props }: React.ComponentProps<'div'>) {
|
||||
return (
|
||||
<div
|
||||
data-slot="card"
|
||||
className={cn(
|
||||
'bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function CardHeader({ className, ...props }: React.ComponentProps<'div'>) {
|
||||
return (
|
||||
<div
|
||||
data-slot="card-header"
|
||||
className={cn(
|
||||
'@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function CardTitle({ className, ...props }: React.ComponentProps<'div'>) {
|
||||
return (
|
||||
<div
|
||||
data-slot="card-title"
|
||||
className={cn('leading-none font-semibold', className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function CardDescription({ className, ...props }: React.ComponentProps<'div'>) {
|
||||
return (
|
||||
<div
|
||||
data-slot="card-description"
|
||||
className={cn('text-muted-foreground text-sm', className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function CardAction({ className, ...props }: React.ComponentProps<'div'>) {
|
||||
return (
|
||||
<div
|
||||
data-slot="card-action"
|
||||
className={cn(
|
||||
'col-start-2 row-span-2 row-start-1 self-start justify-self-end',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function CardContent({ className, ...props }: React.ComponentProps<'div'>) {
|
||||
return (
|
||||
<div
|
||||
data-slot="card-content"
|
||||
className={cn('px-6', className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function CardFooter({ className, ...props }: React.ComponentProps<'div'>) {
|
||||
return (
|
||||
<div
|
||||
data-slot="card-footer"
|
||||
className={cn('flex items-center px-6 [.border-t]:pt-6', className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export {
|
||||
Card,
|
||||
CardHeader,
|
||||
CardFooter,
|
||||
CardTitle,
|
||||
CardAction,
|
||||
CardDescription,
|
||||
CardContent,
|
||||
}
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
import * as React from 'react'
|
||||
|
||||
import { cn } from '@/lib/utils'
|
||||
|
||||
function Input({ className, type, ...props }: React.ComponentProps<'input'>) {
|
||||
return (
|
||||
<input
|
||||
type={type}
|
||||
data-slot="input"
|
||||
className={cn(
|
||||
'file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
|
||||
'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',
|
||||
'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export { Input }
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
'use client'
|
||||
|
||||
import * as React from 'react'
|
||||
import * as LabelPrimitive from '@radix-ui/react-label'
|
||||
|
||||
import { cn } from '@/lib/utils'
|
||||
|
||||
function Label({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<typeof LabelPrimitive.Root>) {
|
||||
return (
|
||||
<LabelPrimitive.Root
|
||||
data-slot="label"
|
||||
className={cn(
|
||||
'flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export { Label }
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
import { clsx, type ClassValue } from 'clsx'
|
||||
import { twMerge } from 'tailwind-merge'
|
||||
|
||||
export function cn(...inputs: ClassValue[]) {
|
||||
return twMerge(clsx(inputs))
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
/** @type {import('next').NextConfig} */
|
||||
const nextConfig = {
|
||||
typescript: {
|
||||
ignoreBuildErrors: true,
|
||||
},
|
||||
images: {
|
||||
unoptimized: true,
|
||||
},
|
||||
|
||||
}
|
||||
|
||||
export default nextConfig
|
||||
|
|
@ -0,0 +1,73 @@
|
|||
{
|
||||
"name": "my-v0-project",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"build": "next build",
|
||||
"dev": "next dev",
|
||||
"lint": "eslint .",
|
||||
"start": "next start"
|
||||
},
|
||||
"dependencies": {
|
||||
"@hookform/resolvers": "^3.10.0",
|
||||
"@radix-ui/react-accordion": "1.2.2",
|
||||
"@radix-ui/react-alert-dialog": "1.1.4",
|
||||
"@radix-ui/react-aspect-ratio": "1.1.1",
|
||||
"@radix-ui/react-avatar": "1.1.2",
|
||||
"@radix-ui/react-checkbox": "1.1.3",
|
||||
"@radix-ui/react-collapsible": "1.1.2",
|
||||
"@radix-ui/react-context-menu": "2.2.4",
|
||||
"@radix-ui/react-dialog": "1.1.4",
|
||||
"@radix-ui/react-dropdown-menu": "2.1.4",
|
||||
"@radix-ui/react-hover-card": "1.1.4",
|
||||
"@radix-ui/react-label": "2.1.1",
|
||||
"@radix-ui/react-menubar": "1.1.4",
|
||||
"@radix-ui/react-navigation-menu": "1.2.3",
|
||||
"@radix-ui/react-popover": "1.1.4",
|
||||
"@radix-ui/react-progress": "1.1.1",
|
||||
"@radix-ui/react-radio-group": "1.2.2",
|
||||
"@radix-ui/react-scroll-area": "1.2.2",
|
||||
"@radix-ui/react-select": "2.1.4",
|
||||
"@radix-ui/react-separator": "1.1.1",
|
||||
"@radix-ui/react-slider": "1.2.2",
|
||||
"@radix-ui/react-slot": "1.1.1",
|
||||
"@radix-ui/react-switch": "1.1.2",
|
||||
"@radix-ui/react-tabs": "1.1.2",
|
||||
"@radix-ui/react-toast": "1.2.4",
|
||||
"@radix-ui/react-toggle": "1.1.1",
|
||||
"@radix-ui/react-toggle-group": "1.1.1",
|
||||
"@radix-ui/react-tooltip": "1.1.6",
|
||||
"@vercel/analytics": "latest",
|
||||
"autoprefixer": "^10.4.20",
|
||||
"class-variance-authority": "^0.7.1",
|
||||
"clsx": "^2.1.1",
|
||||
"cmdk": "1.0.4",
|
||||
"date-fns": "4.1.0",
|
||||
"embla-carousel-react": "8.5.1",
|
||||
"input-otp": "1.4.1",
|
||||
"lucide-react": "^0.454.0",
|
||||
"next": "16.0.3",
|
||||
"next-themes": "^0.4.6",
|
||||
"react": "19.2.0",
|
||||
"react-day-picker": "9.8.0",
|
||||
"react-dom": "19.2.0",
|
||||
"react-hook-form": "^7.60.0",
|
||||
"react-resizable-panels": "^2.1.7",
|
||||
"recharts": "2.15.4",
|
||||
"sonner": "^1.7.4",
|
||||
"tailwind-merge": "^2.5.5",
|
||||
"tailwindcss-animate": "^1.0.7",
|
||||
"vaul": "^1.1.2",
|
||||
"zod": "3.25.76"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tailwindcss/postcss": "^4.1.9",
|
||||
"@types/node": "^22",
|
||||
"@types/react": "^19",
|
||||
"@types/react-dom": "^19",
|
||||
"postcss": "^8.5",
|
||||
"tailwindcss": "^4.1.9",
|
||||
"tw-animate-css": "1.3.3",
|
||||
"typescript": "^5"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
/** @type {import('postcss-load-config').Config} */
|
||||
const config = {
|
||||
plugins: {
|
||||
'@tailwindcss/postcss': {},
|
||||
},
|
||||
}
|
||||
|
||||
export default config
|
||||
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 585 B |
|
After Width: | Height: | Size: 566 B |
|
|
@ -0,0 +1,26 @@
|
|||
<svg width="180" height="180" viewBox="0 0 180 180" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<style>
|
||||
@media (prefers-color-scheme: light) {
|
||||
.background { fill: black; }
|
||||
.foreground { fill: white; }
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.background { fill: white; }
|
||||
.foreground { fill: black; }
|
||||
}
|
||||
</style>
|
||||
<g clip-path="url(#clip0_7960_43945)">
|
||||
<rect class="background" width="180" height="180" rx="37" />
|
||||
<g style="transform: scale(95%); transform-origin: center">
|
||||
<path class="foreground"
|
||||
d="M101.141 53H136.632C151.023 53 162.689 64.6662 162.689 79.0573V112.904H148.112V79.0573C148.112 78.7105 148.098 78.3662 148.072 78.0251L112.581 112.898C112.701 112.902 112.821 112.904 112.941 112.904H148.112V126.672H112.941C98.5504 126.672 86.5638 114.891 86.5638 100.5V66.7434H101.141V100.5C101.141 101.15 101.191 101.792 101.289 102.422L137.56 66.7816C137.255 66.7563 136.945 66.7434 136.632 66.7434H101.141V53Z" />
|
||||
<path class="foreground"
|
||||
d="M65.2926 124.136L14 66.7372H34.6355L64.7495 100.436V66.7372H80.1365V118.47C80.1365 126.278 70.4953 129.958 65.2926 124.136Z" />
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_7960_43945">
|
||||
<rect width="180" height="180" fill="white" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 100 KiB |
|
After Width: | Height: | Size: 568 B |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="215" height="48" fill="none"><path fill="#000" d="M57.588 9.6h6L73.828 38h-5.2l-2.36-6.88h-11.36L52.548 38h-5.2l10.24-28.4Zm7.16 17.16-4.16-12.16-4.16 12.16h8.32Zm23.694-2.24c-.186-1.307-.706-2.32-1.56-3.04-.853-.72-1.866-1.08-3.04-1.08-1.68 0-2.986.613-3.92 1.84-.906 1.227-1.36 2.947-1.36 5.16s.454 3.933 1.36 5.16c.934 1.227 2.24 1.84 3.92 1.84 1.254 0 2.307-.373 3.16-1.12.854-.773 1.387-1.867 1.6-3.28l5.12.24c-.186 1.68-.733 3.147-1.64 4.4-.906 1.227-2.08 2.173-3.52 2.84-1.413.667-2.986 1-4.72 1-2.08 0-3.906-.453-5.48-1.36-1.546-.907-2.76-2.2-3.64-3.88-.853-1.68-1.28-3.627-1.28-5.84 0-2.24.427-4.187 1.28-5.84.88-1.68 2.094-2.973 3.64-3.88 1.574-.907 3.4-1.36 5.48-1.36 1.68 0 3.227.32 4.64.96 1.414.64 2.56 1.56 3.44 2.76.907 1.2 1.454 2.6 1.64 4.2l-5.12.28Zm11.486-7.72.12 3.4c.534-1.227 1.307-2.173 2.32-2.84 1.04-.693 2.267-1.04 3.68-1.04 1.494 0 2.76.387 3.8 1.16 1.067.747 1.827 1.813 2.28 3.2.507-1.44 1.294-2.52 2.36-3.24 1.094-.747 2.414-1.12 3.96-1.12 1.414 0 2.64.307 3.68.92s1.84 1.52 2.4 2.72c.56 1.2.84 2.667.84 4.4V38h-4.96V25.92c0-1.813-.293-3.187-.88-4.12-.56-.96-1.413-1.44-2.56-1.44-.906 0-1.68.213-2.32.64-.64.427-1.133 1.053-1.48 1.88-.32.827-.48 1.84-.48 3.04V38h-4.56V25.92c0-1.2-.133-2.213-.4-3.04-.24-.827-.626-1.453-1.16-1.88-.506-.427-1.133-.64-1.88-.64-.906 0-1.68.227-2.32.68-.64.427-1.133 1.053-1.48 1.88-.32.827-.48 1.827-.48 3V38h-4.96V16.8h4.48Zm26.723 10.6c0-2.24.427-4.187 1.28-5.84.854-1.68 2.067-2.973 3.64-3.88 1.574-.907 3.4-1.36 5.48-1.36 1.84 0 3.494.413 4.96 1.24 1.467.827 2.64 2.08 3.52 3.76.88 1.653 1.347 3.693 1.4 6.12v1.32h-15.08c.107 1.813.614 3.227 1.52 4.24.907.987 2.134 1.48 3.68 1.48.987 0 1.88-.253 2.68-.76a4.803 4.803 0 0 0 1.84-2.2l5.08.36c-.64 2.027-1.84 3.64-3.6 4.84-1.733 1.173-3.733 1.76-6 1.76-2.08 0-3.906-.453-5.48-1.36-1.573-.907-2.786-2.2-3.64-3.88-.853-1.68-1.28-3.627-1.28-5.84Zm15.16-2.04c-.213-1.733-.76-3.013-1.64-3.84-.853-.827-1.893-1.24-3.12-1.24-1.44 0-2.6.453-3.48 1.36-.88.88-1.44 2.12-1.68 3.72h9.92ZM163.139 9.6V38h-5.04V9.6h5.04Zm8.322 7.2.24 5.88-.64-.36c.32-2.053 1.094-3.56 2.32-4.52 1.254-.987 2.787-1.48 4.6-1.48 2.32 0 4.107.733 5.36 2.2 1.254 1.44 1.88 3.387 1.88 5.84V38h-4.96V25.92c0-1.253-.12-2.28-.36-3.08-.24-.8-.64-1.413-1.2-1.84-.533-.427-1.253-.64-2.16-.64-1.44 0-2.573.48-3.4 1.44-.8.933-1.2 2.307-1.2 4.12V38h-4.96V16.8h4.48Zm30.003 7.72c-.186-1.307-.706-2.32-1.56-3.04-.853-.72-1.866-1.08-3.04-1.08-1.68 0-2.986.613-3.92 1.84-.906 1.227-1.36 2.947-1.36 5.16s.454 3.933 1.36 5.16c.934 1.227 2.24 1.84 3.92 1.84 1.254 0 2.307-.373 3.16-1.12.854-.773 1.387-1.867 1.6-3.28l5.12.24c-.186 1.68-.733 3.147-1.64 4.4-.906 1.227-2.08 2.173-3.52 2.84-1.413.667-2.986 1-4.72 1-2.08 0-3.906-.453-5.48-1.36-1.546-.907-2.76-2.2-3.64-3.88-.853-1.68-1.28-3.627-1.28-5.84 0-2.24.427-4.187 1.28-5.84.88-1.68 2.094-2.973 3.64-3.88 1.574-.907 3.4-1.36 5.48-1.36 1.68 0 3.227.32 4.64.96 1.414.64 2.56 1.56 3.44 2.76.907 1.2 1.454 2.6 1.64 4.2l-5.12.28Zm11.443 8.16V38h-5.6v-5.32h5.6Z"/><path fill="#171717" fill-rule="evenodd" d="m7.839 40.783 16.03-28.054L20 6 0 40.783h7.839Zm8.214 0H40L27.99 19.894l-4.02 7.032 3.976 6.914H20.02l-3.967 6.943Z" clip-rule="evenodd"/></svg>
|
||||
|
After Width: | Height: | Size: 3.1 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.0 KiB |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="1200" fill="none"><rect width="1200" height="1200" fill="#EAEAEA" rx="3"/><g opacity=".5"><g opacity=".5"><path fill="#FAFAFA" d="M600.709 736.5c-75.454 0-136.621-61.167-136.621-136.62 0-75.454 61.167-136.621 136.621-136.621 75.453 0 136.62 61.167 136.62 136.621 0 75.453-61.167 136.62-136.62 136.62Z"/><path stroke="#C9C9C9" stroke-width="2.418" d="M600.709 736.5c-75.454 0-136.621-61.167-136.621-136.62 0-75.454 61.167-136.621 136.621-136.621 75.453 0 136.62 61.167 136.62 136.621 0 75.453-61.167 136.62-136.62 136.62Z"/></g><path stroke="url(#a)" stroke-width="2.418" d="M0-1.209h553.581" transform="scale(1 -1) rotate(45 1163.11 91.165)"/><path stroke="url(#b)" stroke-width="2.418" d="M404.846 598.671h391.726"/><path stroke="url(#c)" stroke-width="2.418" d="M599.5 795.742V404.017"/><path stroke="url(#d)" stroke-width="2.418" d="m795.717 796.597-391.441-391.44"/><path fill="#fff" d="M600.709 656.704c-31.384 0-56.825-25.441-56.825-56.824 0-31.384 25.441-56.825 56.825-56.825 31.383 0 56.824 25.441 56.824 56.825 0 31.383-25.441 56.824-56.824 56.824Z"/><g clip-path="url(#e)"><path fill="#666" fill-rule="evenodd" d="M616.426 586.58h-31.434v16.176l3.553-3.554.531-.531h9.068l.074-.074 8.463-8.463h2.565l7.18 7.181V586.58Zm-15.715 14.654 3.698 3.699 1.283 1.282-2.565 2.565-1.282-1.283-5.2-5.199h-6.066l-5.514 5.514-.073.073v2.876a2.418 2.418 0 0 0 2.418 2.418h26.598a2.418 2.418 0 0 0 2.418-2.418v-8.317l-8.463-8.463-7.181 7.181-.071.072Zm-19.347 5.442v4.085a6.045 6.045 0 0 0 6.046 6.045h26.598a6.044 6.044 0 0 0 6.045-6.045v-7.108l1.356-1.355-1.282-1.283-.074-.073v-17.989h-38.689v23.43l-.146.146.146.147Z" clip-rule="evenodd"/></g><path stroke="#C9C9C9" stroke-width="2.418" d="M600.709 656.704c-31.384 0-56.825-25.441-56.825-56.824 0-31.384 25.441-56.825 56.825-56.825 31.383 0 56.824 25.441 56.824 56.825 0 31.383-25.441 56.824-56.824 56.824Z"/></g><defs><linearGradient id="a" x1="554.061" x2="-.48" y1=".083" y2=".087" gradientUnits="userSpaceOnUse"><stop stop-color="#C9C9C9" stop-opacity="0"/><stop offset=".208" stop-color="#C9C9C9"/><stop offset=".792" stop-color="#C9C9C9"/><stop offset="1" stop-color="#C9C9C9" stop-opacity="0"/></linearGradient><linearGradient id="b" x1="796.912" x2="404.507" y1="599.963" y2="599.965" gradientUnits="userSpaceOnUse"><stop stop-color="#C9C9C9" stop-opacity="0"/><stop offset=".208" stop-color="#C9C9C9"/><stop offset=".792" stop-color="#C9C9C9"/><stop offset="1" stop-color="#C9C9C9" stop-opacity="0"/></linearGradient><linearGradient id="c" x1="600.792" x2="600.794" y1="403.677" y2="796.082" gradientUnits="userSpaceOnUse"><stop stop-color="#C9C9C9" stop-opacity="0"/><stop offset=".208" stop-color="#C9C9C9"/><stop offset=".792" stop-color="#C9C9C9"/><stop offset="1" stop-color="#C9C9C9" stop-opacity="0"/></linearGradient><linearGradient id="d" x1="404.85" x2="796.972" y1="403.903" y2="796.02" gradientUnits="userSpaceOnUse"><stop stop-color="#C9C9C9" stop-opacity="0"/><stop offset=".208" stop-color="#C9C9C9"/><stop offset=".792" stop-color="#C9C9C9"/><stop offset="1" stop-color="#C9C9C9" stop-opacity="0"/></linearGradient><clipPath id="e"><path fill="#fff" d="M581.364 580.535h38.689v38.689h-38.689z"/></clipPath></defs></svg>
|
||||
|
After Width: | Height: | Size: 3.2 KiB |
|
After Width: | Height: | Size: 146 KiB |
|
|
@ -0,0 +1,125 @@
|
|||
@import 'tailwindcss';
|
||||
@import 'tw-animate-css';
|
||||
|
||||
@custom-variant dark (&:is(.dark *));
|
||||
|
||||
:root {
|
||||
--background: oklch(1 0 0);
|
||||
--foreground: oklch(0.145 0 0);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: oklch(0.145 0 0);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: oklch(0.145 0 0);
|
||||
--primary: oklch(0.205 0 0);
|
||||
--primary-foreground: oklch(0.985 0 0);
|
||||
--secondary: oklch(0.97 0 0);
|
||||
--secondary-foreground: oklch(0.205 0 0);
|
||||
--muted: oklch(0.97 0 0);
|
||||
--muted-foreground: oklch(0.556 0 0);
|
||||
--accent: oklch(0.97 0 0);
|
||||
--accent-foreground: oklch(0.205 0 0);
|
||||
--destructive: oklch(0.577 0.245 27.325);
|
||||
--destructive-foreground: oklch(0.577 0.245 27.325);
|
||||
--border: oklch(0.922 0 0);
|
||||
--input: oklch(0.922 0 0);
|
||||
--ring: oklch(0.708 0 0);
|
||||
--chart-1: oklch(0.646 0.222 41.116);
|
||||
--chart-2: oklch(0.6 0.118 184.704);
|
||||
--chart-3: oklch(0.398 0.07 227.392);
|
||||
--chart-4: oklch(0.828 0.189 84.429);
|
||||
--chart-5: oklch(0.769 0.188 70.08);
|
||||
--radius: 0.625rem;
|
||||
--sidebar: oklch(0.985 0 0);
|
||||
--sidebar-foreground: oklch(0.145 0 0);
|
||||
--sidebar-primary: oklch(0.205 0 0);
|
||||
--sidebar-primary-foreground: oklch(0.985 0 0);
|
||||
--sidebar-accent: oklch(0.97 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.205 0 0);
|
||||
--sidebar-border: oklch(0.922 0 0);
|
||||
--sidebar-ring: oklch(0.708 0 0);
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.145 0 0);
|
||||
--foreground: oklch(0.985 0 0);
|
||||
--card: oklch(0.145 0 0);
|
||||
--card-foreground: oklch(0.985 0 0);
|
||||
--popover: oklch(0.145 0 0);
|
||||
--popover-foreground: oklch(0.985 0 0);
|
||||
--primary: oklch(0.985 0 0);
|
||||
--primary-foreground: oklch(0.205 0 0);
|
||||
--secondary: oklch(0.269 0 0);
|
||||
--secondary-foreground: oklch(0.985 0 0);
|
||||
--muted: oklch(0.269 0 0);
|
||||
--muted-foreground: oklch(0.708 0 0);
|
||||
--accent: oklch(0.269 0 0);
|
||||
--accent-foreground: oklch(0.985 0 0);
|
||||
--destructive: oklch(0.396 0.141 25.723);
|
||||
--destructive-foreground: oklch(0.637 0.237 25.331);
|
||||
--border: oklch(0.269 0 0);
|
||||
--input: oklch(0.269 0 0);
|
||||
--ring: oklch(0.439 0 0);
|
||||
--chart-1: oklch(0.488 0.243 264.376);
|
||||
--chart-2: oklch(0.696 0.17 162.48);
|
||||
--chart-3: oklch(0.769 0.188 70.08);
|
||||
--chart-4: oklch(0.627 0.265 303.9);
|
||||
--chart-5: oklch(0.645 0.246 16.439);
|
||||
--sidebar: oklch(0.205 0 0);
|
||||
--sidebar-foreground: oklch(0.985 0 0);
|
||||
--sidebar-primary: oklch(0.488 0.243 264.376);
|
||||
--sidebar-primary-foreground: oklch(0.985 0 0);
|
||||
--sidebar-accent: oklch(0.269 0 0);
|
||||
--sidebar-accent-foreground: oklch(0.985 0 0);
|
||||
--sidebar-border: oklch(0.269 0 0);
|
||||
--sidebar-ring: oklch(0.439 0 0);
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--font-sans: 'Geist', 'Geist Fallback';
|
||||
--font-mono: 'Geist Mono', 'Geist Mono Fallback';
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
}
|
||||
|
||||
@layer base {
|
||||
* {
|
||||
@apply border-border outline-ring/50;
|
||||
}
|
||||
body {
|
||||
@apply bg-background text-foreground;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"lib": ["dom", "dom.iterable", "esnext"],
|
||||
"allowJs": true,
|
||||
"target": "ES6",
|
||||
"skipLibCheck": true,
|
||||
"strict": true,
|
||||
"noEmit": true,
|
||||
"esModuleInterop": true,
|
||||
"module": "esnext",
|
||||
"moduleResolution": "bundler",
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"jsx": "preserve",
|
||||
"incremental": true,
|
||||
"plugins": [
|
||||
{
|
||||
"name": "next"
|
||||
}
|
||||
],
|
||||
"paths": {
|
||||
"@/*": ["./*"]
|
||||
}
|
||||
},
|
||||
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
|
||||
"exclude": ["node_modules"]
|
||||
}
|
||||