85 lines
1.6 KiB
CSS
85 lines
1.6 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
@layer base {
|
|
html {
|
|
scroll-behavior: smooth;
|
|
}
|
|
|
|
body {
|
|
@apply bg-white text-slate-800 font-serif antialiased selection:bg-slate-900 selection:text-white;
|
|
line-height: 1.6;
|
|
}
|
|
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6 {
|
|
@apply font-sans font-bold text-slate-900 tracking-tighter;
|
|
}
|
|
|
|
p {
|
|
@apply mb-4 text-base leading-relaxed text-slate-700;
|
|
}
|
|
|
|
a {
|
|
@apply text-slate-900 hover:text-slate-700 transition-colors no-underline;
|
|
}
|
|
}
|
|
|
|
@layer components {
|
|
.narrow-container {
|
|
@apply max-w-4xl mx-auto px-6 py-10;
|
|
}
|
|
|
|
.btn {
|
|
@apply inline-flex items-center justify-center px-6 py-3 border border-slate-200 bg-white text-slate-600 font-sans font-bold text-sm uppercase tracking-widest rounded-full transition-all duration-500 ease-industrial hover:border-slate-400 hover:text-slate-900 hover:bg-slate-50 hover:-translate-y-0.5 hover:shadow-xl hover:shadow-slate-100 active:translate-y-0 active:shadow-sm;
|
|
}
|
|
|
|
.btn-primary {
|
|
@apply border-slate-900 text-slate-900 hover:bg-slate-900 hover:text-white;
|
|
}
|
|
}
|
|
|
|
/* Custom scrollbar */
|
|
::-webkit-scrollbar {
|
|
width: 8px;
|
|
height: 8px;
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
background: #f1f5f9;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
background: #cbd5e1;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:hover {
|
|
background: #94a3b8;
|
|
}
|
|
|
|
/* Animations */
|
|
@keyframes shake {
|
|
0%,
|
|
100% {
|
|
transform: translateX(0);
|
|
}
|
|
|
|
25% {
|
|
transform: translateX(-4px);
|
|
}
|
|
|
|
75% {
|
|
transform: translateX(4px);
|
|
}
|
|
}
|
|
|
|
.animate-shake {
|
|
animation: shake 0.2s ease-in-out 0s 2;
|
|
}
|