File size: 2,630 Bytes
abd4352 c5f9c5f abd4352 c5f9c5f abd4352 c5f9c5f abd4352 c5f9c5f abd4352 c5f9c5f abd4352 c5f9c5f abd4352 c5f9c5f abd4352 c5f9c5f abd4352 c5f9c5f abd4352 c5f9c5f abd4352 c5f9c5f abd4352 c5f9c5f abd4352 c5f9c5f abd4352 c5f9c5f abd4352 c5f9c5f abd4352 c5f9c5f | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 | @tailwind base;
@tailwind components;
@tailwind utilities;
@layer base {
* { box-sizing: border-box; }
body {
@apply font-sans antialiased text-neutral-200 bg-[#09090b] selection:bg-neutral-800;
background-image:
radial-gradient(circle at 50% -20%, rgba(120, 119, 198, 0.05) 0%, transparent 50%),
radial-gradient(circle at 15% 50%, rgba(255, 255, 255, 0.005) 0%, transparent 35%);
background-attachment: fixed;
}
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { @apply bg-[#09090b]; }
::-webkit-scrollbar-thumb { @apply bg-neutral-800 hover:bg-neutral-700 rounded-full transition-colors; }
}
@layer components {
/* Premium Minimalistic Card */
.card {
@apply bg-[#0e0e11] border border-neutral-800/80 rounded-xl shadow-xl transition-all duration-300 relative overflow-hidden;
}
.card:hover {
@apply border-neutral-700/80 shadow-[0_8px_30px_rgb(0,0,0,0.6)] transform -translate-y-[1px];
}
/* Buttons - Monochromatic Premium Theme */
.btn-primary {
@apply inline-flex items-center justify-center gap-2 px-5 py-2
bg-neutral-100 hover:bg-neutral-200 text-neutral-950 font-medium text-sm rounded-lg
transition-all duration-200 active:scale-[0.98]
disabled:opacity-50 disabled:cursor-not-allowed shadow-md;
}
.btn-ghost {
@apply inline-flex items-center gap-2 px-4 py-2 text-neutral-400 hover:text-neutral-100
hover:bg-neutral-900 border border-transparent hover:border-neutral-800 text-sm rounded-lg transition-all duration-200 active:scale-[0.98];
}
/* Badges - Monochromatic & Muted Slate */
.badge {
@apply inline-flex items-center px-2.5 py-0.5 rounded-md text-xs font-medium border tracking-tight;
}
.badge-sql { @apply bg-neutral-900/80 text-neutral-300 border-neutral-800; }
.badge-pandas { @apply bg-neutral-900/80 text-neutral-300 border-neutral-800; }
.badge-cache { @apply bg-neutral-900/80 text-neutral-300 border-neutral-800; }
/* Custom Inputs */
.input-premium {
@apply bg-neutral-950 border border-neutral-800 rounded-lg px-3.5 py-2 text-neutral-200
focus:outline-none focus:ring-1 focus:ring-neutral-700 focus:border-neutral-700
transition-all duration-200 placeholder:text-neutral-600 text-sm;
}
}
@layer utilities {
.text-gradient {
@apply bg-clip-text text-transparent bg-gradient-to-b from-white to-neutral-400;
}
.animate-float {
animation: float 6s ease-in-out infinite;
}
}
@keyframes float {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-4px); }
}
|