2026-09-20 15:53:28 +08:00
|
|
|
@import "@workspace/ui/globals.css";
|
2026-09-20 16:44:15 +08:00
|
|
|
@import "@workspace/media/globals.css";
|
2026-09-20 15:53:28 +08:00
|
|
|
@import "@workspace/search/globals.css";
|
|
|
|
|
|
|
|
|
|
@custom-variant dark (&:where(.dark, .dark *));
|
|
|
|
|
|
|
|
|
|
@layer base {
|
|
|
|
|
*,
|
|
|
|
|
*::before,
|
|
|
|
|
*::after {
|
|
|
|
|
@apply border-slate-200 dark:border-slate-800;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
html {
|
|
|
|
|
@apply antialiased;
|
|
|
|
|
background-color: var(--docs-background-light, var(--color-white));
|
|
|
|
|
color: var(--docs-foreground-light, var(--color-slate-950));
|
|
|
|
|
font-family: "DM Serif Display", Georgia, serif;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
html.dark {
|
|
|
|
|
background-color: var(--docs-background-dark, var(--color-slate-950));
|
|
|
|
|
color: var(--docs-foreground-dark, var(--color-slate-100));
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
:root {
|
|
|
|
|
--background: var(--docs-background-light, var(--color-white));
|
|
|
|
|
--foreground: var(--docs-foreground-light, var(--color-slate-950));
|
|
|
|
|
--card: var(--docs-background-light, var(--color-white));
|
|
|
|
|
--card-foreground: var(--docs-foreground-light, var(--color-slate-950));
|
|
|
|
|
--popover: var(--docs-background-light, var(--color-white));
|
|
|
|
|
--popover-foreground: var(--docs-foreground-light, var(--color-slate-950));
|
|
|
|
|
--primary: var(--color-indigo-600);
|
|
|
|
|
--primary-foreground: var(--color-white);
|
|
|
|
|
--secondary: var(--docs-surface-light, var(--color-slate-100));
|
|
|
|
|
--secondary-foreground: var(
|
|
|
|
|
--docs-foreground-light,
|
|
|
|
|
var(--color-slate-950)
|
|
|
|
|
);
|
|
|
|
|
--muted: var(--docs-surface-light, var(--color-slate-100));
|
|
|
|
|
--muted-foreground: var(--docs-muted-light, var(--color-slate-600));
|
|
|
|
|
--accent: var(--docs-surface-light, var(--color-slate-100));
|
|
|
|
|
--accent-foreground: var(--docs-foreground-light, var(--color-slate-950));
|
|
|
|
|
--border: var(--color-slate-200);
|
|
|
|
|
--input: var(--color-slate-200);
|
|
|
|
|
--ring: var(--color-indigo-500);
|
|
|
|
|
--sidebar: var(--docs-background-light, var(--color-white));
|
|
|
|
|
--sidebar-foreground: var(--docs-foreground-light, var(--color-slate-950));
|
|
|
|
|
--sidebar-border: var(--color-slate-200);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
html.dark {
|
|
|
|
|
--background: var(--docs-background-dark, var(--color-slate-950));
|
|
|
|
|
--foreground: var(--docs-foreground-dark, var(--color-slate-100));
|
|
|
|
|
--card: var(--docs-surface-dark, var(--color-slate-900));
|
|
|
|
|
--card-foreground: var(--docs-foreground-dark, var(--color-slate-100));
|
|
|
|
|
--popover: var(--docs-surface-dark, var(--color-slate-900));
|
|
|
|
|
--popover-foreground: var(--docs-foreground-dark, var(--color-slate-100));
|
|
|
|
|
--primary: var(--color-indigo-400);
|
|
|
|
|
--primary-foreground: var(--color-slate-950);
|
|
|
|
|
--secondary: var(--color-slate-800);
|
|
|
|
|
--secondary-foreground: var(--docs-foreground-dark, var(--color-slate-100));
|
|
|
|
|
--muted: var(--color-slate-800);
|
|
|
|
|
--muted-foreground: var(--docs-muted-dark, var(--color-slate-400));
|
|
|
|
|
--accent: var(--color-slate-800);
|
|
|
|
|
--accent-foreground: var(--docs-foreground-dark, var(--color-slate-100));
|
|
|
|
|
--border: var(--color-slate-800);
|
|
|
|
|
--input: var(--color-slate-700);
|
|
|
|
|
--ring: var(--color-indigo-400);
|
|
|
|
|
--sidebar: var(--docs-surface-dark, var(--color-slate-900));
|
|
|
|
|
--sidebar-foreground: var(--docs-foreground-dark, var(--color-slate-100));
|
|
|
|
|
--sidebar-border: var(--color-slate-800);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
body,
|
|
|
|
|
#root {
|
|
|
|
|
@apply min-h-dvh;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
body {
|
|
|
|
|
@apply bg-inherit text-inherit;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
::selection {
|
|
|
|
|
@apply bg-indigo-200 text-indigo-950 dark:bg-indigo-500/40 dark:text-indigo-50;
|
|
|
|
|
}
|
|
|
|
|
}
|
