Files
sass-mohfarawati/tailwind.config.ts
T
2026-03-07 14:10:30 +01:00

120 lines
3.7 KiB
TypeScript

import type { Config } from "tailwindcss";
import animate from "tailwindcss-animate";
const config: Config = {
darkMode: ["class"],
content: [
"./pages/**/*.{js,ts,jsx,tsx,mdx}",
"./src/**/*.{js,ts,jsx,tsx,mdx}",
"./components/**/*.{js,ts,jsx,tsx,mdx}",
"./app/**/*.{js,ts,jsx,tsx,mdx}",
],
theme: {
extend: {
colors: {
border: "hsl(var(--border))",
"border-strong": "hsl(var(--border-strong))",
input: "hsl(var(--input))",
ring: "hsl(var(--ring))",
background: "hsl(var(--background))",
foreground: "hsl(var(--foreground))",
surface: {
1: "hsl(var(--surface-1))",
2: "hsl(var(--surface-2))",
3: "hsl(var(--surface-3))",
inverse: "hsl(var(--surface-inverse))",
"inverse-foreground": "hsl(var(--surface-inverse-foreground))",
},
primary: {
DEFAULT: "hsl(var(--primary))",
foreground: "hsl(var(--primary-foreground))",
},
secondary: {
DEFAULT: "hsl(var(--secondary))",
foreground: "hsl(var(--secondary-foreground))",
},
muted: {
DEFAULT: "hsl(var(--muted))",
foreground: "hsl(var(--muted-foreground))",
},
accent: {
DEFAULT: "hsl(var(--accent))",
foreground: "hsl(var(--accent-foreground))",
},
destructive: {
DEFAULT: "hsl(var(--destructive))",
foreground: "hsl(var(--destructive-foreground))",
},
card: {
DEFAULT: "hsl(var(--card))",
foreground: "hsl(var(--card-foreground))",
},
popover: {
DEFAULT: "hsl(var(--popover))",
foreground: "hsl(var(--popover-foreground))",
},
brand: {
primary: "hsl(var(--brand-primary))",
secondary: "hsl(var(--brand-secondary))",
},
status: {
success: "hsl(var(--status-success))",
"success-soft": "hsl(var(--status-success-soft))",
warning: "hsl(var(--status-warning))",
"warning-soft": "hsl(var(--status-warning-soft))",
},
sidebar: {
DEFAULT: "hsl(var(--sidebar-background))",
foreground: "hsl(var(--sidebar-foreground))",
primary: "hsl(var(--sidebar-primary))",
"primary-foreground": "hsl(var(--sidebar-primary-foreground))",
accent: "hsl(var(--sidebar-accent))",
"accent-foreground": "hsl(var(--sidebar-accent-foreground))",
border: "hsl(var(--sidebar-border))",
ring: "hsl(var(--sidebar-ring))",
},
},
borderRadius: {
sm: "var(--radius-nested)",
md: "var(--radius-nested)",
lg: "var(--radius-surface)",
xl: "var(--radius-surface)",
surface: "var(--radius-surface)",
nested: "var(--radius-nested)",
pill: "var(--radius-pill)",
},
boxShadow: {
xs: "var(--shadow-xs)",
sm: "var(--shadow-sm)",
md: "var(--shadow-md)",
lg: "var(--shadow-lg)",
card: "var(--shadow-card)",
panel: "var(--shadow-panel)",
sidebar: "var(--shadow-sidebar)",
},
maxWidth: {
narrow: "var(--container-narrow)",
layout: "var(--container-default)",
wide: "var(--container-wide)",
admin: "var(--container-admin)",
},
height: {
header: "var(--header-height)",
},
minHeight: {
header: "var(--header-height)",
},
spacing: {
section: "var(--section-space)",
content: "var(--content-space)",
},
backdropBlur: {
chrome: "18px",
},
},
},
plugins: [animate],
};
export default config;