112 lines
2.4 KiB
CSS
112 lines
2.4 KiB
CSS
@import 'tailwindcss';
|
|
|
|
@plugin 'tailwindcss-animate';
|
|
@plugin '@tailwindcss/typography';
|
|
|
|
@custom-variant dark (&:is(.dark *));
|
|
|
|
@theme {
|
|
--font-*: initial;
|
|
--font-sans: Helvetica, Arial, sans-serif;
|
|
|
|
--color-border: #eee;
|
|
--color-input: #00adb5;
|
|
--color-ring: #00adb5;
|
|
--color-background: #222831;
|
|
--color-foreground: #eee;
|
|
|
|
--color-primary: #00adb5;
|
|
--color-primary-foreground: #000;
|
|
|
|
--color-secondary: #393e46;
|
|
--color-secondary-foreground: #eee;
|
|
|
|
--color-destructive: #ff2e63;
|
|
--color-destructive-foreground: #eee;
|
|
|
|
--color-muted: #393e46;
|
|
--color-muted-foreground: #eee;
|
|
|
|
--color-accent: #00adb5;
|
|
--color-accent-foreground: #eee;
|
|
|
|
--color-popover: #393e46;
|
|
--color-popover-foreground: #eee;
|
|
|
|
--color-card: #393e46;
|
|
--color-card-foreground: #eee;
|
|
|
|
--radius-lg: 8px;
|
|
--radius-md: 4px;
|
|
--radius-sm: 2px;
|
|
}
|
|
|
|
@utility container {
|
|
margin-inline: auto;
|
|
padding-inline: 2rem;
|
|
@media (width >= --theme(--breakpoint-sm)) {
|
|
max-width: none;
|
|
}
|
|
@media (width >= 1400px) {
|
|
max-width: 1400px;
|
|
}
|
|
}
|
|
|
|
/*
|
|
The default border color has changed to `currentColor` in Tailwind CSS v4,
|
|
so we've added these compatibility styles to make sure everything still
|
|
looks the same as it did with Tailwind CSS v3.
|
|
|
|
If we ever want to remove these styles, we need to add an explicit border
|
|
color utility to any element that depends on these defaults.
|
|
*/
|
|
@layer base {
|
|
*,
|
|
::after,
|
|
::before,
|
|
::backdrop,
|
|
::file-selector-button {
|
|
border-color: var(--color-gray-200, currentColor);
|
|
}
|
|
}
|
|
|
|
@layer base {
|
|
* {
|
|
@apply border-border;
|
|
scroll-margin-top: 60px;
|
|
}
|
|
body {
|
|
@apply bg-background text-foreground;
|
|
}
|
|
.prose {
|
|
@apply max-w-none;
|
|
}
|
|
li {
|
|
overflow-wrap: break-word
|
|
}
|
|
[data-rehype-pretty-code-figure] {
|
|
@apply bg-[#1e1e2e] rounded-md pt-4;
|
|
}
|
|
[data-rehype-pretty-code-figure] figcaption {
|
|
@apply m-0 mb-2 px-4 pb-4 border-b-[0.5px] border-secondary;
|
|
}
|
|
[data-rehype-pretty-code-figure] pre {
|
|
@apply py-3 px-4;
|
|
}
|
|
[data-rehype-pretty-code-figure] pre > code > span {
|
|
@apply pr-4;
|
|
}
|
|
[data-rehype-pretty-code-fragment] {
|
|
@apply relative my-5 rounded-md border border-border/20 bg-[#282c34];
|
|
}
|
|
code::after, code::before {
|
|
display: none;
|
|
}
|
|
.prose code {
|
|
@apply rounded-md border border-border/20 font-normal p-0.5 bg-secondary before:content-none after:content-none;
|
|
}
|
|
.prose pre > code {
|
|
@apply bg-transparent border-none;
|
|
}
|
|
}
|