Remediate broken layout on the demo home page (persona intact): - Hero rendered with no height: it relied on min-h-screen / responsive Tailwind that the host JIT drops on a cold provision. Drive hero sizing + type through compiled .kg-hero* CSS classes (input_css_append is compiled every build). Mascot repositioned to bottom-center behind readable content; confetti/ABC/reduced-motion fallback preserved. All builtin field reads unchanged. - Landing header was position:absolute and overlapped the feature grid when the hero collapsed -> switch to the default's in-flow sticky header (collision gone). - feature-grid columns never formed (lg:grid-cols-3 not compiled) -> route through compiled .kg-cols/.kg-cols-3 media-query grid. - Empty art-wall polaroids ballooned into large blank squares -> graceful 4:3 capped placeholder with a playful crayon wash. - Define .kg-section (was only in the dead assets/style.css, so persona sections had no padding) and add a consistent .kg-sect rhythm; trim oversized section padding. - Alphabet strip now a single scrollable row (was flex-wrap) so the sticky header stays compact on mobile. - Mobile: all layout-critical grids are compiled media-query CSS (mobile-first, 1 col), no fixed widths > viewport, tap targets ok. No .reveal/scroll-hide pattern in this theme; whitespace was real layout void. Colors stay semantic tokens; check-safety 32 checks OK. No version bump. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
12 lines
755 B
Plaintext
12 lines
755 B
Plaintext
<!doctype html>
|
|
<html lang="en" class="{% if theme_mode == "dark" %}dark{% endif %}">
|
|
{{ head_html|safe }}
|
|
<body class="kg-page kg-dotted-paper min-h-screen flex flex-col antialiased">
|
|
{{ admin_banner_html|safe }}
|
|
<header class="w-full sticky top-0 z-40" style="background-color: hsl(var(--background) / 0.9); backdrop-filter: blur(6px); border-bottom: 3px solid hsl(var(--primary) / 0.25);">{{ slots.header|safe }}</header>
|
|
<main class="flex-grow w-full">{% if slots.main %}{{ slots.main|safe }}{% else %}<div class="max-w-6xl mx-auto px-4 py-12"><div class="kg-empty">No content blocks assigned to this page yet.</div></div>{% endif %}</main>
|
|
<footer class="w-full mt-auto">{{ slots.footer|safe }}</footer>
|
|
{{ body_end_html|safe }}
|
|
</body>
|
|
</html>
|