Layouts
Documentation layout components
fromsrc provides layout components for building documentation structure.
Docs layout
Wrap your docs pages in a layout that includes sidebar, search, and mobile navigation.
Sidebar
Navigation sidebar with collapsible sections.
Props
| prop | type | default | description |
|---|---|---|---|
| title | string | required | site title |
| logo | ReactNode | - | logo element |
| navigation | SidebarSection[] | required | navigation structure |
| basePath | string | "/docs" | base path for links |
| github | string | - | GitHub repo URL |
| collapsible | boolean | false | enable collapse toggle |
| defaultOpenLevel | number | 0 | auto-expand folders to depth |
Navigation structure
Example
Mobile navigation
Slide-out drawer for mobile devices.
Props
| prop | type | default | description |
|---|---|---|---|
| title | string | required | site title |
| logo | ReactNode | - | logo element |
| navigation | SidebarSection[] | required | navigation structure |
| docs | DocMeta[] | required | docs for search |
| basePath | string | "/docs" | base path for links |
| github | string | - | GitHub repo URL |
Example
Root layout
Standard Next.js root layout with fonts and metadata.