Files
nutty-tools/now-playing/style.css
T
2026-06-28 03:05:29 +10:00

143 lines
2.0 KiB
CSS

body {
font-family: 'Inter', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
font-size: 20px;
color: white;
margin: 0;
}
#main-container {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0.5em;
}
@keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fade-out {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes slide-in-from-top {
0% {
transform: translateY(-1em);
opacity: 0;
}
100% {
transform: translateY(0);
opacity: 1;
}
}
@keyframes slide-in-from-top {
0% {
transform: translateY(-1em);
opacity: 0;
}
100% {
transform: translateY(0);
opacity: 1;
}
}
@keyframes slide-out-top {
0% {
transform: translateY(0);
opacity: 1;
}
100% {
transform: translateY(-1em);
opacity: 0;
}
}
@keyframes slide-in-from-bottom {
0% {
transform: translateY(1em);
opacity: 0;
}
100% {
transform: translateY(0);
opacity: 1;
}
}
@keyframes slide-out-bottom {
0% {
transform: translateY(0);
opacity: 1;
}
100% {
transform: translateY(1em);
opacity: 0;
}
}
@keyframes slide-in-from-left {
0% {
transform: translateX(-1em);
opacity: 0;
}
100% {
transform: translateX(0);
opacity: 1;
}
}
@keyframes slide-out-left {
0% {
transform: translateX(0);
opacity: 1;
}
100% {
transform: translateX(-1em);
opacity: 0;
}
}
@keyframes slide-in-from-right {
0% {
transform: translateX(1em);
opacity: 0;
}
100% {
transform: translateX(0);
opacity: 1;
}
}
@keyframes slide-out-right {
0% {
transform: translateX(0);
opacity: 1;
}
100% {
transform: translateX(1em);
opacity: 0;
}
}