prmbr-image-mksaas/content/docs/layouts/notebook.mdx
2025-06-09 00:21:43 +08:00

33 lines
800 B
Plaintext

---
title: Notebook
description: A more compact version of Docs Layout
---
## Usage
Enable the notebook layout with `fumadocs-ui/layouts/notebook`, it's a more compact layout than the default one.
![Notebook](/images/docs/notebook.png)
```tsx title="layout.tsx"
import { DocsLayout } from 'fumadocs-ui/layouts/notebook';
import { baseOptions } from '@/app/layout.config';
import { source } from '@/lib/source';
import type { ReactNode } from 'react';
export default function Layout({ children }: { children: ReactNode }) {
return (
<DocsLayout
{...baseOptions}
// the position of navbar
nav={{ ...baseOptions.nav, mode: 'top' }}
// the position of Sidebar Tabs
tabMode="navbar"
tree={source.pageTree}
>
{children}
</DocsLayout>
);
}
```