mmintelandClaude Sonnet 5.5
f258e2a483
Adds dark design tokens, Inter + JetBrains Mono, a header with Notes, Process, About and a Book a call button, and a footer with the availability line driven by the tested domain core. Shared primitives live in src/components/site, site constants in src/content/site.ts. Legacy pages (blog, legal, contact, tags, technologies) keep a light surface via LegacyLightSurface. Stub routes for /notes, /process and /book. Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
79 lines
2.1 KiB
JavaScript
79 lines
2.1 KiB
JavaScript
import typography from "@tailwindcss/typography";
|
|
|
|
/** @type {import('tailwindcss').Config} */
|
|
export default {
|
|
content: ["./app/**/*.{js,ts,jsx,tsx,mdx}", "./src/**/*.{js,ts,jsx,tsx,mdx}"],
|
|
theme: {
|
|
extend: {
|
|
borderRadius: {
|
|
xl: "1rem",
|
|
"2xl": "1.5rem",
|
|
"3xl": "2rem",
|
|
full: "9999px",
|
|
},
|
|
colors: {
|
|
bg: "var(--color-bg)",
|
|
surface: "var(--color-surface)",
|
|
fg: "var(--color-fg)",
|
|
muted: "var(--color-muted)",
|
|
faint: "var(--color-faint)",
|
|
border: "var(--color-border)",
|
|
"border-strong": "var(--color-border-strong)",
|
|
accent: {
|
|
DEFAULT: "var(--color-accent)",
|
|
hover: "var(--color-accent-hover)",
|
|
fg: "var(--color-accent-fg)",
|
|
},
|
|
slate: {
|
|
850: "#1e293b",
|
|
900: "#0f172a",
|
|
950: "#020617",
|
|
},
|
|
},
|
|
fontFamily: {
|
|
sans: ["var(--font-inter)", "Inter", "system-ui", "sans-serif"],
|
|
serif: ["var(--font-newsreader)", "Georgia", "serif"],
|
|
mono: [
|
|
"var(--font-jetbrains-mono)",
|
|
"JetBrains Mono",
|
|
"ui-monospace",
|
|
"monospace",
|
|
],
|
|
},
|
|
typography: (theme) => ({
|
|
DEFAULT: {
|
|
css: {
|
|
color: theme("colors.slate.800"),
|
|
a: {
|
|
color: theme("colors.slate.900"),
|
|
"&:hover": {
|
|
color: theme("colors.slate.700"),
|
|
},
|
|
},
|
|
},
|
|
},
|
|
}),
|
|
animation: {
|
|
"fade-in": "fadeIn 0.5s ease-in-out",
|
|
"slide-up": "slideUp 0.6s ease-out",
|
|
"slide-down": "slideDown 0.6s ease-out",
|
|
},
|
|
keyframes: {
|
|
fadeIn: {
|
|
"0%": { opacity: "0" },
|
|
"100%": { opacity: "1" },
|
|
},
|
|
slideUp: {
|
|
"0%": { transform: "translateY(20px)", opacity: "0" },
|
|
"100%": { transform: "translateY(0)", opacity: "1" },
|
|
},
|
|
slideDown: {
|
|
"0%": { transform: "translateY(-20px)", opacity: "0" },
|
|
"100%": { transform: "translateY(0)", opacity: "1" },
|
|
},
|
|
},
|
|
},
|
|
},
|
|
plugins: [typography],
|
|
};
|