3 lines
5.9 KiB
JavaScript
3 lines
5.9 KiB
JavaScript
|
|
import{j as e}from"./chunk-m7Vgm5hx.js";import{B as s,C as a,I as l,P as t}from"./index-vht7ZNSp.js";import"./chunk-Dj70Y9U3.js";import"./chunk-CbPYJovs.js";import"./chunk-VMUEamc6.js";import"./chunk-DZ12PeIs.js";import"./chunk-pW9FG0iV.js";import"./chunk-B4NZlYwU.js";import"./chunk-CSrBv2n5.js";function g(){return e.jsx("div",{className:"min-h-screen bg-kodo-void text-kodo-primary p-8",children:e.jsxs("div",{className:"max-w-6xl mx-auto space-y-12",children:[e.jsxs("header",{className:"text-center space-y-4",children:[e.jsx("h1",{className:"text-5xl font-display font-bold text-white",children:"Kōdō Design System"}),e.jsx("p",{className:"text-xl text-kodo-secondary",children:"Spectre Astral • Premium Components"})]}),e.jsxs("section",{className:"space-y-6",children:[e.jsx("h2",{className:"text-3xl font-heading font-bold text-white border-b border-kodo-steel pb-2",children:"Buttons"}),e.jsxs("div",{className:"grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4",children:[e.jsx(s,{variant:"primary",children:"Primary"}),e.jsx(s,{variant:"secondary",children:"Secondary"}),e.jsx(s,{variant:"ghost",children:"Ghost"}),e.jsx(s,{variant:"gaming",children:"Premium"}),e.jsx(s,{variant:"terminal",children:"Terminal"}),e.jsx(s,{variant:"nature",children:"Success"}),e.jsx(s,{variant:"primary",size:"sm",children:"Small"}),e.jsx(s,{variant:"primary",size:"lg",children:"Large"})]})]}),e.jsxs("section",{className:"space-y-6",children:[e.jsx("h2",{className:"text-3xl font-heading font-bold text-white border-b border-kodo-steel pb-2",children:"Cards"}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6",children:[e.jsxs(a,{variant:"default",children:[e.jsx("h3",{className:"text-lg font-bold text-white mb-2",children:"Default Card"}),e.jsx("p",{className:"text-kodo-secondary text-sm",children:"Standard card with subtle borders"})]}),e.jsxs(a,{variant:"manga",children:[e.jsx("h3",{className:"text-lg font-bold text-white mb-2",children:"Creative Card"}),e.jsx("p",{className:"text-kodo-secondary text-sm",children:"Gradient background with magenta accent"})]}),e.jsxs(a,{variant:"gaming",children:[e.jsx("h3",{className:"text-lg font-bold text-white mb-2",children:"Tech Card"}),e.jsx("p",{className:"text-kodo-secondary text-sm",children:"Cyan accent for technical content"})]}),e.jsxs(a,{variant:"glass",children:[e.jsx("h3",{className:"text-lg font-bold text-white mb-2",children:"Glass Card"}),e.jsx("p",{className:"text-kodo-secondary text-sm",children:"Glassmorphism with backdrop blur"})]})]})]}),e.jsxs("section",{className:"space-y-6",children:[e.jsx("h2",{className:"text-3xl font-heading font-bold text-white border-b border-kodo-steel pb-2",children:"Inputs"}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-6",children:[e.jsx(l,{label:"Username",placeholder:"Enter your username"}),e.jsx(l,{label:"Email",type:"email",placeholder:"your@email.com"})]})]}),e.jsxs("section",{className:"space-y-6",children:[e.jsx("h2",{className:"text-3xl font-heading font-bold text-white border-b border-kodo-steel pb-2",children:"Progress Bars"}),e.jsxs("div",{className:"space-y-4",children:[e.jsx(t,{value:75,color:"cyan",labelLeft:"Cyan",labelRight:"75%"}),e.jsx(t,{value:60,color:"magenta",labelLeft:"Magenta",labelRight:"60%"}),e.jsx(t,{value:90,color:"lime",labelLeft:"Lime",labelRight:"90%"}),e.jsx(t,{value:45,color:"gold",variant:"gaming",labelLeft:"XP Progress",labelRight:"Level 42"})]})]}),e.jsxs("section",{className:"space-y-6",children:[e.jsx("h2",{className:"text-3xl font-heading font-bold text-white border-b border-kodo-steel pb-2",children:"Color Palette"}),e.jsxs("div",{className:"grid grid-cols-2 md:grid-cols-4 lg:grid-cols-6 gap-4",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx("div",{className:"h-20 bg-kodo-void rounded-lg border border-kodo-steel"}),e.jsx("p",{className:"text-xs text-center",children:"Void"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("div",{className:"h-20 bg-kodo-ink rounded-lg border border-kodo-steel"}),e.jsx("p",{className:"text-xs text-center",children:"Ink"
|
||
|
|
//# sourceMappingURL=DesignSystemDemoPage-DNdtVNU8.js.map
|