72 lines
1.5 KiB
CSS
72 lines
1.5 KiB
CSS
@import "tailwindcss";
|
|
|
|
@theme {
|
|
--font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
|
|
--font-display: "Outfit", "Inter", sans-serif;
|
|
}
|
|
|
|
@layer base {
|
|
body {
|
|
@apply bg-white text-gray-900 antialiased;
|
|
}
|
|
}
|
|
|
|
@layer utilities {
|
|
.gemini-shadow {
|
|
box-shadow: 0 0 20px rgba(66, 133, 244, 0.08),
|
|
0 0 40px rgba(219, 68, 55, 0.04),
|
|
0 0 60px rgba(244, 180, 0, 0.04),
|
|
0 0 80px rgba(15, 157, 88, 0.04);
|
|
}
|
|
|
|
.gemini-gradient-border {
|
|
position: relative;
|
|
background: white;
|
|
border-radius: 1.5rem; /* rounded-3xl */
|
|
z-index: 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.gemini-gradient-border::before {
|
|
content: '';
|
|
position: absolute;
|
|
width: 150%;
|
|
height: 150%;
|
|
top: -25%;
|
|
left: -25%;
|
|
background: conic-gradient(
|
|
from 0deg,
|
|
transparent 0deg,
|
|
transparent 90deg,
|
|
#4285F4 120deg,
|
|
#DB4437 150deg,
|
|
#F4B400 180deg,
|
|
#0F9D58 210deg,
|
|
transparent 240deg
|
|
);
|
|
z-index: -2;
|
|
animation: rotate 3s linear infinite;
|
|
filter: blur(15px);
|
|
}
|
|
|
|
.gemini-gradient-border::after {
|
|
content: '';
|
|
position: absolute;
|
|
inset: 1.5px; /* The "thickness" of the glow border */
|
|
background: white;
|
|
border-radius: calc(1.5rem - 1px);
|
|
z-index: -1;
|
|
}
|
|
|
|
@keyframes rotate {
|
|
from {
|
|
transform: rotate(0deg);
|
|
}
|
|
to {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
}
|
|
|
|
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Outfit:wght@400;500;600&display=swap');
|