refactor: replace hand-rolled utility CSS with Tailwind classes (host build now scans theme templates)

This commit is contained in:
Alex Dunmow 2026-07-05 17:55:48 +08:00
parent 10cecadef6
commit 52a2501959
5 changed files with 5 additions and 25 deletions

View File

@ -136,13 +136,6 @@ css:
padding-left: 1rem; padding-left: 1rem;
padding-right: 1rem; padding-right: 1rem;
} }
.editorial-wide {
max-width: 72rem;
margin-left: auto;
margin-right: auto;
padding-left: 1rem;
padding-right: 1rem;
}
.editorial-article-grid { .editorial-article-grid {
display: grid; display: grid;
grid-template-columns: 1fr; grid-template-columns: 1fr;
@ -159,19 +152,6 @@ css:
} }
} }
/* --- Home "river" reading column + vertical rhythm ---
* CSS-defined (not JIT Tailwind) so width + spacing always compile.
* Keeps the essay list at a comfortable measure and stops stacked
* cards from fusing into one seam-y block. */
.editorial-river {
max-width: 48rem;
margin-left: auto;
margin-right: auto;
padding-left: 1rem;
padding-right: 1rem;
}
.editorial-flow > * + * { margin-top: 2rem; }
/* --- Hero display title — responsive size via media queries so it is /* --- Hero display title — responsive size via media queries so it is
* independent of the host Tailwind JIT (large text-* combos in theme * independent of the host Tailwind JIT (large text-* combos in theme
* templates are not reliably scanned). --- */ * templates are not reliably scanned). --- */

View File

@ -5,7 +5,7 @@
{{ admin_banner_html|safe }} {{ admin_banner_html|safe }}
{% if slots.header %}<header class="w-full">{{ slots.header|safe }}</header>{% endif %} {% if slots.header %}<header class="w-full">{{ slots.header|safe }}</header>{% endif %}
<main class="flex-grow w-full"> <main class="flex-grow w-full">
<div class="editorial-wide py-10 md:py-14"> <div class="max-w-6xl mx-auto px-4 py-10 md:py-14">
{% if title %} {% if title %}
<div class="text-center"> <div class="text-center">
<h1 class="editorial-heading text-4xl md:text-5xl">{{ title }}</h1> <h1 class="editorial-heading text-4xl md:text-5xl">{{ title }}</h1>

View File

@ -5,7 +5,7 @@
{{ admin_banner_html|safe }} {{ admin_banner_html|safe }}
{% if slots.header %}<header class="w-full">{{ slots.header|safe }}</header>{% endif %} {% if slots.header %}<header class="w-full">{{ slots.header|safe }}</header>{% endif %}
<main class="flex-grow w-full"> <main class="flex-grow w-full">
<div class="editorial-wide py-10 md:py-14"> <div class="max-w-6xl mx-auto px-4 py-10 md:py-14">
{% if slots.aside %} {% if slots.aside %}
<div class="grid gap-12 md:grid-cols-[2fr_1fr]"> <div class="grid gap-12 md:grid-cols-[2fr_1fr]">
<div>{% if slots.main %}{{ slots.main|safe }}{% endif %}</div> <div>{% if slots.main %}{{ slots.main|safe }}{% endif %}</div>

View File

@ -4,7 +4,7 @@
<body class="antialiased min-h-screen flex flex-col bg-background text-foreground" style="font-family: var(--font-body, &quot;Source Serif 4&quot;, &quot;Source Serif Pro&quot;, Georgia, serif);"> <body class="antialiased min-h-screen flex flex-col bg-background text-foreground" style="font-family: var(--font-body, &quot;Source Serif 4&quot;, &quot;Source Serif Pro&quot;, Georgia, serif);">
{{ admin_banner_html|safe }} {{ admin_banner_html|safe }}
{% if slots.header %}<header class="w-full">{{ slots.header|safe }}</header>{% endif %} {% if slots.header %}<header class="w-full">{{ slots.header|safe }}</header>{% endif %}
<main class="flex-grow w-full">{% if slots.main %}{{ slots.main|safe }}{% else %}<div class="editorial-wide py-20 text-center"><p style="color: hsl(var(--muted-foreground));">No content blocks assigned to this page.</p></div>{% endif %}</main> <main class="flex-grow w-full">{% if slots.main %}{{ slots.main|safe }}{% else %}<div class="max-w-6xl mx-auto px-4 py-20 text-center"><p style="color: hsl(var(--muted-foreground));">No content blocks assigned to this page.</p></div>{% endif %}</main>
{% if slots.footer %}<footer class="w-full mt-auto">{{ slots.footer|safe }}</footer>{% endif %} {% if slots.footer %}<footer class="w-full mt-auto">{{ slots.footer|safe }}</footer>{% endif %}
{{ body_end_html|safe }} {{ body_end_html|safe }}
</body> </body>

View File

@ -5,8 +5,8 @@
{{ admin_banner_html|safe }} {{ admin_banner_html|safe }}
{% if slots.masthead %}<header class="w-full">{{ slots.masthead|safe }}</header>{% endif %} {% if slots.masthead %}<header class="w-full">{{ slots.masthead|safe }}</header>{% endif %}
<main class="flex-grow w-full"> <main class="flex-grow w-full">
{% if slots.lead %}<section class="editorial-wide py-10 md:py-14">{{ slots.lead|safe }}</section>{% endif %} {% if slots.lead %}<section class="max-w-6xl mx-auto px-4 py-10 md:py-14">{{ slots.lead|safe }}</section>{% endif %}
{% if slots.river %}<section class="pb-10 md:pb-16"><div class="editorial-river editorial-flow"><hr class="editorial-rule">{{ slots.river|safe }}</div></section>{% endif %} {% if slots.river %}<section class="pb-10 md:pb-16"><div class="max-w-3xl mx-auto px-4 space-y-8"><hr class="editorial-rule">{{ slots.river|safe }}</div></section>{% endif %}
</main> </main>
{% if slots.footer %}<footer class="w-full mt-auto">{{ slots.footer|safe }}</footer>{% endif %} {% if slots.footer %}<footer class="w-full mt-auto">{{ slots.footer|safe }}</footer>{% endif %}
{{ body_end_html|safe }} {{ body_end_html|safe }}