update

2026-06-03 20:13:03 +00:00 · 2026-02-24 10:33:59 +01:00
parent 409acd2e08
commit 898a3c303f
1374 changed files with 290409 additions and 29187 deletions
@@ -20,6 +20,7 @@
        "lucide-react": "^0.575.0",
        "react": "^19.2.0",
        "react-dom": "^19.2.0",
+        "react-router-dom": "^7.13.0",
        "tailwind-merge": "^3.5.0",
        "tailwindcss-animate": "^1.0.7"
      },
@@ -3183,6 +3184,18 @@
      "dev": true,
      "license": "MIT"
    },
+    "node_modules/cookie": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-1.1.1.tgz",
+      "integrity": "sha512-ei8Aos7ja0weRpFzJnEA9UHJ/7XQmqglbRwnf2ATjcB9Wq874VKH9kfjjirM6UhU2/E5fFYadylyhFldcqSidQ==",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
    "node_modules/cross-spawn": {
      "version": "7.0.6",
      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
@@ -4527,6 +4540,42 @@
        }
      }
    },
+    "node_modules/react-router": {
+      "version": "7.13.0",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.13.0.tgz",
+      "integrity": "sha512-PZgus8ETambRT17BUm/LL8lX3Of+oiLaPuVTRH3l1eLvSPpKO3AvhAEb5N7ihAFZQrYDqkvvWfFh9p0z9VsjLw==",
+      "dependencies": {
+        "cookie": "^1.0.1",
+        "set-cookie-parser": "^2.6.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=18",
+        "react-dom": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "react-dom": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/react-router-dom": {
+      "version": "7.13.0",
+      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.13.0.tgz",
+      "integrity": "sha512-5CO/l5Yahi2SKC6rGZ+HDEjpjkGaG/ncEP7eWFTvFxbHP8yeeI0PxTDjimtpXYlR3b3i9/WIL4VJttPrESIf2g==",
+      "dependencies": {
+        "react-router": "7.13.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=18",
+        "react-dom": ">=18"
+      }
+    },
    "node_modules/react-style-singleton": {
      "version": "2.2.3",
      "resolved": "https://registry.npmjs.org/react-style-singleton/-/react-style-singleton-2.2.3.tgz",
@@ -4620,6 +4669,11 @@
        "semver": "bin/semver.js"
      }
    },
+    "node_modules/set-cookie-parser": {
+      "version": "2.7.2",
+      "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.2.tgz",
+      "integrity": "sha512-oeM1lpU/UvhTxw+g3cIfxXHyJRc/uidd3yK1P242gzHds0udQBYzs3y8j4gCCW+ZJ7ad0yctld8RYO+bdurlvw=="
+    },
    "node_modules/shebang-command": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
@@ -22,6 +22,7 @@
    "lucide-react": "^0.575.0",
    "react": "^19.2.0",
    "react-dom": "^19.2.0",
+    "react-router-dom": "^7.13.0",
    "tailwind-merge": "^3.5.0",
    "tailwindcss-animate": "^1.0.7"
  },
@@ -1,35 +1,22 @@
 import { ThemeProvider } from "@/contexts/ThemeContext"
 import { ParticleBackground } from "@/components/ui/magicui"
-import { Hero } from "@/components/sections/Hero"
-import { Features } from "@/components/sections/Features"
-import { CodeShowcase } from "@/components/sections/CodeShowcase"
-import { Architecture } from "@/components/sections/Architecture"
-import { Languages } from "@/components/sections/Languages"
-import { QuickStart } from "@/components/sections/QuickStart"
-import { Footer } from "@/components/sections/Footer"
+import { Navigate, Route, Routes } from "react-router-dom"
+import { HomePage } from "@/pages/HomePage"
+import { DocumentationPage } from "@/pages/DocumentationPage"

 function App() {
  return (
    <ThemeProvider defaultTheme="dark" storageKey="devour-ui-theme">
      <div className="relative min-h-screen bg-background text-foreground overflow-x-hidden">
-        {/* Particle Background */}
        <ParticleBackground />
-        
-        {/* Main Content */}
-        <main className="relative z-10">
-          <Hero />
-          <Features />
-          <CodeShowcase />
-          <Architecture />
-          <Languages />
-          <QuickStart />
-        </main>
-        
-        {/* Footer */}
-        <Footer />
+        <Routes>
+          <Route path="/" element={<HomePage />} />
+          <Route path="/documentation" element={<DocumentationPage />} />
+          <Route path="*" element={<Navigate to="/" replace />} />
+        </Routes>
      </div>
    </ThemeProvider>
  )
 }

-export default App
+export default App
@@ -0,0 +1,66 @@
+import { Link, useLocation } from "react-router-dom"
+import { ThemeToggle } from "@/components/ui/theme-toggle"
+import { cn } from "@/lib/utils"
+
+const homeLinks = [
+  { label: "Features", href: "#features" },
+  { label: "Languages", href: "#languages" },
+  { label: "Quick Start", href: "#quickstart" },
+]
+
+export function TopNav() {
+  const location = useLocation()
+  const isDocsPage = location.pathname === "/documentation"
+  const homePrefix = location.pathname === "/" ? "" : "/"
+
+  return (
+    <div className="absolute top-0 left-0 right-0 z-20">
+      <div className="container px-4 md:px-6 pt-4 sm:pt-6">
+        <div className="flex items-center justify-between gap-3 rounded-xl border border-white/10 bg-black/30 backdrop-blur-md px-3 py-2.5 sm:px-4">
+          <Link to="/" className="flex items-center gap-2 shrink-0">
+            <img src="/devour_logo.svg" alt="Devour Logo" className="w-8 h-8" />
+            <span className="text-sm sm:text-base font-semibold">Devour</span>
+          </Link>
+
+          <nav className="hidden md:flex items-center gap-5 text-sm">
+            {homeLinks.map((link) => (
+              <a
+                key={link.label}
+                href={`${homePrefix}${link.href}`}
+                className="text-muted-foreground hover:text-foreground transition-colors"
+              >
+                {link.label}
+              </a>
+            ))}
+            <Link
+              to="/documentation"
+              className={cn(
+                "transition-colors",
+                isDocsPage
+                  ? "text-cyan-400"
+                  : "text-muted-foreground hover:text-foreground"
+              )}
+            >
+              Documentation
+            </Link>
+          </nav>
+
+          <div className="flex items-center gap-2">
+            <Link
+              to="/documentation"
+              className={cn(
+                "md:hidden text-xs font-medium px-2.5 py-1.5 rounded-md border transition-colors",
+                isDocsPage
+                  ? "border-cyan-500/40 text-cyan-400 bg-cyan-500/10"
+                  : "border-white/15 text-muted-foreground hover:text-foreground hover:bg-white/10"
+              )}
+            >
+              Docs
+            </Link>
+            <ThemeToggle />
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}
@@ -0,0 +1,69 @@
+import { motion } from "framer-motion"
+import { ArrowRight, ExternalLink } from "lucide-react"
+import { Link } from "react-router-dom"
+import { Button } from "@/components/ui/button"
+import { FadeIn, GradientText } from "@/components/ui/magicui"
+import { documentationResources } from "@/data/documentationResources"
+
+export function DocumentationPreview() {
+  return (
+    <section id="documentation" className="relative py-24 md:py-32 overflow-hidden">
+      <div className="absolute inset-0 bg-gradient-to-b from-background via-cyan-950/5 to-background" />
+      <div className="absolute inset-0 grid-background opacity-30" />
+
+      <div className="container relative z-10 px-4 md:px-6">
+        <div className="text-center mb-12 md:mb-16">
+          <FadeIn>
+            <h2 className="text-3xl md:text-5xl font-bold mb-4">
+              Documentation <GradientText>Stack</GradientText>
+            </h2>
+          </FadeIn>
+          <FadeIn delay={0.1}>
+            <p className="text-lg text-muted-foreground max-w-3xl mx-auto">
+              We use these tools to build fast, clean documentation experiences.
+            </p>
+          </FadeIn>
+        </div>
+
+        <div className="grid grid-cols-1 md:grid-cols-3 gap-4 md:gap-6 max-w-6xl mx-auto">
+          {documentationResources.map((resource, index) => (
+            <FadeIn key={resource.name} delay={0.15 + index * 0.1}>
+              <motion.article
+                whileHover={{ y: -4, scale: 1.01 }}
+                transition={{ duration: 0.2 }}
+                className="h-full p-6 rounded-xl border border-white/10 bg-white/5 backdrop-blur-sm hover:border-cyan-500/30 hover:bg-white/[0.07] transition-all duration-300"
+              >
+                <h3 className="text-lg font-semibold mb-3 text-cyan-400">
+                  {resource.name}
+                </h3>
+                <p className="text-sm text-muted-foreground leading-relaxed mb-5">
+                  {resource.description}
+                </p>
+                <a
+                  href={resource.url}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="inline-flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground transition-colors"
+                >
+                  Visit resource
+                  <ExternalLink className="w-3.5 h-3.5" />
+                </a>
+              </motion.article>
+            </FadeIn>
+          ))}
+        </div>
+
+        <FadeIn delay={0.55}>
+          <div className="mt-10 md:mt-12 text-center">
+            <Button size="xl" variant="glow" asChild className="group">
+              <Link to="/documentation">
+                Open Documentation Page
+                <ArrowRight className="ml-2 h-4 w-4 transition-transform group-hover:translate-x-1" />
+              </Link>
+            </Button>
+          </div>
+        </FadeIn>
+      </div>
+    </section>
+  )
+}
@@ -9,7 +9,7 @@ const links = {
    { label: "Architecture", href: "#architecture" },
  ],
  resources: [
-    { label: "Documentation", href: "#" },
+    { label: "Documentation", href: "/documentation" },
    { label: "API Reference", href: "#" },
    { label: "Examples", href: "#" },
    { label: "Changelog", href: "#" },
@@ -147,4 +147,4 @@ export function Footer() {
      <div className="absolute bottom-0 left-0 right-0 h-px bg-gradient-to-r from-transparent via-cyan-500/50 to-transparent" />
    </footer>
  )
-}
+}
@@ -2,8 +2,8 @@ import { motion } from "framer-motion"
 import { Github, Terminal, Sparkles, ArrowRight } from "lucide-react"
 import { Button } from "@/components/ui/button"
 import { Badge } from "@/components/ui/badge"
-import { ThemeToggle } from "@/components/ui/theme-toggle"
 import { GradientText, FadeIn } from "@/components/ui/magicui"
+import { TopNav } from "@/components/layout/TopNav"

 export function Hero() {
  return (
@@ -13,10 +13,7 @@ export function Hero() {
      <div className="absolute bottom-1/4 right-1/4 w-96 h-96 bg-teal-500/20 rounded-full blur-3xl animate-pulse delay-1000" />
      <div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[600px] h-[600px] bg-cyan-500/10 rounded-full blur-3xl" />

-      <div className="absolute top-0 left-0 right-0 z-20 flex justify-between items-center p-6">
-        <div></div>
-        <ThemeToggle />
-      </div>
+      <TopNav />

      <div className="container relative z-10 px-4 md:px-6">
        <div className="flex flex-col items-center text-center space-y-8">
@@ -162,4 +159,4 @@ export function Hero() {
      </motion.div>
    </section>
  )
-}
+}
@@ -0,0 +1,24 @@
+export type DocumentationResource = {
+  name: string
+  description: string
+  url: string
+}
+
+export const documentationResources: DocumentationResource[] = [
+  {
+    name: "Astro",
+    description: "A great static site generator.",
+    url: "https://astro.build/",
+  },
+  {
+    name: "Starlight",
+    description:
+      "A module for Astro that provides a starting point for building documentation websites.",
+    url: "https://starlight.astro.build/",
+  },
+  {
+    name: "HiDeoo/starlight-theme-rapide",
+    description: "A theme for Starlight.",
+    url: "https://github.com/HiDeoo/starlight-theme-rapide",
+  },
+]
@@ -1,10 +1,13 @@
 import React from 'react'
 import ReactDOM from 'react-dom/client'
+import { BrowserRouter } from "react-router-dom"
 import App from './App.tsx'
 import './index.css'

 ReactDOM.createRoot(document.getElementById('root')!).render(
  <React.StrictMode>
-    <App />
+    <BrowserRouter>
+      <App />
+    </BrowserRouter>
  </React.StrictMode>,
-)
+)
@@ -0,0 +1,87 @@
+import { motion } from "framer-motion"
+import { ArrowLeft, ExternalLink } from "lucide-react"
+import { Link } from "react-router-dom"
+import { TopNav } from "@/components/layout/TopNav"
+import { Footer } from "@/components/sections/Footer"
+import { Badge } from "@/components/ui/badge"
+import { Button } from "@/components/ui/button"
+import { FadeIn, GradientText } from "@/components/ui/magicui"
+import { documentationResources } from "@/data/documentationResources"
+
+export function DocumentationPage() {
+  return (
+    <div className="relative z-10">
+      <section className="relative min-h-screen py-24 md:py-32 overflow-hidden">
+        <div className="absolute inset-0 bg-gradient-to-b from-background via-cyan-950/10 to-background" />
+        <div className="absolute inset-0 grid-background opacity-30" />
+        <TopNav />
+
+        <div className="container relative z-10 px-4 md:px-6 pt-20 md:pt-24">
+          <div className="max-w-3xl mx-auto text-center mb-12 md:mb-16">
+            <FadeIn>
+              <Badge variant="glow" className="mb-4">
+                Documentation
+              </Badge>
+            </FadeIn>
+            <FadeIn delay={0.1}>
+              <h1 className="text-3xl md:text-5xl font-bold mb-4">
+                Devour Documentation <GradientText>Toolkit</GradientText>
+              </h1>
+            </FadeIn>
+            <FadeIn delay={0.2}>
+              <p className="text-lg text-muted-foreground">
+                Three resources that power a modern docs stack for Devour.
+              </p>
+            </FadeIn>
+          </div>
+
+          <div className="grid grid-cols-1 md:grid-cols-3 gap-4 md:gap-6 max-w-6xl mx-auto">
+            {documentationResources.map((resource, index) => (
+              <FadeIn key={resource.name} delay={0.1 + index * 0.1}>
+                <motion.article
+                  whileHover={{ y: -6, scale: 1.01 }}
+                  transition={{ duration: 0.2 }}
+                  className="h-full p-6 md:p-7 rounded-xl border border-white/10 bg-white/5 backdrop-blur-sm hover:border-cyan-500/30 hover:bg-white/[0.07] transition-all duration-300 flex flex-col"
+                >
+                  <p className="text-xs uppercase tracking-wide text-cyan-400/80 mb-3">
+                    Resource {index + 1}
+                  </p>
+                  <h2 className="text-xl font-semibold mb-3 text-cyan-400">
+                    {resource.name}
+                  </h2>
+                  <p className="text-sm text-muted-foreground leading-relaxed mb-6 flex-1">
+                    {resource.description}
+                  </p>
+
+                  <Button asChild variant="outline" className="w-fit">
+                    <a
+                      href={resource.url}
+                      target="_blank"
+                      rel="noopener noreferrer"
+                    >
+                      Open
+                      <ExternalLink className="ml-2 h-4 w-4" />
+                    </a>
+                  </Button>
+                </motion.article>
+              </FadeIn>
+            ))}
+          </div>
+
+          <FadeIn delay={0.5}>
+            <div className="mt-12 text-center">
+              <Button size="lg" variant="glow" asChild>
+                <Link to="/">
+                  <ArrowLeft className="mr-2 h-4 w-4" />
+                  Back to Home
+                </Link>
+              </Button>
+            </div>
+          </FadeIn>
+        </div>
+      </section>
+
+      <Footer />
+    </div>
+  )
+}
@@ -0,0 +1,25 @@
+import { Hero } from "@/components/sections/Hero"
+import { Features } from "@/components/sections/Features"
+import { CodeShowcase } from "@/components/sections/CodeShowcase"
+import { Architecture } from "@/components/sections/Architecture"
+import { Languages } from "@/components/sections/Languages"
+import { DocumentationPreview } from "@/components/sections/DocumentationPreview"
+import { QuickStart } from "@/components/sections/QuickStart"
+import { Footer } from "@/components/sections/Footer"
+
+export function HomePage() {
+  return (
+    <div className="relative z-10">
+      <main>
+        <Hero />
+        <Features />
+        <CodeShowcase />
+        <Architecture />
+        <Languages />
+        <DocumentationPreview />
+        <QuickStart />
+      </main>
+      <Footer />
+    </div>
+  )
+}
@@ -1 +1 @@
-{"root":["./src/App.tsx","./src/main.tsx","./src/components/sections/Architecture.tsx","./src/components/sections/CodeShowcase.tsx","./src/components/sections/Features.tsx","./src/components/sections/Footer.tsx","./src/components/sections/Hero.tsx","./src/components/sections/Languages.tsx","./src/components/sections/QuickStart.tsx","./src/components/ui/badge.tsx","./src/components/ui/button.tsx","./src/components/ui/card.tsx","./src/components/ui/magicui.tsx","./src/lib/utils.ts"],"version":"5.9.3"}
+{"root":["./src/App.tsx","./src/main.tsx","./src/components/layout/TopNav.tsx","./src/components/sections/Architecture.tsx","./src/components/sections/CodeShowcase.tsx","./src/components/sections/DocumentationPreview.tsx","./src/components/sections/Features.tsx","./src/components/sections/Footer.tsx","./src/components/sections/Hero.tsx","./src/components/sections/Languages.tsx","./src/components/sections/QuickStart.tsx","./src/components/ui/badge.tsx","./src/components/ui/button.tsx","./src/components/ui/card.tsx","./src/components/ui/dropdown-menu.tsx","./src/components/ui/magicui.tsx","./src/components/ui/theme-toggle.tsx","./src/contexts/ThemeContext.tsx","./src/data/documentationResources.ts","./src/lib/utils.ts","./src/pages/DocumentationPage.tsx","./src/pages/HomePage.tsx"],"version":"5.9.3"}