mirror of
https://github.com/Dvorinka/Primora.git
synced 2026-06-03 20:13:01 +00:00
Tomas Dvorak
214 lines
6.4 KiB
JavaScript
214 lines
6.4 KiB
JavaScript
module.exports = {
|
|
content: ["./index.html", "./src/**/*.{ts,tsx}"],
|
|
darkMode: "class",
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
// Background layers
|
|
bg: {
|
|
main: "var(--bg-main)",
|
|
subtle: "var(--bg-subtle)",
|
|
elevated: "var(--bg-elevated)",
|
|
},
|
|
// Surface layers
|
|
surface: {
|
|
1: "var(--surface-1)",
|
|
2: "var(--surface-2)",
|
|
3: "var(--surface-3)",
|
|
},
|
|
// Border colors
|
|
border: {
|
|
DEFAULT: "var(--border)",
|
|
subtle: "var(--border-subtle)",
|
|
strong: "var(--border-strong)",
|
|
hover: "var(--border-hover)",
|
|
},
|
|
// Text colors
|
|
text: {
|
|
primary: "var(--text-primary)",
|
|
secondary: "var(--text-secondary)",
|
|
muted: "var(--text-muted)",
|
|
faint: "var(--text-faint)",
|
|
},
|
|
// Accent
|
|
accent: {
|
|
DEFAULT: "var(--accent)",
|
|
hover: "var(--accent-hover)",
|
|
active: "var(--accent-active)",
|
|
muted: "var(--accent-muted)",
|
|
subtle: "var(--accent-subtle)",
|
|
glow: "var(--accent-glow)",
|
|
},
|
|
// Status colors
|
|
success: {
|
|
DEFAULT: "var(--success)",
|
|
muted: "var(--success-muted)",
|
|
},
|
|
warning: {
|
|
DEFAULT: "var(--warning)",
|
|
muted: "var(--warning-muted)",
|
|
},
|
|
error: {
|
|
DEFAULT: "var(--error)",
|
|
muted: "var(--error-muted)",
|
|
},
|
|
info: {
|
|
DEFAULT: "var(--info)",
|
|
muted: "var(--info-muted)",
|
|
},
|
|
},
|
|
// Border radius
|
|
borderRadius: {
|
|
sm: "var(--radius-sm)",
|
|
DEFAULT: "var(--radius)",
|
|
lg: "var(--radius-lg)",
|
|
xl: "var(--radius-xl)",
|
|
},
|
|
// Box shadows
|
|
boxShadow: {
|
|
sm: "var(--shadow-sm)",
|
|
DEFAULT: "var(--shadow-md)",
|
|
lg: "var(--shadow-lg)",
|
|
elevated: "var(--shadow-elevated)",
|
|
glow: "var(--shadow-glow)",
|
|
},
|
|
// Font families
|
|
fontFamily: {
|
|
sans: "var(--font-sans)",
|
|
display: "var(--font-display)",
|
|
mono: "var(--font-mono)",
|
|
},
|
|
// Spacing
|
|
spacing: {
|
|
1: "var(--space-1)",
|
|
2: "var(--space-2)",
|
|
3: "var(--space-3)",
|
|
4: "var(--space-4)",
|
|
5: "var(--space-5)",
|
|
6: "var(--space-6)",
|
|
8: "var(--space-8)",
|
|
10: "var(--space-10)",
|
|
12: "var(--space-12)",
|
|
},
|
|
// Animation durations
|
|
transitionDuration: {
|
|
fast: "var(--duration-fast)",
|
|
normal: "var(--duration-normal)",
|
|
slow: "var(--duration-slow)",
|
|
},
|
|
// Animation timing functions
|
|
transitionTimingFunction: {
|
|
"ease-out": "var(--ease-out)",
|
|
"ease-in-out": "var(--ease-in-out)",
|
|
spring: "var(--ease-spring)",
|
|
},
|
|
// Animations
|
|
animation: {
|
|
"fade-in": "fadeIn var(--duration-normal) var(--ease-out)",
|
|
"slide-up": "slideUp var(--duration-normal) var(--ease-out)",
|
|
"slide-in-left": "slideInLeft var(--duration-normal) var(--ease-out)",
|
|
"slide-in-right": "slideInRight var(--duration-normal) var(--ease-out)",
|
|
"scale-in": "scaleIn var(--duration-fast) var(--ease-spring)",
|
|
"bounce-in": "bounceIn 0.5s var(--ease-spring)",
|
|
"float": "float 3s ease-in-out infinite",
|
|
"pulse-glow": "pulseGlow 2s ease-in-out infinite",
|
|
"gradient-shift": "gradientShift 3s ease infinite",
|
|
pulse: "pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite",
|
|
spin: "spin 0.8s linear infinite",
|
|
"spin-slow": "spin 8s linear infinite",
|
|
shimmer: "shimmer 2s ease-in-out infinite",
|
|
},
|
|
keyframes: {
|
|
fadeIn: {
|
|
from: { opacity: "0" },
|
|
to: { opacity: "1" },
|
|
},
|
|
slideUp: {
|
|
from: { opacity: "0", transform: "translateY(12px)" },
|
|
to: { opacity: "1", transform: "translateY(0)" },
|
|
},
|
|
slideInLeft: {
|
|
from: { opacity: "0", transform: "translateX(-20px)" },
|
|
to: { opacity: "1", transform: "translateX(0)" },
|
|
},
|
|
slideInRight: {
|
|
from: { opacity: "0", transform: "translateX(20px)" },
|
|
to: { opacity: "1", transform: "translateX(0)" },
|
|
},
|
|
scaleIn: {
|
|
from: { opacity: "0", transform: "scale(0.95)" },
|
|
to: { opacity: "1", transform: "scale(1)" },
|
|
},
|
|
bounceIn: {
|
|
"0%": { opacity: "0", transform: "scale(0.3)" },
|
|
"50%": { transform: "scale(1.05)" },
|
|
"70%": { transform: "scale(0.9)" },
|
|
"100%": { opacity: "1", transform: "scale(1)" },
|
|
},
|
|
float: {
|
|
"0%, 100%": { transform: "translateY(0)" },
|
|
"50%": { transform: "translateY(-10px)" },
|
|
},
|
|
pulseGlow: {
|
|
"0%, 100%": { boxShadow: "0 0 20px rgba(25, 163, 217, 0.2)" },
|
|
"50%": { boxShadow: "0 0 40px rgba(25, 163, 217, 0.4)" },
|
|
},
|
|
gradientShift: {
|
|
"0%, 100%": { backgroundPosition: "0% 50%" },
|
|
"50%": { backgroundPosition: "100% 50%" },
|
|
},
|
|
pulse: {
|
|
"0%, 100%": { opacity: "1" },
|
|
"50%": { opacity: "0.5" },
|
|
},
|
|
spin: {
|
|
to: { transform: "rotate(360deg)" },
|
|
},
|
|
shimmer: {
|
|
"0%": { backgroundPosition: "-1000px 0" },
|
|
"100%": { backgroundPosition: "1000px 0" },
|
|
},
|
|
},
|
|
// Typography
|
|
fontSize: {
|
|
"2xs": ["0.625rem", { lineHeight: "1rem" }],
|
|
xs: ["0.75rem", { lineHeight: "1rem" }],
|
|
sm: ["0.875rem", { lineHeight: "1.25rem" }],
|
|
base: ["1rem", { lineHeight: "1.5rem" }],
|
|
lg: ["1.125rem", { lineHeight: "1.5rem" }],
|
|
xl: ["1.25rem", { lineHeight: "1.75rem" }],
|
|
"2xl": ["1.5rem", { lineHeight: "2rem" }],
|
|
"3xl": ["2rem", { lineHeight: "2.5rem" }],
|
|
},
|
|
// Letter spacing
|
|
letterSpacing: {
|
|
tighter: "-0.02em",
|
|
tight: "-0.01em",
|
|
normal: "0",
|
|
wide: "0.05em",
|
|
wider: "0.1em",
|
|
widest: "0.14em",
|
|
},
|
|
// Z-index scale
|
|
zIndex: {
|
|
1: "1",
|
|
10: "10",
|
|
20: "20",
|
|
30: "30",
|
|
40: "40",
|
|
50: "50",
|
|
},
|
|
// Screens for responsive design
|
|
screens: {
|
|
sm: "640px",
|
|
md: "768px",
|
|
lg: "1024px",
|
|
xl: "1280px",
|
|
"2xl": "1536px",
|
|
},
|
|
},
|
|
},
|
|
plugins: [],
|
|
};
|
|
|