Standard.site landing page built in Next.js
at main 61 lines 2.5 kB view raw
1'use client' 2 3import { BlocksIcon } from 'lucide-react' 4import { TabbedLexiconViewer } from '@/app/components' 5import { getAllSchemas, getLexicon, parseLexiconFields, } from '@/app/lib/lexicon' 6import { LEXICON_TABS } from '@/app/data/content' 7 8export function DefinitionsSection() { 9 const allSchemas = getAllSchemas() 10 11 // Build tab configs from the defined NSIDs 12 const tabs = LEXICON_TABS.map((nsid) => { 13 const schema = getLexicon(nsid) 14 return schema ? { 15 nsid, 16 schema, 17 fields: parseLexiconFields(schema), 18 } : null 19 }).filter((tab) => tab !== null) 20 21 if (tabs.length === 0) { 22 return ( 23 <section id="definitions" className="flex flex-col gap-8"> 24 <h2 className="font-display font-semibold text-3xl sm:text-4xl leading-tight tracking-tighter text-base-content"> 25 Definitions 26 </h2> 27 <p className="text-xl leading-snug tracking-tight text-muted"> 28 Failed to load lexicon definitions. Please try again later. 29 </p> 30 </section> 31 ) 32 } 33 34 return ( 35 <section id="definitions" className="flex flex-col gap-8"> 36 <h2 className="font-display font-semibold text-3xl sm:text-4xl leading-tight tracking-tighter text-base-content"> 37 Definitions 38 </h2> 39 40 <p className="text-base sm:text-xl leading-snug tracking-tight text-muted"> 41 We currently define three main lexicons that cover the core building 42 blocks of long-form platforms: where content lives, what it 43 contains, and how users connect with publications. 44 </p> 45 46 <TabbedLexiconViewer tabs={ tabs } allSchemas={ allSchemas } /> 47 48 {/* Modularity callout */} 49 <div className="flex gap-4 rounded-2xl border border-border bg-base-200 p-4"> 50 <div className="pt-1"> 51 <BlocksIcon className="size-4 text-base-content" /> 52 </div> 53 <p className="flex-1 text-sm sm:text-base leading-snug tracking-tight text-muted"> 54 <span className="font-semibold">Modularity.</span>{ ' ' } 55 Each lexicon is independent. Use them together for full support, or implement only 56 what your platform requires. 57 </p> 58 </div> 59 </section> 60 ) 61}