为 Fumadocs UI 添加主题
注意只支持 Tailwind CSS v4：
MkSaaS文档@import 'tailwindcss';
@import 'fumadocs-ui/css/neutral.css';
@import 'fumadocs-ui/css/preset.css';
/* path of `fumadocs-ui` relative to the CSS file */
@source '../node_modules/fumadocs-ui/dist/**/*.js';通过使用 Tailwind CSS 插件或预构建的样式表，您的默认边框、文本和背景颜色将被更改。
Fumadocs 通过 next-themes 支持明/暗模式，它包含在 Root Provider 中。
参见 Root Provider 了解更多信息。
支持 RTL（从右到左）布局。
要启用 RTL，请在 body 和 root provider（Radix UI 需要）中将 dir 属性设置为 rtl。
import { RootProvider }
Fumadocs UI 有自己的颜色、动画和工具。
默认情况下，它添加了 fd- 前缀，以避免与 Shadcn UI 或您自己的 CSS 变量冲突。
您可以通过添加一些别名来使用它们，而无需前缀：
@theme {
--color-primary: var(--color-fd-primary);
}您可以将其与 CSS 媒体查询一起使用，实现响应式设计。
使用 CSS 变量自定义文档布局的最大宽度。
:root {
--fd-layout-width: 1400px;
}Tailwind CSS 预设引入了新的颜色和额外的工具，包括 fd-steps。
它开箱即用地提供了许多主题，您可以选择一个您喜欢的。
@import 'fumadocs-ui/css/<theme>.css';
/* Example */
@import 'fumadocs-ui/css/black.css';
设计系统的灵感来自 Shadcn UI，您可以使用 CSS 变量轻松自定义颜色。
:root {
--color-fd-background: hsl(0, 0%, 100%);
}
.dark {
--color-fd-background: hsl(0, 0%, 0%);
}我们有一个内置插件，它是从 Tailwind CSS Typography 派生而来的。
该插件添加了一个 prose 类和变体来自定义它。
<div
该插件仅与 Fumadocs UI 的 MDX 组件一起工作，它可能与 @tailwindcss/typography 冲突。
如果您需要使用 @tailwindcss/typography 而不是默认插件，请设置类名选项以避免冲突。