58 lines
994 B
CSS
58 lines
994 B
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
:root {
|
|
--primary: #f97316;
|
|
}
|
|
|
|
html[data-color-theme='ember'] {
|
|
--primary: #f97316;
|
|
}
|
|
|
|
html[data-color-theme='ocean'] {
|
|
--primary: #0ea5e9;
|
|
}
|
|
|
|
html[data-color-theme='forest'] {
|
|
--primary: #10b981;
|
|
}
|
|
|
|
@keyframes fade-in {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(4px);
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
|
|
@layer base {
|
|
* {
|
|
@apply transition-colors duration-150;
|
|
}
|
|
|
|
body {
|
|
@apply bg-slate-50 text-slate-900 font-sans antialiased dark:bg-slate-900 dark:text-slate-100;
|
|
}
|
|
|
|
button:focus-visible {
|
|
@apply outline-none ring-2 ring-[var(--primary)] outline-offset-2;
|
|
}
|
|
|
|
input:focus {
|
|
@apply ring-2 ring-[var(--primary)] border-[var(--primary)] outline-none;
|
|
}
|
|
}
|
|
|
|
@layer components {
|
|
.card {
|
|
@apply bg-white border border-slate-200 rounded-lg shadow-sm dark:bg-slate-800 dark:border-slate-700;
|
|
}
|
|
|
|
.page-enter {
|
|
animation: fade-in 200ms ease-out;
|
|
}
|
|
} |