-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathchunk-BagNP7Vu.js
More file actions
1 lines (1 loc) · 15.2 KB
/
Copy pathchunk-BagNP7Vu.js
File metadata and controls
1 lines (1 loc) · 15.2 KB
1
import{N as h,C as f,bA as g,r as i,j as e,bq as l,m as c,b,bY as u,c1 as j,a6 as r,U as N,a as y,b_ as A,c2 as v,a2 as k}from"../entries/pages.BZkyDMuN.js";import{o as w}from"./chunk-yzuX92yf.js";import{S as D}from"./chunk-D8YfSULr.js";import{C as S}from"./chunk-Cb7tTquJ.js";import"./chunk-BXl3LOEh.js";/* empty css */import"./chunk-CTVhs4zQ.js";import"./chunk-BassnvpC.js";import"./chunk-DPK_ul2B.js";const L=()=>{const{addToast:a}=h(),{openSidePanel:n}=f(),o=g(),[d,t]=i.useState(!1),[x,p]=i.useState("option_01"),m=()=>{n("LUXE_PROTOCOL_SIGMA",e.jsxs("div",{className:"space-y-8",children:[e.jsxs("div",{className:"p-6 border-l-2 border-[#8D4004]/20 bg-[#8D4004]/5",children:[e.jsx("h4",{className:"font-playfairDisplay text-xl italic text-[#1A1A1A] m-0",children:"Refined_Data_Stream"}),e.jsx("p",{className:"font-outfit text-[10px] text-[#1A1A1A]/40 uppercase tracking-widest mt-2",children:"Synchronized with secondary vault."})]}),e.jsx("p",{className:"font-outfit text-sm text-[#1A1A1A]/70 leading-relaxed italic",children:"The SidePanel in Luxe configuration emphasizes white space and typographic hierarchy, providing a sophisticated layer for deep-dive information."}),e.jsxs("div",{className:"flex flex-col gap-2",children:[e.jsx("div",{className:"h-px bg-black/5 w-full"}),e.jsx("div",{className:"h-px bg-black/5 w-3/4"}),e.jsx("div",{className:"h-px bg-[#8D4004]/20 w-1/2"})]})]}),600)};return e.jsxs("div",{className:"min-h-screen bg-[#F5F5F0] text-[#1A1A1A] font-sans selection:bg-[#C0B298] selection:text-black pt-24 pb-32 overflow-x-hidden",children:[e.jsx(D,{title:"Fezluxe | Design Language Spec",description:"System documentation for the Fezluxe design language. A study in digital sophistication and architectural elegance.",keywords:["Fezluxe","design system","luxe","ui","fezcodex"]}),e.jsx("div",{className:"fixed inset-0 opacity-[0.02] pointer-events-none z-0",children:e.jsx(l,{seed:"Design System",className:"w-full h-full mix-blend-multiply"})}),e.jsxs("div",{className:"max-w-[1400px] mx-auto px-6 md:px-12 relative z-10",children:[e.jsxs("header",{className:"mb-32 pt-12 border-b border-black/10 pb-20 text-center",children:[e.jsxs(c.div,{initial:{opacity:0,y:20},animate:{opacity:1,y:0},className:"inline-flex items-center gap-3 px-4 py-2 border border-black/10 rounded-full bg-white/40 mb-8 cursor-pointer hover:bg-white transition-colors",onClick:()=>o("/design"),children:[e.jsx(b,{size:16,className:"text-[#8D4004]"}),e.jsx("span",{className:"font-outfit text-[10px] uppercase tracking-[0.3em] text-black/60",children:"Back to Selection"})]}),e.jsxs(c.h1,{initial:{opacity:0},animate:{opacity:1},transition:{delay:.2,duration:1},className:"font-playfairDisplay text-7xl md:text-9xl lg:text-[10rem] text-[#1A1A1A] leading-[0.8] mb-12 tracking-tighter",children:["FEZ",e.jsx("br",{}),e.jsx("span",{className:"italic text-black/40",children:"LUXE"})]}),e.jsxs("div",{className:"flex justify-center gap-12 text-[10px] font-outfit uppercase tracking-[0.4em] text-black/30",children:[e.jsxs("span",{className:"flex items-center gap-2",children:[e.jsx(w,{size:14})," Sophistication"]}),e.jsxs("span",{className:"flex items-center gap-2",children:[e.jsx(u,{size:14})," Precision"]}),e.jsxs("span",{className:"flex items-center gap-2",children:[e.jsx(j,{size:14})," Clarity"]})]})]}),e.jsxs("div",{className:"grid grid-cols-1 lg:grid-cols-12 gap-16 md:gap-32",children:[e.jsxs("div",{className:"lg:col-span-7 space-y-32",children:[e.jsxs("section",{className:"space-y-12",children:[e.jsxs("div",{className:"flex items-center gap-6",children:[e.jsx("span",{className:"font-playfairDisplay text-6xl text-[#1A1A1A]/10 italic",children:"01"}),e.jsx("h2",{className:"text-4xl font-playfairDisplay italic text-[#1A1A1A]",children:"Core Philosophy"}),e.jsx("div",{className:"flex-1 h-px bg-black/5"})]}),e.jsxs("div",{className:"prose prose-stone prose-lg max-w-none",children:[e.jsx("p",{className:"text-2xl text-[#1A1A1A]/80 font-light leading-relaxed italic",children:'Fezluxe is the evolution of the digital sanctuary. It transcends the "raw" to find the "refined"—where structure becomes architectural and feedback becomes intuitive.'}),e.jsxs("div",{className:"mt-20 space-y-20",children:[e.jsxs("div",{className:"space-y-6",children:[e.jsx("h4",{className:"font-playfairDisplay text-3xl text-[#1A1A1A]",children:"Refined Architecture"}),e.jsx("p",{className:"font-outfit text-sm text-[#1A1A1A]/60 leading-relaxed",children:"Structure is defined by generous white space and soft depth. We avoid the rigid 1PX grid in favor of subtle borders (#1A1A1A/5) and sophisticated backdrops. Every element breathes, creating a sense of calm and intentionality."})]}),e.jsxs("div",{className:"space-y-6",children:[e.jsx("h4",{className:"font-playfairDisplay text-3xl text-[#1A1A1A]",children:"Chromatic Sophistication"}),e.jsxs("p",{className:"font-outfit text-sm text-[#1A1A1A]/60 leading-relaxed",children:["The palette centers on a soft Parchment (",e.jsx("span",{className:"text-[#8D4004] font-mono",children:"#F5F5F0"}),") and a deep Obsidian (",e.jsx("span",{className:"text-[#8D4004] font-mono",children:"#1A1A1A"}),"). Our accent, Burnished Amber (",e.jsx("span",{className:"text-[#8D4004] font-mono",children:"#8D4004"}),"), is used sparingly to draw focus without overwhelming the senses."]})]}),e.jsxs("div",{className:"space-y-6",children:[e.jsx("h4",{className:"font-playfairDisplay text-3xl text-[#1A1A1A]",children:"Implicit Intelligence"}),e.jsxs("p",{className:"font-outfit text-sm text-[#1A1A1A]/60 leading-relaxed",children:['Fezluxe hides the "noise" but celebrates the "data". Version IDs and timestamps are transformed into elegant metadata tags. We use'," ",e.jsx("span",{className:"italic text-[#8D4004]",children:"Sentence Case"})," ","and refined icons to treat information as a curated exhibit."]})]})]})]})]}),e.jsxs("section",{className:"space-y-12",children:[e.jsxs("div",{className:"flex items-center gap-6",children:[e.jsx("span",{className:"font-playfairDisplay text-6xl text-[#1A1A1A]/10 italic",children:"02"}),e.jsx("h2",{className:"text-4xl font-playfairDisplay italic text-[#1A1A1A]",children:"Interactive Triggers"}),e.jsx("div",{className:"flex-1 h-px bg-black/5"})]}),e.jsxs("div",{className:"bg-white/40 backdrop-blur-md border border-black/5 p-12 rounded-sm space-y-16",children:[e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-8",children:[e.jsx("button",{className:"w-full py-4 bg-[#1A1A1A] text-white font-outfit text-xs uppercase tracking-[0.3em] hover:bg-[#8D4004] transition-all rounded-full shadow-lg",children:"Primary Action"}),e.jsx("button",{className:"w-full py-4 border border-black/10 text-black/60 hover:text-black hover:bg-white transition-all font-outfit text-xs uppercase tracking-widest rounded-full",children:"Secondary Node"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-12",children:[e.jsxs("div",{className:"space-y-4",children:[e.jsx("label",{className:"font-outfit text-[10px] uppercase tracking-widest text-black/30",children:"Selection Interface"}),e.jsx(S,{fullWidth:!0,options:[{label:"REFINED_OBSERVATION",value:"option_01"},{label:"SILK_PROTOCOL",value:"option_02"},{label:"AMBER_SYNTHESIS",value:"option_03"}],value:x,onChange:p,variant:"paper"})]}),e.jsxs("div",{className:"flex flex-col justify-end gap-6 pb-2",children:[e.jsxs("div",{className:"flex items-center gap-4",children:[e.jsx("span",{className:"w-3 h-3 rounded-full bg-emerald-500 shadow-[0_0_10px_rgba(16,185,129,0.3)]"}),e.jsx("span",{className:"font-outfit text-[10px] uppercase tracking-widest text-black/60",children:"Active Status"})]}),e.jsxs("div",{className:"flex items-center gap-4",children:[e.jsx("span",{className:"w-3 h-3 rounded-full bg-black/5"}),e.jsx("span",{className:"font-outfit text-[10px] uppercase tracking-widest text-black/30",children:"Standby Mode"})]})]})]})]})]})]}),e.jsxs("div",{className:"lg:col-span-5 space-y-32",children:[e.jsxs("section",{className:"space-y-12",children:[e.jsxs("div",{className:"flex items-center gap-6",children:[e.jsx("span",{className:"font-playfairDisplay text-6xl text-[#1A1A1A]/10 italic",children:"03"}),e.jsx("h2",{className:"text-4xl font-playfairDisplay italic text-[#1A1A1A]",children:"Typography"}),e.jsx("div",{className:"flex-1 h-px bg-black/5"})]}),e.jsxs("div",{className:"bg-white p-12 space-y-12 shadow-sm border border-black/5",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx("span",{className:"font-outfit text-[10px] text-[#8D4004] uppercase tracking-[0.3em]",children:"Serif Display"}),e.jsx("h1",{className:"font-playfairDisplay text-6xl italic leading-none",children:"Fezluxe Core"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("span",{className:"font-outfit text-[10px] text-[#8D4004] uppercase tracking-[0.3em]",children:"Serif Subhead"}),e.jsx("h2",{className:"font-playfairDisplay text-3xl italic leading-none",children:"System Architecture"})]}),e.jsxs("div",{className:"grid grid-cols-1 gap-12 pt-8 border-t border-black/5",children:[e.jsxs("div",{className:"space-y-4",children:[e.jsx("span",{className:"font-outfit text-[10px] text-black/30 uppercase tracking-[0.3em]",children:"Body Text / Sans"}),e.jsx("p",{className:"font-outfit text-sm text-black/70 leading-relaxed italic",children:"Used for prose and detailed descriptions. Chosen for its balance of readability and sophisticated character."})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsx("span",{className:"font-outfit text-[10px] text-black/30 uppercase tracking-[0.3em]",children:"Interface / Mono"}),e.jsx("p",{className:"font-mono text-[10px] uppercase tracking-[0.2em] text-[#8D4004]",children:"Reserved for cryptographic IDs, system constants, and secondary metadata."})]})]})]})]}),e.jsxs("section",{className:"space-y-12",children:[e.jsxs("div",{className:"flex items-center gap-6",children:[e.jsx("span",{className:"font-playfairDisplay text-6xl text-[#1A1A1A]/10 italic",children:"04"}),e.jsx("h2",{className:"text-4xl font-playfairDisplay italic text-[#1A1A1A]",children:"Color Field"}),e.jsx("div",{className:"flex-1 h-px bg-black/5"})]}),e.jsx("div",{className:"space-y-px bg-black/5 border border-black/5 overflow-hidden",children:[{name:"LUXE_PARCHMENT",hex:"#F5F5F0",bg:"bg-[#F5F5F0]",desc:"Primary Foundation"},{name:"LUXE_OBSIDIAN",hex:"#1A1A1A",bg:"bg-[#1A1A1A]",desc:"Primary Text & Contrast"},{name:"BURNISHED_AMBER",hex:"#8D4004",bg:"bg-[#8D4004]",desc:"Architectural Accent"},{name:"SOFT_PAPER",hex:"#FDFCFB",bg:"bg-[#FDFCFB]",desc:"Surface Elevation"},{name:"LUXE_SILVER",hex:"#EBEBEB",bg:"bg-[#EBEBEB]",desc:"Secondary Metadata"}].map(s=>e.jsxs("div",{className:"bg-white p-6 flex items-center justify-between group hover:bg-[#F5F5F0] transition-colors",children:[e.jsxs("div",{className:"flex items-center gap-6",children:[e.jsx("div",{className:`w-12 h-12 rounded-full border border-black/5 ${s.bg}`}),e.jsxs("div",{className:"space-y-1",children:[e.jsx("div",{className:"text-xs font-bold font-outfit tracking-widest",children:s.name}),e.jsx("div",{className:"text-[10px] font-outfit text-black/30 uppercase tracking-widest",children:s.desc})]})]}),e.jsx("div",{className:"font-mono text-[10px] text-black/20 uppercase tracking-widest group-hover:text-[#8D4004] transition-colors",children:s.hex})]},s.name))})]}),e.jsxs("section",{className:"space-y-12",children:[e.jsxs("div",{className:"flex items-center gap-6",children:[e.jsx("span",{className:"font-playfairDisplay text-6xl text-[#1A1A1A]/10 italic",children:"05"}),e.jsx("h2",{className:"text-4xl font-playfairDisplay italic text-[#1A1A1A]",children:"Status Echo"}),e.jsx("div",{className:"flex-1 h-px bg-black/5"})]}),e.jsxs("div",{className:"p-8 border border-black/5 bg-white/40 space-y-8",children:[e.jsxs("div",{className:"grid grid-cols-2 gap-4",children:[e.jsxs("button",{onClick:()=>a({title:"Integrity Sync",message:"Synchronization sequence complete.",type:"success"}),className:"p-4 bg-emerald-50 border border-emerald-100 text-emerald-700 font-outfit text-[10px] uppercase tracking-widest flex items-center gap-3 hover:bg-emerald-100 transition-all rounded-sm",children:[e.jsx(r,{size:18,weight:"fill"})," Test_Success"]}),e.jsxs("button",{onClick:()=>a({title:"Milestone Discovered",message:"Rare system metric established.",type:"gold"}),className:"p-4 bg-amber-50 border border-amber-100 text-amber-700 font-outfit text-[10px] uppercase tracking-widest flex items-center gap-3 hover:bg-amber-100 transition-all rounded-sm",children:[e.jsx(N,{size:18,weight:"fill"})," Test_Gold"]}),e.jsxs("button",{onClick:()=>a({title:"Sync Interrupted",message:"Anomalous drift detected in node 04.",type:"error"}),className:"p-4 bg-rose-50 border border-rose-100 text-rose-700 font-outfit text-[10px] uppercase tracking-widest flex items-center gap-3 hover:bg-rose-100 transition-all rounded-sm",children:[e.jsx(y,{size:18,weight:"fill"})," Test_Error"]}),e.jsxs("button",{onClick:()=>a({title:"Terminal Session",message:"Initializing Luxe design protocols.",type:"techno"}),className:"p-4 bg-cyan-50 border border-cyan-100 text-cyan-700 font-outfit text-[10px] uppercase tracking-widest flex items-center gap-3 hover:bg-cyan-100 transition-all rounded-sm",children:[e.jsx(A,{size:18,weight:"fill"})," Test_Techno"]})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4",children:[e.jsx("button",{onClick:()=>t(!0),className:"py-4 bg-white border border-black/10 hover:border-[#8D4004] text-black/60 hover:text-[#8D4004] transition-all font-outfit text-[10px] uppercase tracking-widest rounded-sm",children:"Open Luxe Modal"}),e.jsx("button",{onClick:m,className:"py-4 bg-white border border-black/10 hover:border-[#8D4004] text-black/60 hover:text-[#8D4004] transition-all font-outfit text-[10px] uppercase tracking-widest rounded-sm",children:"Open Side Panel"})]})]})]})]})]}),e.jsxs("footer",{className:"mt-48 pt-12 border-t border-black/10 flex flex-col md:flex-row justify-between items-center gap-8 font-outfit text-[10px] uppercase tracking-[0.4em] text-black/30",children:[e.jsxs("div",{className:"flex items-center gap-4",children:[e.jsx(r,{size:16,className:"text-emerald-600"}),e.jsx("span",{children:"LUXE_SPEC_V2.1.0_SYNC"})]}),e.jsx("div",{className:"text-right",children:e.jsxs("span",{children:["Synchronized with Mainframe: ",new Date().toLocaleDateString()]})})]})]}),e.jsx(v,{isOpen:d,onClose:()=>t(!1),title:"Architecture_Preview",children:e.jsxs("div",{className:"space-y-8",children:[e.jsxs("div",{className:"inline-flex items-center gap-3 px-4 py-2 border border-black/10 rounded-full bg-[#F5F5F0]",children:[e.jsx(k,{size:16,className:"text-[#8D4004]"}),e.jsx("span",{className:"font-outfit text-[10px] uppercase tracking-widest text-black/60",children:"Modal_Protocol_Verified"})]}),e.jsx("p",{className:"font-outfit text-lg italic text-[#1A1A1A]/80 leading-relaxed",children:"The LuxeModal component features a refined parchment background, elegant typography, and a balanced usage of soft shadows to create a sophisticated focal point for critical information."}),e.jsx("div",{className:"h-48 w-full bg-[#FDFCFB] border border-black/5 flex items-center justify-center rounded-sm",children:e.jsx(l,{seed:"Modal Content",className:"w-full h-full opacity-40 mix-blend-multiply"})}),e.jsx("button",{onClick:()=>t(!1),className:"w-full py-4 bg-[#1A1A1A] text-white font-outfit text-xs uppercase tracking-[0.3em] rounded-full hover:bg-[#8D4004] transition-all",children:"Acknowledge Protocol"})]})})]})};export{L as default};