globals.css•1.5 kB
@tailwind base;
@tailwind components;
@tailwind utilities;
/* Global styles for prose content */
p {
@apply text-gray-800 leading-relaxed;
}
.prose p {
@apply text-gray-800 leading-relaxed;
}
.prose li {
@apply text-gray-800 font-medium;
}
/* Style for inline code, but not code blocks */
.prose code:not(pre code) {
@apply bg-gray-100 text-nix-dark px-1.5 py-0.5 rounded font-medium;
}
/* Ensure syntax highlighting in code blocks is not affected by global styles */
.prose pre {
@apply p-0 m-0 overflow-hidden rounded-lg;
}
.prose pre code {
@apply bg-transparent p-0 text-inherit;
}
:root {
--foreground-rgb: 0, 0, 0;
--background-start-rgb: 240, 240, 245;
--background-end-rgb: 255, 255, 255;
}
@media (prefers-color-scheme: dark) {
:root {
--foreground-rgb: 255, 255, 255;
--background-start-rgb: 0, 0, 0;
--background-end-rgb: 30, 30, 40;
}
}
body {
color: rgb(var(--foreground-rgb));
background: linear-gradient(
to bottom,
transparent,
rgb(var(--background-end-rgb))
)
rgb(var(--background-start-rgb));
}
@layer components {
.btn-primary {
@apply px-4 py-2 bg-nix-primary text-white rounded-md hover:bg-nix-dark transition-colors font-medium shadow-sm;
}
.btn-secondary {
@apply px-4 py-2 border border-nix-primary text-nix-primary rounded-md hover:bg-nix-light transition-colors font-medium shadow-sm;
}
.container-custom {
@apply container mx-auto px-4 md:px-6 lg:px-8 max-w-7xl;
}
}