Initialized repository for chat Psilo-cybernetics website
Co-authored-by: Jeff Emmett <46964190+Jeff-Emmett@users.noreply.github.com>
This commit is contained in:
v0
commit
7cd1ceb3eb
|
|
@ -0,0 +1,27 @@
|
|||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
||||
|
||||
# dependencies
|
||||
/node_modules
|
||||
|
||||
# next.js
|
||||
/.next/
|
||||
/out/
|
||||
|
||||
# production
|
||||
/build
|
||||
|
||||
# debug
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
.pnpm-debug.log*
|
||||
|
||||
# env files
|
||||
.env*
|
||||
|
||||
# vercel
|
||||
.vercel
|
||||
|
||||
# typescript
|
||||
*.tsbuildinfo
|
||||
next-env.d.ts
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
# Psilo-cybernetics website
|
||||
|
||||
*Automatically synced with your [v0.app](https://v0.app) deployments*
|
||||
|
||||
[](https://vercel.com/jeff-emmetts-projects/v0-psilo-cybernetics-website)
|
||||
[](https://v0.app/chat/fSq1ioBSqMS)
|
||||
|
||||
## 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-psilo-cybernetics-website](https://vercel.com/jeff-emmetts-projects/v0-psilo-cybernetics-website)**
|
||||
|
||||
## Build your app
|
||||
|
||||
Continue building your app on:
|
||||
|
||||
**[https://v0.app/chat/fSq1ioBSqMS](https://v0.app/chat/fSq1ioBSqMS)**
|
||||
|
||||
## 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,183 @@
|
|||
@import "tailwindcss";
|
||||
@import "tw-animate-css";
|
||||
|
||||
@custom-variant dark (&:is(.dark *));
|
||||
|
||||
:root {
|
||||
/* Tron-style cyber aesthetic with neon colors */
|
||||
--background: oklch(0.08 0.02 265);
|
||||
--foreground: oklch(0.95 0.05 200);
|
||||
--card: oklch(0.12 0.03 265);
|
||||
--card-foreground: oklch(0.95 0.05 200);
|
||||
--popover: oklch(0.12 0.03 265);
|
||||
--popover-foreground: oklch(0.95 0.05 200);
|
||||
--primary: oklch(0.65 0.25 195);
|
||||
--primary-foreground: oklch(0.08 0.02 265);
|
||||
--secondary: oklch(0.7 0.28 320);
|
||||
--secondary-foreground: oklch(0.08 0.02 265);
|
||||
--muted: oklch(0.15 0.03 265);
|
||||
--muted-foreground: oklch(0.6 0.08 200);
|
||||
--accent: oklch(0.75 0.3 180);
|
||||
--accent-foreground: oklch(0.08 0.02 265);
|
||||
--destructive: oklch(0.577 0.245 27.325);
|
||||
--destructive-foreground: oklch(0.95 0.05 200);
|
||||
--border: oklch(0.25 0.08 195);
|
||||
--input: oklch(0.25 0.08 195);
|
||||
--ring: oklch(0.65 0.25 195);
|
||||
--chart-1: oklch(0.65 0.25 195);
|
||||
--chart-2: oklch(0.7 0.28 320);
|
||||
--chart-3: oklch(0.75 0.3 180);
|
||||
--chart-4: oklch(0.6 0.22 280);
|
||||
--chart-5: oklch(0.7 0.26 160);
|
||||
--radius: 0.5rem;
|
||||
--sidebar: oklch(0.12 0.03 265);
|
||||
--sidebar-foreground: oklch(0.95 0.05 200);
|
||||
--sidebar-primary: oklch(0.65 0.25 195);
|
||||
--sidebar-primary-foreground: oklch(0.08 0.02 265);
|
||||
--sidebar-accent: oklch(0.15 0.03 265);
|
||||
--sidebar-accent-foreground: oklch(0.95 0.05 200);
|
||||
--sidebar-border: oklch(0.25 0.08 195);
|
||||
--sidebar-ring: oklch(0.65 0.25 195);
|
||||
}
|
||||
|
||||
.dark {
|
||||
/* Dark mode maintains cyber aesthetic */
|
||||
--background: oklch(0.05 0.02 265);
|
||||
--foreground: oklch(0.98 0.05 200);
|
||||
--card: oklch(0.1 0.03 265);
|
||||
--card-foreground: oklch(0.98 0.05 200);
|
||||
--popover: oklch(0.1 0.03 265);
|
||||
--popover-foreground: oklch(0.98 0.05 200);
|
||||
--primary: oklch(0.7 0.28 195);
|
||||
--primary-foreground: oklch(0.05 0.02 265);
|
||||
--secondary: oklch(0.75 0.3 320);
|
||||
--secondary-foreground: oklch(0.05 0.02 265);
|
||||
--muted: oklch(0.12 0.03 265);
|
||||
--muted-foreground: oklch(0.65 0.08 200);
|
||||
--accent: oklch(0.8 0.32 180);
|
||||
--accent-foreground: oklch(0.05 0.02 265);
|
||||
--destructive: oklch(0.396 0.141 25.723);
|
||||
--destructive-foreground: oklch(0.98 0.05 200);
|
||||
--border: oklch(0.3 0.1 195);
|
||||
--input: oklch(0.3 0.1 195);
|
||||
--ring: oklch(0.7 0.28 195);
|
||||
--chart-1: oklch(0.7 0.28 195);
|
||||
--chart-2: oklch(0.75 0.3 320);
|
||||
--chart-3: oklch(0.8 0.32 180);
|
||||
--chart-4: oklch(0.65 0.24 280);
|
||||
--chart-5: oklch(0.75 0.28 160);
|
||||
--sidebar: oklch(0.1 0.03 265);
|
||||
--sidebar-foreground: oklch(0.98 0.05 200);
|
||||
--sidebar-primary: oklch(0.7 0.28 195);
|
||||
--sidebar-primary-foreground: oklch(0.05 0.02 265);
|
||||
--sidebar-accent: oklch(0.12 0.03 265);
|
||||
--sidebar-accent-foreground: oklch(0.98 0.05 200);
|
||||
--sidebar-border: oklch(0.3 0.1 195);
|
||||
--sidebar-ring: oklch(0.7 0.28 195);
|
||||
}
|
||||
|
||||
@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;
|
||||
}
|
||||
}
|
||||
|
||||
/* Adding cyber glow effects and animations */
|
||||
@keyframes glow-pulse {
|
||||
0%,
|
||||
100% {
|
||||
filter: drop-shadow(0 0 2px currentColor) drop-shadow(0 0 8px currentColor);
|
||||
}
|
||||
50% {
|
||||
filter: drop-shadow(0 0 4px currentColor) drop-shadow(0 0 16px currentColor);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes scan-line {
|
||||
0% {
|
||||
transform: translateY(-100%);
|
||||
}
|
||||
100% {
|
||||
transform: translateY(100vh);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fractal-spin {
|
||||
0% {
|
||||
transform: rotate(0deg) scale(1);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(180deg) scale(1.1);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.glow-text {
|
||||
text-shadow: 0 0 10px currentColor, 0 0 20px currentColor, 0 0 30px currentColor;
|
||||
}
|
||||
|
||||
.glow-border {
|
||||
box-shadow: 0 0 10px currentColor, 0 0 20px currentColor, inset 0 0 10px currentColor;
|
||||
}
|
||||
|
||||
.scan-lines::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: linear-gradient(transparent 50%, rgba(0, 255, 255, 0.03) 50%);
|
||||
background-size: 100% 4px;
|
||||
pointer-events: none;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.cyber-grid {
|
||||
background-image: linear-gradient(rgba(0, 255, 255, 0.1) 1px, transparent 1px),
|
||||
linear-gradient(90deg, rgba(0, 255, 255, 0.1) 1px, transparent 1px);
|
||||
background-size: 50px 50px;
|
||||
}
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
import type React from "react"
|
||||
import type { Metadata } from "next"
|
||||
import { Geist, Geist_Mono } from "next/font/google"
|
||||
import { Analytics } from "@vercel/analytics/next"
|
||||
import "./globals.css"
|
||||
|
||||
const _geist = Geist({ subsets: ["latin"] })
|
||||
const _geistMono = Geist_Mono({ subsets: ["latin"] })
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "MycoFi | Psilo-Cybernetics & Institutional Neuroplasticity",
|
||||
description:
|
||||
"Exploring the emergence of institutional neuroplasticity through myco-principic design and real-time community collaboration tools",
|
||||
generator: "v0.app",
|
||||
}
|
||||
|
||||
export default function RootLayout({
|
||||
children,
|
||||
}: Readonly<{
|
||||
children: React.ReactNode
|
||||
}>) {
|
||||
return (
|
||||
<html lang="en">
|
||||
<body className={`font-sans antialiased`}>
|
||||
{children}
|
||||
<Analytics />
|
||||
</body>
|
||||
</html>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
import { Hero } from "@/components/hero"
|
||||
import { ConceptsGrid } from "@/components/concepts-grid"
|
||||
import { NetworkVisualization } from "@/components/network-visualization"
|
||||
import { Principles } from "@/components/principles"
|
||||
import { Applications } from "@/components/applications"
|
||||
import { Footer } from "@/components/footer"
|
||||
|
||||
export default function Home() {
|
||||
return (
|
||||
<main className="min-h-screen">
|
||||
<Hero />
|
||||
<ConceptsGrid />
|
||||
<NetworkVisualization />
|
||||
<Principles />
|
||||
<Applications />
|
||||
<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,135 @@
|
|||
import { Card } from "@/components/ui/card"
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { Coins, Vote, Database, MessageSquare, ArrowRight } from "lucide-react"
|
||||
|
||||
const applications = [
|
||||
{
|
||||
icon: Coins,
|
||||
title: "Economic Collaboration",
|
||||
description:
|
||||
"Decentralized resource allocation, mutual credit systems, and transparent value flows that adapt to community needs in real-time.",
|
||||
features: ["Mutual Credit Networks", "Dynamic Resource Pools", "Value Flow Tracking"],
|
||||
},
|
||||
{
|
||||
icon: Vote,
|
||||
title: "Democratic Governance",
|
||||
description:
|
||||
"Participatory decision-making tools that scale from local to global, enabling fluid consensus and adaptive policy formation.",
|
||||
features: ["Liquid Democracy", "Quadratic Voting", "Consent-Based Protocols"],
|
||||
},
|
||||
{
|
||||
icon: Database,
|
||||
title: "Computational Infrastructure",
|
||||
description:
|
||||
"Distributed computing networks that grow organically, sharing processing power and data storage across community nodes.",
|
||||
features: ["Peer-to-Peer Computing", "Federated Data Storage", "Edge Processing"],
|
||||
},
|
||||
{
|
||||
icon: MessageSquare,
|
||||
title: "Knowledge Commons",
|
||||
description:
|
||||
"Collaborative learning environments where insights propagate through the network, creating collective intelligence.",
|
||||
features: ["Distributed Knowledge Graphs", "Collaborative Sense-Making", "Emergent Documentation"],
|
||||
},
|
||||
]
|
||||
|
||||
export function Applications() {
|
||||
return (
|
||||
<section className="py-24 px-4 relative overflow-hidden scan-lines">
|
||||
<div className="absolute inset-0 cyber-grid opacity-10" />
|
||||
<div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-primary/5 rounded-full blur-3xl animate-pulse" />
|
||||
|
||||
<div className="max-w-7xl mx-auto relative z-10">
|
||||
<div className="text-center mb-16">
|
||||
<h2 className="text-3xl md:text-5xl font-bold mb-4 text-balance glow-text text-primary">
|
||||
{"Real-Time Collaboration Tools"}
|
||||
</h2>
|
||||
<p className="text-lg text-accent max-w-2xl mx-auto text-pretty glow-text">
|
||||
{"Practical applications of MycoFi principles for community coordination and collective action"}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="grid lg:grid-cols-2 gap-8">
|
||||
{applications.map((app, index) => {
|
||||
const Icon = app.icon
|
||||
const hue = 180 + index * 40
|
||||
return (
|
||||
<Card
|
||||
key={index}
|
||||
className="p-8 hover:shadow-lg transition-all border-2 glow-border bg-card/80 backdrop-blur-sm hover:scale-105"
|
||||
style={{
|
||||
borderColor: `hsl(${hue}, 100%, 50%)`,
|
||||
boxShadow: `0 0 25px hsla(${hue}, 100%, 50%, 0.3)`,
|
||||
}}
|
||||
>
|
||||
<div className="space-y-4">
|
||||
<div
|
||||
className="w-14 h-14 rounded-xl flex items-center justify-center border-2"
|
||||
style={{
|
||||
borderColor: `hsl(${hue}, 100%, 60%)`,
|
||||
color: `hsl(${hue}, 100%, 60%)`,
|
||||
boxShadow: `0 0 20px hsla(${hue}, 100%, 60%, 0.5)`,
|
||||
}}
|
||||
>
|
||||
<Icon className="w-7 h-7" style={{ animation: "glow-pulse 2s ease-in-out infinite" }} />
|
||||
</div>
|
||||
<h3 className="text-2xl font-semibold glow-text" style={{ color: `hsl(${hue}, 100%, 70%)` }}>
|
||||
{app.title}
|
||||
</h3>
|
||||
<p className="text-muted-foreground leading-relaxed">{app.description}</p>
|
||||
|
||||
<div className="pt-2">
|
||||
<p className="text-sm font-medium mb-2 text-accent glow-text">{"Key Features:"}</p>
|
||||
<ul className="space-y-1">
|
||||
{app.features.map((feature, i) => (
|
||||
<li key={i} className="text-sm text-muted-foreground flex items-center gap-2">
|
||||
<div
|
||||
className="w-1.5 h-1.5 rounded-full"
|
||||
style={{
|
||||
backgroundColor: `hsl(${hue}, 100%, 60%)`,
|
||||
boxShadow: `0 0 5px hsl(${hue}, 100%, 60%)`,
|
||||
}}
|
||||
/>
|
||||
{feature}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
|
||||
<div className="mt-16 text-center">
|
||||
<Card className="p-12 border-2 border-primary glow-border bg-gradient-to-br from-primary/20 to-secondary/20 backdrop-blur-sm">
|
||||
<h3 className="text-2xl md:text-3xl font-bold mb-4 text-balance glow-text text-primary">
|
||||
{"Ready to Explore the Network?"}
|
||||
</h3>
|
||||
<p className="text-lg mb-8 max-w-2xl mx-auto text-accent glow-text">
|
||||
{
|
||||
"Dive deeper into psilo-cybernetics and discover how myco-principic design can transform your community or organization"
|
||||
}
|
||||
</p>
|
||||
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
||||
<Button
|
||||
size="lg"
|
||||
className="gap-2 border-2 border-accent bg-accent/20 text-accent glow-border hover:bg-accent/30"
|
||||
>
|
||||
{"Access the Book"}
|
||||
<ArrowRight className="w-4 h-4" />
|
||||
</Button>
|
||||
<Button
|
||||
size="lg"
|
||||
variant="outline"
|
||||
className="gap-2 border-2 border-secondary text-secondary glow-border hover:bg-secondary/10 bg-transparent"
|
||||
>
|
||||
{"Join the Community"}
|
||||
</Button>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,70 @@
|
|||
import { Card } from "@/components/ui/card"
|
||||
import { Brain, Network, Sprout, Users } from "lucide-react"
|
||||
|
||||
const concepts = [
|
||||
{
|
||||
icon: Brain,
|
||||
title: "Psilo-Cybernetics",
|
||||
description:
|
||||
"The study of feedback loops and self-organizing systems inspired by mycelial networks and psychedelic insights into interconnectedness.",
|
||||
},
|
||||
{
|
||||
icon: Sprout,
|
||||
title: "Institutional Neuroplasticity",
|
||||
description:
|
||||
"Organizations that adapt and evolve like neural networks, continuously learning and reorganizing based on environmental feedback.",
|
||||
},
|
||||
{
|
||||
icon: Network,
|
||||
title: "MycoFi Framework",
|
||||
description:
|
||||
"A decentralized infrastructure connecting economic, democratic, and computational systems through myco-principic design patterns.",
|
||||
},
|
||||
{
|
||||
icon: Users,
|
||||
title: "Community Collaboration",
|
||||
description:
|
||||
"Real-time tooling for collective decision-making, resource allocation, and knowledge sharing across distributed networks.",
|
||||
},
|
||||
]
|
||||
|
||||
export function ConceptsGrid() {
|
||||
return (
|
||||
<section className="py-24 px-4 relative overflow-hidden">
|
||||
<div className="absolute inset-0 cyber-grid opacity-10" />
|
||||
|
||||
<div className="max-w-7xl mx-auto relative z-10">
|
||||
<div className="text-center mb-16">
|
||||
<h2 className="text-3xl md:text-5xl font-bold mb-4 text-balance glow-text text-secondary">
|
||||
{"Core Concepts"}
|
||||
</h2>
|
||||
<p className="text-lg text-accent max-w-2xl mx-auto text-pretty glow-text">
|
||||
{"Understanding the foundational principles that enable adaptive, interconnected systems"}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-6">
|
||||
{concepts.map((concept, index) => {
|
||||
const Icon = concept.icon
|
||||
return (
|
||||
<Card
|
||||
key={index}
|
||||
className="p-8 hover:shadow-lg transition-all border-2 border-primary/50 glow-border bg-card/80 backdrop-blur-sm hover:border-primary"
|
||||
>
|
||||
<div className="flex items-start gap-4">
|
||||
<div className="p-3 rounded-lg border-2 border-accent text-accent glow-border">
|
||||
<Icon className="w-6 h-6" style={{ animation: "glow-pulse 3s ease-in-out infinite" }} />
|
||||
</div>
|
||||
<div className="flex-1">
|
||||
<h3 className="text-xl font-semibold mb-2 text-primary glow-text">{concept.title}</h3>
|
||||
<p className="text-muted-foreground leading-relaxed">{concept.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
import { Network } from "lucide-react"
|
||||
|
||||
export function Footer() {
|
||||
return (
|
||||
<footer className="border-t bg-muted/30 py-12 px-4">
|
||||
<div className="max-w-7xl mx-auto">
|
||||
<div className="flex flex-col md:flex-row justify-between items-center gap-6">
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="w-8 h-8 rounded-lg bg-primary/10 text-primary flex items-center justify-center">
|
||||
<Network className="w-5 h-5" />
|
||||
</div>
|
||||
<span className="font-semibold text-lg">{"MycoFi"}</span>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-wrap justify-center gap-6 text-sm text-muted-foreground">
|
||||
<a href="#" className="hover:text-foreground transition-colors">
|
||||
{"About"}
|
||||
</a>
|
||||
<a href="#" className="hover:text-foreground transition-colors">
|
||||
{"Research"}
|
||||
</a>
|
||||
<a href="#" className="hover:text-foreground transition-colors">
|
||||
{"Community"}
|
||||
</a>
|
||||
<a href="https://book.mycofi.earth" className="hover:text-foreground transition-colors">
|
||||
{"Book"}
|
||||
</a>
|
||||
<a href="#" className="hover:text-foreground transition-colors">
|
||||
{"Contact"}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mt-8 pt-8 border-t text-center text-sm text-muted-foreground">
|
||||
<p>{"Exploring institutional neuroplasticity through myco-principic design"}</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,107 @@
|
|||
import { Button } from "@/components/ui/button"
|
||||
import { ArrowRight, Network } from "lucide-react"
|
||||
|
||||
export function Hero() {
|
||||
return (
|
||||
<section className="relative min-h-screen flex items-center justify-center overflow-hidden px-4 py-20 scan-lines">
|
||||
<div className="absolute inset-0 cyber-grid opacity-20" />
|
||||
|
||||
<div className="absolute inset-0 overflow-hidden">
|
||||
<div className="absolute top-1/4 left-1/4 w-96 h-96 bg-primary/20 rounded-full blur-3xl animate-pulse" />
|
||||
<div
|
||||
className="absolute bottom-1/4 right-1/4 w-96 h-96 bg-secondary/20 rounded-full blur-3xl animate-pulse"
|
||||
style={{ animationDelay: "1s" }}
|
||||
/>
|
||||
<div
|
||||
className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[600px] h-[600px] bg-accent/10 rounded-full blur-3xl animate-pulse"
|
||||
style={{ animationDelay: "2s" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<svg className="absolute inset-0 w-full h-full opacity-30" xmlns="http://www.w3.org/2000/svg">
|
||||
<defs>
|
||||
<linearGradient id="laser-gradient" x1="0%" y1="0%" x2="100%" y2="100%">
|
||||
<stop offset="0%" style={{ stopColor: "rgb(0, 255, 255)", stopOpacity: 0 }} />
|
||||
<stop offset="50%" style={{ stopColor: "rgb(0, 255, 255)", stopOpacity: 1 }} />
|
||||
<stop offset="100%" style={{ stopColor: "rgb(255, 0, 255)", stopOpacity: 0 }} />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<line
|
||||
x1="0"
|
||||
y1="0"
|
||||
x2="100%"
|
||||
y2="100%"
|
||||
stroke="url(#laser-gradient)"
|
||||
strokeWidth="2"
|
||||
className="animate-pulse"
|
||||
/>
|
||||
<line
|
||||
x1="100%"
|
||||
y1="0"
|
||||
x2="0"
|
||||
y2="100%"
|
||||
stroke="url(#laser-gradient)"
|
||||
strokeWidth="2"
|
||||
className="animate-pulse"
|
||||
style={{ animationDelay: "0.5s" }}
|
||||
/>
|
||||
<circle
|
||||
cx="50%"
|
||||
cy="50%"
|
||||
r="200"
|
||||
fill="none"
|
||||
stroke="rgb(0, 255, 255)"
|
||||
strokeWidth="1"
|
||||
opacity="0.3"
|
||||
className="animate-pulse"
|
||||
/>
|
||||
<circle
|
||||
cx="50%"
|
||||
cy="50%"
|
||||
r="300"
|
||||
fill="none"
|
||||
stroke="rgb(255, 0, 255)"
|
||||
strokeWidth="1"
|
||||
opacity="0.2"
|
||||
className="animate-pulse"
|
||||
style={{ animationDelay: "1s" }}
|
||||
/>
|
||||
</svg>
|
||||
|
||||
<div className="relative max-w-5xl mx-auto text-center space-y-8 z-10">
|
||||
<div className="inline-flex items-center gap-2 px-4 py-2 rounded-full border-2 border-primary text-primary text-sm font-medium mb-4 glow-border">
|
||||
<Network className="w-4 h-4" style={{ animation: "glow-pulse 2s ease-in-out infinite" }} />
|
||||
<span className="glow-text">{"Myco-Principic Design"}</span>
|
||||
</div>
|
||||
|
||||
<h1 className="text-5xl md:text-7xl font-bold tracking-tight text-balance glow-text">
|
||||
{"Psilo-Cybernetics"}
|
||||
<span className="block text-primary mt-2 glow-text">{"& Institutional Neuroplasticity"}</span>
|
||||
</h1>
|
||||
|
||||
<p className="text-xl md:text-2xl text-accent max-w-3xl mx-auto text-pretty leading-relaxed glow-text">
|
||||
{
|
||||
"Exploring the emergence of adaptive institutions through MycoFi—a framework connecting mycelial intelligence with decentralized systems for real-time community collaboration"
|
||||
}
|
||||
</p>
|
||||
|
||||
<div className="flex flex-col sm:flex-row gap-4 justify-center items-center pt-4">
|
||||
<Button
|
||||
size="lg"
|
||||
className="gap-2 text-base glow-border bg-primary hover:bg-primary/80 border-2 border-primary"
|
||||
>
|
||||
{"Explore the Framework"}
|
||||
<ArrowRight className="w-4 h-4" />
|
||||
</Button>
|
||||
<Button
|
||||
size="lg"
|
||||
variant="outline"
|
||||
className="text-base border-2 border-secondary text-secondary glow-border hover:bg-secondary/10 bg-transparent"
|
||||
>
|
||||
{"Read the Book"}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,143 @@
|
|||
"use client"
|
||||
|
||||
import { useEffect, useRef } from "react"
|
||||
|
||||
export function NetworkVisualization() {
|
||||
const canvasRef = useRef<HTMLCanvasElement>(null)
|
||||
|
||||
useEffect(() => {
|
||||
const canvas = canvasRef.current
|
||||
if (!canvas) return
|
||||
|
||||
const ctx = canvas.getContext("2d")
|
||||
if (!ctx) return
|
||||
|
||||
// Set canvas size
|
||||
const updateSize = () => {
|
||||
canvas.width = canvas.offsetWidth * window.devicePixelRatio
|
||||
canvas.height = canvas.offsetHeight * window.devicePixelRatio
|
||||
ctx.scale(window.devicePixelRatio, window.devicePixelRatio)
|
||||
}
|
||||
updateSize()
|
||||
window.addEventListener("resize", updateSize)
|
||||
|
||||
const nodes: Array<{
|
||||
x: number
|
||||
y: number
|
||||
vx: number
|
||||
vy: number
|
||||
radius: number
|
||||
hue: number
|
||||
pulsePhase: number
|
||||
}> = []
|
||||
const nodeCount = 40
|
||||
|
||||
for (let i = 0; i < nodeCount; i++) {
|
||||
nodes.push({
|
||||
x: Math.random() * canvas.offsetWidth,
|
||||
y: Math.random() * canvas.offsetHeight,
|
||||
vx: (Math.random() - 0.5) * 0.8,
|
||||
vy: (Math.random() - 0.5) * 0.8,
|
||||
radius: Math.random() * 4 + 2,
|
||||
hue: Math.random() * 60 + 170, // Cyan to magenta range
|
||||
pulsePhase: Math.random() * Math.PI * 2,
|
||||
})
|
||||
}
|
||||
|
||||
let time = 0
|
||||
|
||||
// Animation loop
|
||||
let animationId: number
|
||||
const animate = () => {
|
||||
time += 0.01
|
||||
|
||||
ctx.fillStyle = "rgba(13, 13, 26, 0.1)"
|
||||
ctx.fillRect(0, 0, canvas.offsetWidth, canvas.offsetHeight)
|
||||
|
||||
// Update and draw nodes
|
||||
nodes.forEach((node, i) => {
|
||||
node.x += node.vx
|
||||
node.y += node.vy
|
||||
node.pulsePhase += 0.05
|
||||
|
||||
// Bounce off edges
|
||||
if (node.x < 0 || node.x > canvas.offsetWidth) node.vx *= -1
|
||||
if (node.y < 0 || node.y > canvas.offsetHeight) node.vy *= -1
|
||||
|
||||
nodes.forEach((otherNode, j) => {
|
||||
if (i === j) return
|
||||
const dx = otherNode.x - node.x
|
||||
const dy = otherNode.y - node.y
|
||||
const distance = Math.sqrt(dx * dx + dy * dy)
|
||||
|
||||
if (distance < 180) {
|
||||
const opacity = (1 - distance / 180) * 0.6
|
||||
const gradient = ctx.createLinearGradient(node.x, node.y, otherNode.x, otherNode.y)
|
||||
gradient.addColorStop(0, `hsla(${node.hue}, 100%, 60%, ${opacity})`)
|
||||
gradient.addColorStop(1, `hsla(${otherNode.hue}, 100%, 60%, ${opacity})`)
|
||||
|
||||
ctx.strokeStyle = gradient
|
||||
ctx.lineWidth = 2
|
||||
ctx.shadowBlur = 10
|
||||
ctx.shadowColor = `hsl(${node.hue}, 100%, 60%)`
|
||||
ctx.beginPath()
|
||||
ctx.moveTo(node.x, node.y)
|
||||
ctx.lineTo(otherNode.x, otherNode.y)
|
||||
ctx.stroke()
|
||||
ctx.shadowBlur = 0
|
||||
}
|
||||
})
|
||||
|
||||
const pulse = Math.sin(node.pulsePhase) * 0.5 + 1
|
||||
const glowRadius = node.radius * pulse * 3
|
||||
|
||||
// Outer glow
|
||||
const gradient = ctx.createRadialGradient(node.x, node.y, 0, node.x, node.y, glowRadius)
|
||||
gradient.addColorStop(0, `hsla(${node.hue}, 100%, 60%, 0.8)`)
|
||||
gradient.addColorStop(0.5, `hsla(${node.hue}, 100%, 60%, 0.3)`)
|
||||
gradient.addColorStop(1, `hsla(${node.hue}, 100%, 60%, 0)`)
|
||||
|
||||
ctx.fillStyle = gradient
|
||||
ctx.beginPath()
|
||||
ctx.arc(node.x, node.y, glowRadius, 0, Math.PI * 2)
|
||||
ctx.fill()
|
||||
|
||||
// Core node
|
||||
ctx.fillStyle = `hsl(${node.hue}, 100%, 70%)`
|
||||
ctx.shadowBlur = 15
|
||||
ctx.shadowColor = `hsl(${node.hue}, 100%, 60%)`
|
||||
ctx.beginPath()
|
||||
ctx.arc(node.x, node.y, node.radius * pulse, 0, Math.PI * 2)
|
||||
ctx.fill()
|
||||
ctx.shadowBlur = 0
|
||||
})
|
||||
|
||||
animationId = requestAnimationFrame(animate)
|
||||
}
|
||||
animate()
|
||||
|
||||
return () => {
|
||||
window.removeEventListener("resize", updateSize)
|
||||
cancelAnimationFrame(animationId)
|
||||
}
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<section className="py-24 px-4 relative overflow-hidden scan-lines">
|
||||
<div className="absolute inset-0 cyber-grid opacity-10" />
|
||||
|
||||
<canvas ref={canvasRef} className="absolute inset-0 w-full h-full" />
|
||||
|
||||
<div className="relative max-w-4xl mx-auto text-center space-y-6 z-10">
|
||||
<h2 className="text-3xl md:text-5xl font-bold text-balance glow-text text-primary">
|
||||
{"Mycelial Intelligence"}
|
||||
</h2>
|
||||
<p className="text-lg md:text-xl text-accent leading-relaxed glow-text">
|
||||
{
|
||||
"Like mycelial networks that connect forest ecosystems, MycoFi creates living infrastructure for communities to share resources, make decisions, and evolve together. Each node strengthens the whole, enabling emergence of collective intelligence."
|
||||
}
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,97 @@
|
|||
import { Card } from "@/components/ui/card"
|
||||
import { GitBranch, Layers, Zap, RefreshCw, Share2, Target } from "lucide-react"
|
||||
|
||||
const principles = [
|
||||
{
|
||||
icon: GitBranch,
|
||||
title: "Distributed Architecture",
|
||||
description: "No single point of failure—resilience through decentralization",
|
||||
},
|
||||
{
|
||||
icon: Layers,
|
||||
title: "Emergent Complexity",
|
||||
description: "Simple rules create sophisticated collective behaviors",
|
||||
},
|
||||
{
|
||||
icon: Zap,
|
||||
title: "Real-Time Adaptation",
|
||||
description: "Continuous feedback loops enable rapid organizational learning",
|
||||
},
|
||||
{
|
||||
icon: RefreshCw,
|
||||
title: "Regenerative Systems",
|
||||
description: "Self-healing networks that grow stronger through use",
|
||||
},
|
||||
{
|
||||
icon: Share2,
|
||||
title: "Resource Sharing",
|
||||
description: "Efficient allocation through transparent, collaborative protocols",
|
||||
},
|
||||
{
|
||||
icon: Target,
|
||||
title: "Intentional Design",
|
||||
description: "Purpose-driven architecture aligned with community values",
|
||||
},
|
||||
]
|
||||
|
||||
export function Principles() {
|
||||
return (
|
||||
<section className="py-24 px-4 relative overflow-hidden">
|
||||
<div className="absolute inset-0 overflow-hidden">
|
||||
<div className="absolute top-0 left-1/4 w-64 h-64 bg-primary/10 rounded-full blur-3xl animate-pulse" />
|
||||
<div
|
||||
className="absolute bottom-0 right-1/4 w-64 h-64 bg-secondary/10 rounded-full blur-3xl animate-pulse"
|
||||
style={{ animationDelay: "1.5s" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="max-w-7xl mx-auto relative z-10">
|
||||
<div className="text-center mb-16">
|
||||
<h2 className="text-3xl md:text-5xl font-bold mb-4 text-balance glow-text text-accent">
|
||||
{"Myco-Principic Design"}
|
||||
</h2>
|
||||
<p className="text-lg text-secondary max-w-2xl mx-auto text-pretty glow-text">
|
||||
{"Six foundational principles inspired by mycelial networks and applied to institutional design"}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="grid sm:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||
{principles.map((principle, index) => {
|
||||
const Icon = principle.icon
|
||||
const hue = 180 + index * 30 // Cycle through cyan to magenta
|
||||
return (
|
||||
<Card
|
||||
key={index}
|
||||
className="p-6 hover:shadow-lg transition-all border-2 glow-border bg-card/80 backdrop-blur-sm hover:scale-105"
|
||||
style={{
|
||||
borderColor: `hsl(${hue}, 100%, 50%)`,
|
||||
boxShadow: `0 0 20px hsla(${hue}, 100%, 50%, 0.3)`,
|
||||
}}
|
||||
>
|
||||
<div className="space-y-3">
|
||||
<div
|
||||
className="w-12 h-12 rounded-lg flex items-center justify-center border-2"
|
||||
style={{
|
||||
borderColor: `hsl(${hue}, 100%, 60%)`,
|
||||
color: `hsl(${hue}, 100%, 60%)`,
|
||||
boxShadow: `0 0 15px hsla(${hue}, 100%, 60%, 0.5)`,
|
||||
}}
|
||||
>
|
||||
<Icon
|
||||
className="w-6 h-6"
|
||||
style={{ animation: "glow-pulse 2.5s ease-in-out infinite", animationDelay: `${index * 0.2}s` }}
|
||||
/>
|
||||
</div>
|
||||
<h3 className="text-lg font-semibold glow-text" style={{ color: `hsl(${hue}, 100%, 70%)` }}>
|
||||
{principle.title}
|
||||
</h3>
|
||||
<p className="text-muted-foreground text-sm leading-relaxed">{principle.description}</p>
|
||||
</div>
|
||||
</Card>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
|
@ -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,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,6 @@
|
|||
import { clsx, type ClassValue } from 'clsx'
|
||||
import { twMerge } from 'tailwind-merge'
|
||||
|
||||
export function cn(...inputs: ClassValue[]) {
|
||||
return twMerge(clsx(inputs))
|
||||
}
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
/** @type {import('next').NextConfig} */
|
||||
const nextConfig = {
|
||||
eslint: {
|
||||
ignoreDuringBuilds: true,
|
||||
},
|
||||
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.0",
|
||||
"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": "^0.9.9",
|
||||
"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"
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,8 @@
|
|||
/** @type {import('postcss-load-config').Config} */
|
||||
const config = {
|
||||
plugins: {
|
||||
'@tailwindcss/postcss': {},
|
||||
},
|
||||
}
|
||||
|
||||
export default config
|
||||
Binary file not shown.
|
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 |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
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 |
|
|
@ -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"]
|
||||
}
|
||||
Loading…
Reference in New Issue