ffe46a146c
Bootstrapped during the 2026-06-06 BlockNinja consolidation. Was previously an unversioned directory inside ~/src/blockninja-themes/kindergarten. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
43 lines
1.6 KiB
Plaintext
43 lines
1.6 KiB
Plaintext
package main
|
|
|
|
import "git.dev.alexdunmow.com/block/core/blocks"
|
|
|
|
// storybookQuoteComponent renders a quote with optional illustration.
|
|
templ storybookQuoteComponent(data StorybookQuoteData) {
|
|
<section class="kg-section" data-block="kindergarten:storybook_quote">
|
|
<div class="kg-container">
|
|
<figure class="kg-storybook">
|
|
<blockquote style="margin: 0;">
|
|
if data.Quote != "" {
|
|
<p class="kg-storybook-quote">"{ data.Quote }"</p>
|
|
} else {
|
|
<p class="kg-storybook-quote" data-empty="true">Add a quote to inspire your readers.</p>
|
|
}
|
|
if data.Author != "" {
|
|
<figcaption class="kg-storybook-author">— { data.Author }</figcaption>
|
|
}
|
|
</blockquote>
|
|
<div>
|
|
if data.Illustration != "" {
|
|
<img class="kg-storybook-illustration" src={ blocks.ResolveMediaPath(data.Illustration) } alt={ "Illustration accompanying the quote" } />
|
|
} else {
|
|
@storybookFallbackIllustration()
|
|
}
|
|
</div>
|
|
</figure>
|
|
</div>
|
|
</section>
|
|
}
|
|
|
|
// storybookFallbackIllustration renders a friendly SVG when no illustration
|
|
// is supplied. It guarantees a visible, themed graphic instead of a broken
|
|
// image icon.
|
|
templ storybookFallbackIllustration() {
|
|
<svg viewBox="0 0 200 150" width="100%" height="auto" class="kg-storybook-illustration" role="img" aria-label="Storybook illustration">
|
|
<rect width="200" height="150" rx="24" fill="hsl(var(--muted))" />
|
|
<circle cx="60" cy="60" r="20" fill="hsl(var(--accent))" />
|
|
<rect x="100" y="40" width="60" height="40" rx="8" fill="hsl(var(--primary))" />
|
|
<path d="M 30 110 Q 100 90 170 110 L 170 130 L 30 130 Z" fill="hsl(var(--secondary))" />
|
|
</svg>
|
|
}
|