b27b3c1d44
Adds Tailwind v4 / PostCSS pipeline that compiles to static/css/marketing.css, to be loaded only by future templates/marketing/** templates and to coexist with the existing legacy v3 JIT runtime used by index.html / account.html / admin.html. The legacy v3 runtime stays untouched. - package.json: postcss-cli build:css and watch:css scripts - postcss.config.js: @tailwindcss/postcss + autoprefixer - static/css/tailwind.config.js: brand tokens (b1/b2/b3, navy, navy2, navy3, bg, border), font families, brand-grad, cta shadows, FlexiHub keyframes (tc-fade-in-up/right, tc-float-y, tc-pulse-glow, plus-breathe). content paths scoped to marketing/legal/billing/macros only - purge cannot touch legacy templates. - static/css/input.css: @import "tailwindcss"; + @config directive (Tailwind v4 backward-compat for v3-style JS config). @font-face Inter Variable + JetBrains Mono Variable (woff2). base layer body font/color, h1-h3 letter-spacing. utilities: grad-text, grad-bg, eyebrow. - Dockerfile: new stage 3 'assets-builder' (node:20-alpine) compiles CSS; runtime stage copies the built file in via --from=assets-builder, after COPY . . so the freshly-built file always wins. - .gitignore + .dockerignore: exclude node_modules. Build verified locally: marketing.css = 121 KB minified (Tailwind v4 ships all default theme tokens + reset properties even with empty content; realistic baseline, will not grow much as marketing markup is added). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
35 lines
848 B
CSS
35 lines
848 B
CSS
@import "tailwindcss";
|
|
@config "./tailwind.config.js";
|
|
|
|
@layer base {
|
|
@font-face {
|
|
font-family: 'Inter Variable';
|
|
src: url('/static/fonts/Inter-Variable.woff2') format('woff2-variations');
|
|
font-weight: 100 900;
|
|
font-display: swap;
|
|
}
|
|
@font-face {
|
|
font-family: 'JetBrains Mono Variable';
|
|
src: url('/static/fonts/JetBrainsMono-Variable.woff2') format('woff2-variations');
|
|
font-weight: 100 800;
|
|
font-display: swap;
|
|
}
|
|
body {
|
|
@apply font-sans bg-white text-brand-navy antialiased;
|
|
}
|
|
h1, h2, h3 { @apply font-black; letter-spacing: -2.5px; }
|
|
h1 { letter-spacing: -3px; }
|
|
}
|
|
|
|
@layer utilities {
|
|
.grad-text {
|
|
@apply bg-brand-grad bg-clip-text text-transparent;
|
|
}
|
|
.grad-bg {
|
|
@apply bg-brand-grad text-white;
|
|
}
|
|
.eyebrow {
|
|
@apply text-[11px] uppercase font-bold tracking-[0.18em];
|
|
}
|
|
}
|