flux-klein-web / src /app.css
radames's picture
initial commit
9c78030
Raw
History Blame Contribute Delete
1.21 kB
@import 'tailwindcss';
/* Dark by default: the `dark:` variant follows the .dark class on <html>, not the OS setting. */
@custom-variant dark (&:where(.dark, .dark *));
/* Essentially black and white, dark by default: near-black page + white ink (light palette kept under the .dark class switch). */
@theme {
--font-sans:
'Open Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
--color-ink: #111111;
--color-void: #0a0a0a;
}
@layer base {
html,
body {
margin: 0;
height: 100%;
}
body {
@apply bg-white text-[color:var(--color-ink)] antialiased dark:bg-[color:var(--color-void)] dark:text-white;
font-size: 15px;
line-height: 1.45;
overscroll-behavior: none;
color-scheme: dark;
}
button,
input,
select,
textarea {
font: inherit;
color: inherit;
}
button {
cursor: pointer;
}
button:disabled {
cursor: default;
opacity: 0.55;
}
:focus-visible {
outline: 2px solid currentColor;
outline-offset: 2px;
}
.num {
font-variant-numeric: tabular-nums;
}
}
@media (prefers-reduced-motion: reduce) {
* {
transition: none !important;
animation: none !important;
}
}