Files
create-better-t-stack/apps/web/src/app/global.css

90 lines
1.7 KiB
CSS

@import "tailwindcss";
@import "fumadocs-ui/css/ocean.css";
@import "fumadocs-ui/css/preset.css";
@source '../../../../node_modules/fumadocs-ui/dist/**/*.js';
@custom-variant dark (&:where(.dark, .dark *));
.bg-noise {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%' height='100%' filter='url(%23noise)' opacity='0.4'/%3E%3C/svg%3E");
}
.shiny-text {
background: linear-gradient(
120deg,
rgba(255, 255, 255, 0) 40%,
rgba(255, 255, 255, 0.8) 50%,
rgba(255, 255, 255, 0) 60%
);
background-size: 200% 100%;
-webkit-background-clip: text;
background-clip: text;
display: inline-block;
animation: shine 5s linear infinite;
}
@keyframes shine {
0% {
background-position: 100%;
}
100% {
background-position: -100%;
}
}
.shiny-text.disabled {
animation: none;
}
@keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.animate-fadeIn {
opacity: 0;
animation: fadeInUp 0.5s ease-out forwards;
}
.border-beam {
animation: border-beam 3s linear infinite;
}
@keyframes border-beam {
0% {
background-position: 0% 50%;
}
100% {
background-position: 200% 50%;
}
}
/* custom scrollbar */
::-webkit-scrollbar {
width: 8px;
}
::-webkit-scrollbar-track {
background: rgba(16, 0, 16, 0.493);
border-radius: 4px;
}
::-webkit-scrollbar-thumb {
background: linear-gradient(45deg, #666, #888);
border-radius: 4px;
border: 2px solid #1a1a1a;
transition: background 0.3s ease;
}
::-webkit-scrollbar-thumb:hover {
background: linear-gradient(45deg, #888, #aaa);
}