themes-art-deco/template.templ
Alex Dunmow 9fbedf5ba1 initial: theme plugin art-deco
Bootstrapped during the 2026-06-06 BlockNinja consolidation. Was previously
an unversioned directory inside ~/src/blockninja-themes/art-deco.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-06-06 14:11:19 +08:00

271 lines
8.3 KiB
Plaintext

package main
import (
"context"
"git.dev.alexdunmow.com/block/core/templates/bn"
)
// PageData captures the inputs needed to render an Art Deco page template.
type PageData struct {
Title string
Slots map[string]string
ThemeMode string
ThemeCSS string
SiteSettings bn.SiteSettingsData
PageMeta bn.PageMeta
StructuredData string
CSSHash string
PageviewNonce string
EngagementConfig bn.EngagementConfig
}
// parsePageData reads a page-render doc into the typed PageData used by templ.
func parsePageData(doc map[string]any) PageData {
title := "Untitled"
if t, ok := doc["title"].(string); ok {
title = t
}
slots := make(map[string]string)
if s, ok := doc["slots"].(map[string]string); ok {
slots = s
}
themeCSS := ""
if tc, ok := doc["theme_css"].(string); ok {
themeCSS = tc
}
structuredData := ""
if sd, ok := doc["structured_data"].(string); ok {
structuredData = sd
}
cssHash := ""
if ch, ok := doc["css_hash"].(string); ok {
cssHash = ch
}
pageviewNonce := ""
if pn, ok := doc["pageview_nonce"].(string); ok {
pageviewNonce = pn
}
themeMode := "dark"
if tm, ok := doc["theme_mode"].(string); ok && tm != "" {
themeMode = tm
}
return PageData{
Title: title,
Slots: slots,
ThemeMode: themeMode,
ThemeCSS: themeCSS,
SiteSettings: bn.ParseSiteSettings(doc),
PageMeta: bn.ParsePageMeta(doc),
StructuredData: structuredData,
CSSHash: cssHash,
PageviewNonce: pageviewNonce,
EngagementConfig: bn.ParseEngagementConfig(doc),
}
}
// htmlClassForMode returns the html-element class hint that flips dark mode.
func htmlClassForMode(mode string) string {
if mode == "dark" {
return "dark"
}
return ""
}
// ArtDecoDefault — centered symmetric layout with gold rule header and footer.
templ ArtDecoDefault(data PageData) {
<!DOCTYPE html>
<html lang="en" class={ htmlClassForMode(data.ThemeMode) }>
@bn.Head(bn.HeadData{
Title: data.Title,
Settings: data.SiteSettings,
PageMeta: data.PageMeta,
ThemeMode: data.ThemeMode,
ThemeCSS: data.ThemeCSS,
PluginStyles: []string{"/templates/art-deco/style.css"},
StructuredData: data.StructuredData,
CSSHash: data.CSSHash,
PageviewNonce: data.PageviewNonce,
EngagementConfig: data.EngagementConfig,
})
<body class="bg-background text-foreground antialiased min-h-screen flex flex-col" style="font-family: var(--font-body, &quot;Cormorant Garamond&quot;, &quot;Cormorant&quot;, Georgia, serif);">
@bn.AdminBypassBanner(data.SiteSettings)
<header class="w-full">
<div class="max-w-5xl mx-auto px-4">
@templ.Raw(data.Slots["header"])
</div>
</header>
<main class="flex-grow max-w-3xl mx-auto w-full px-4 py-12 text-center">
if main, ok := data.Slots["main"]; ok && main != "" {
@templ.Raw(main)
} else {
<div class="py-20">
<p class="text-muted-foreground">No content blocks assigned to this page.</p>
</div>
}
</main>
<footer class="w-full mt-auto">
<div class="max-w-5xl mx-auto px-4">
@templ.Raw(data.Slots["footer"])
</div>
</footer>
@bn.BodyEnd(data.SiteSettings)
</body>
</html>
}
// ArtDecoLanding — Marquee Landing: wide hero, reservation strip, CTA.
templ ArtDecoLanding(data PageData) {
<!DOCTYPE html>
<html lang="en" class={ htmlClassForMode(data.ThemeMode) }>
@bn.Head(bn.HeadData{
Title: data.Title,
Settings: data.SiteSettings,
PageMeta: data.PageMeta,
ThemeMode: data.ThemeMode,
ThemeCSS: data.ThemeCSS,
PluginStyles: []string{"/templates/art-deco/style.css"},
StructuredData: data.StructuredData,
CSSHash: data.CSSHash,
PageviewNonce: data.PageviewNonce,
EngagementConfig: data.EngagementConfig,
})
<body class="bg-background text-foreground antialiased min-h-screen flex flex-col" style="font-family: var(--font-body, &quot;Cormorant Garamond&quot;, &quot;Cormorant&quot;, Georgia, serif);">
@bn.AdminBypassBanner(data.SiteSettings)
<section class="w-full">
@templ.Raw(data.Slots["marquee"])
</section>
<main class="flex-grow">
if main, ok := data.Slots["main"]; ok && main != "" {
<div class="max-w-5xl mx-auto px-4 py-16 text-center">
@templ.Raw(main)
</div>
}
</main>
<section class="w-full">
@templ.Raw(data.Slots["cta"])
</section>
<footer class="w-full mt-auto">
<div class="max-w-5xl mx-auto px-4">
@templ.Raw(data.Slots["footer"])
</div>
</footer>
@bn.BodyEnd(data.SiteSettings)
</body>
</html>
}
// ArtDecoArticle — narrow editorial column for press, menus and stories.
templ ArtDecoArticle(data PageData) {
<!DOCTYPE html>
<html lang="en" class={ htmlClassForMode(data.ThemeMode) }>
@bn.Head(bn.HeadData{
Title: data.Title,
Settings: data.SiteSettings,
PageMeta: data.PageMeta,
ThemeMode: data.ThemeMode,
ThemeCSS: data.ThemeCSS,
PluginStyles: []string{"/templates/art-deco/style.css"},
StructuredData: data.StructuredData,
CSSHash: data.CSSHash,
PageviewNonce: data.PageviewNonce,
EngagementConfig: data.EngagementConfig,
})
<body class="bg-background text-foreground antialiased min-h-screen flex flex-col" style="font-family: var(--font-body, &quot;Cormorant Garamond&quot;, &quot;Cormorant&quot;, Georgia, serif);">
@bn.AdminBypassBanner(data.SiteSettings)
<header class="w-full">
<div class="max-w-3xl mx-auto px-4">
@templ.Raw(data.Slots["header"])
</div>
</header>
<div class="flex-grow grid gap-12 max-w-5xl mx-auto w-full px-4 py-12 md:grid-cols-[2fr_1fr]">
<main class="prose max-w-none">
if main, ok := data.Slots["main"]; ok && main != "" {
<article class="deco-dropcap" data-deco-dropcap="true">
@templ.Raw(main)
</article>
} else {
<div class="py-20 text-center">
<p class="text-muted-foreground">No content blocks assigned to this page.</p>
</div>
}
</main>
<aside class="w-full">
@templ.Raw(data.Slots["aside"])
</aside>
</div>
<footer class="w-full mt-auto">
<div class="max-w-5xl mx-auto px-4">
@templ.Raw(data.Slots["footer"])
</div>
</footer>
@bn.BodyEnd(data.SiteSettings)
</body>
</html>
}
// ArtDecoFullWidth — Grand Ballroom: edge-to-edge gallery layout.
templ ArtDecoFullWidth(data PageData) {
<!DOCTYPE html>
<html lang="en" class={ htmlClassForMode(data.ThemeMode) }>
@bn.Head(bn.HeadData{
Title: data.Title,
Settings: data.SiteSettings,
PageMeta: data.PageMeta,
ThemeMode: data.ThemeMode,
ThemeCSS: data.ThemeCSS,
PluginStyles: []string{"/templates/art-deco/style.css"},
StructuredData: data.StructuredData,
CSSHash: data.CSSHash,
PageviewNonce: data.PageviewNonce,
EngagementConfig: data.EngagementConfig,
})
<body class="bg-background text-foreground antialiased min-h-screen flex flex-col" style="font-family: var(--font-body, &quot;Cormorant Garamond&quot;, &quot;Cormorant&quot;, Georgia, serif);">
@bn.AdminBypassBanner(data.SiteSettings)
<header class="w-full">
@templ.Raw(data.Slots["header"])
</header>
<main class="flex-grow w-full">
if main, ok := data.Slots["main"]; ok && main != "" {
@templ.Raw(main)
} else {
<div class="py-20 text-center">
<p class="text-muted-foreground">No content blocks assigned to this page.</p>
</div>
}
</main>
<footer class="w-full mt-auto">
<div class="max-w-5xl mx-auto px-4">
@templ.Raw(data.Slots["footer"])
</div>
</footer>
@bn.BodyEnd(data.SiteSettings)
</body>
</html>
}
// Page-render funcs adapt typed PageData into templ.Component values.
func RenderArtDecoDefault(ctx context.Context, doc map[string]any) templ.Component {
return ArtDecoDefault(parsePageData(doc))
}
func RenderArtDecoLanding(ctx context.Context, doc map[string]any) templ.Component {
return ArtDecoLanding(parsePageData(doc))
}
func RenderArtDecoArticle(ctx context.Context, doc map[string]any) templ.Component {
return ArtDecoArticle(parsePageData(doc))
}
func RenderArtDecoFullWidth(ctx context.Context, doc map[string]any) templ.Component {
return ArtDecoFullWidth(parsePageData(doc))
}