aethex-studio/app/main.css

61 lines
1.7 KiB
CSS

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');
@tailwind base;
@tailwind components;
@tailwind utilities;
@layer base {
* {
border-color: var(--border);
}
body {
font-family: 'Inter', sans-serif;
background:
radial-gradient(circle at 20% 50%, oklch(0.20 0.08 265 / 0.3) 0%, transparent 50%),
radial-gradient(circle at 80% 80%, oklch(0.20 0.08 150 / 0.2) 0%, transparent 50%),
oklch(0.15 0.02 265);
background-attachment: fixed;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Space Grotesk', sans-serif;
}
code, pre {
font-family: 'JetBrains Mono', monospace;
}
}
@layer components {
.btn-accent-hover {
transition: all 0.2s ease;
}
.btn-accent-hover:hover {
transform: scale(1.02);
filter: brightness(1.1);
}
.btn-accent-hover:active {
transform: scale(0.98);
}
}
:root {
--background: oklch(0.15 0.02 265);
--foreground: oklch(0.85 0.03 265);
--card: oklch(0.20 0.03 265);
--card-foreground: oklch(0.85 0.03 265);
--popover: oklch(0.20 0.03 265);
--popover-foreground: oklch(0.85 0.03 265);
--primary: oklch(0.45 0.20 265);
--primary-foreground: oklch(0.98 0 0);
--secondary: oklch(0.25 0.04 265);
--secondary-foreground: oklch(0.85 0.03 265);
--muted: oklch(0.22 0.03 265);
--muted-foreground: oklch(0.55 0.03 265);
--accent: oklch(0.75 0.20 150);
--accent-foreground: oklch(0.15 0.02 265);
--destructive: oklch(0.55 0.22 25);
--destructive-foreground: oklch(0.98 0 0);
--border: oklch(0.30 0.04 265);
--input: oklch(0.30 0.04 265);
--ring: oklch(0.75 0.20 150);
--radius: 0.5rem;
}