mirror of
https://github.com/jakejarvis/jarv.is.git
synced 2025-04-26 03:45:22 -04:00
75 lines
2.1 KiB
CSS
75 lines
2.1 KiB
CSS
@import "tailwindcss";
|
|
|
|
@theme inline {
|
|
--font-sans: var(--font-geist-sans);
|
|
--font-mono: var(--font-geist-mono);
|
|
}
|
|
|
|
@theme {
|
|
--container-default: var(--container-4xl);
|
|
|
|
--color-*: initial;
|
|
--color-background-inner: oklch(1 0 0);
|
|
--color-background-outer: oklch(0.99 0 0);
|
|
--color-gray-900: oklch(0.27 0 0);
|
|
/* --color-gray-800: */
|
|
--color-gray-700: oklch(0.39 0 0);
|
|
--color-gray-600: oklch(0.44 0 0);
|
|
--color-gray-500: oklch(0.53 0 0);
|
|
--color-gray-400: oklch(0.85 0 0);
|
|
--color-gray-300: oklch(0.9 0 0);
|
|
--color-gray-200: oklch(0.96 0 0);
|
|
--color-gray-100: oklch(0.99 0 0);
|
|
--color-link: oklch(0.57 0.17 255);
|
|
--color-success: oklch(0.68 0.16 142);
|
|
--color-error: oklch(0.65 0.26 25);
|
|
--color-warning: oklch(0.75 0.17 75);
|
|
|
|
--animate-wave: wave 5s ease 1s infinite;
|
|
--animate-heartbeat: heartbeat 10s ease 7.5s infinite;
|
|
|
|
@keyframes wave {
|
|
0% { transform: rotate(0deg) }
|
|
5% { transform: rotate(14deg) }
|
|
10% { transform: rotate(-8deg) }
|
|
15% { transform: rotate(14deg) }
|
|
20% { transform: rotate(-4deg) }
|
|
25% { transform: rotate(10deg) }
|
|
30% { transform: rotate(0deg) }
|
|
|
|
/* pause for ~9 out of 10 seconds */
|
|
100% { transform: rotate(0deg) }
|
|
}
|
|
|
|
@keyframes heartbeat {
|
|
0% { transform: scale(1) }
|
|
2% { transform: scale(1.25) }
|
|
4% { transform: scale(1) }
|
|
6% { transform: scale(1.2) }
|
|
8% { transform: scale(1) }
|
|
|
|
/* pause for ~9 out of 10 seconds */
|
|
100% { transform: scale(1) }
|
|
}
|
|
}
|
|
|
|
@custom-variant dark (&:where([data-theme=dark], [data-theme=dark] *));
|
|
|
|
[data-theme="dark"] {
|
|
--color-background-inner: oklch(0.2 0 0);
|
|
--color-background-outer: oklch(0.22 0 0);
|
|
--color-gray-900: oklch(0.95 0 0);
|
|
/* --color-gray-800: */
|
|
--color-gray-700: oklch(0.87 0 0);
|
|
--color-gray-600: oklch(0.74 0 0);
|
|
--color-gray-500: oklch(0.65 0 0);
|
|
--color-gray-400: oklch(0.46 0 0);
|
|
--color-gray-300: oklch(0.4 0 0);
|
|
--color-gray-200: oklch(0.23 0 0);
|
|
--color-gray-100: oklch(0.2 0 0);
|
|
--color-link: oklch(0.8 0.1 230);
|
|
--color-success: oklch(0.83 0.15 142);
|
|
--color-error: oklch(0.7 0.2 25);
|
|
--color-warning: oklch(0.85 0.15 85);
|
|
}
|