60 lines
1.2 KiB
CSS
60 lines
1.2 KiB
CSS
@import 'tailwindcss';
|
|
|
|
@theme {
|
|
--font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif,
|
|
'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
|
|
|
|
--animate-flip: flip 6s infinite steps(2, end);
|
|
--animate-rotate: rotate 3s linear infinite both;
|
|
|
|
@keyframes flip {
|
|
to {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@keyframes rotate {
|
|
to {
|
|
transform: rotate(90deg);
|
|
}
|
|
}
|
|
}
|
|
|
|
/*
|
|
The default border color has changed to `currentColor` in Tailwind CSS v4,
|
|
so we've added these compatibility styles to make sure everything still
|
|
looks the same as it did with Tailwind CSS v3.
|
|
|
|
If we ever want to remove these styles, we need to add an explicit border
|
|
color utility to any element that depends on these defaults.
|
|
*/
|
|
@layer base {
|
|
*,
|
|
::after,
|
|
::before,
|
|
::backdrop,
|
|
::file-selector-button {
|
|
border-color: var(--color-gray-200, currentColor);
|
|
}
|
|
}
|
|
|
|
html,
|
|
body {
|
|
background-color: #0a0a0a;
|
|
color-scheme: dark;
|
|
height: 100%;
|
|
}
|
|
|
|
#avatar {
|
|
display: inline-block;
|
|
font-size: 100px;
|
|
transition: transform 0.5s linear;
|
|
}
|
|
|
|
@keyframes rotate {
|
|
0% {
|
|
transform: rotate(var(--rotate-angle, 0deg));
|
|
}
|
|
100% {
|
|
transform: rotate(calc(var(--rotate-angle, 0deg) + 360deg));
|
|
}
|
|
}
|