diff --git a/apps/documentation/src/components/sidebar/sidebar.tsx b/apps/documentation/src/components/sidebar/sidebar.tsx
index 22be5bf0..883699bf 100644
--- a/apps/documentation/src/components/sidebar/sidebar.tsx
+++ b/apps/documentation/src/components/sidebar/sidebar.tsx
@@ -1,7 +1,7 @@
import { AppShell, NavLink } from '@mantine/core'
import { Link } from 'tuono'
-export default function Sidebar(): JSX.Element {
+export default function Sidebar({ close }: { close: () => void }): JSX.Element {
return (
Tutorial
@@ -9,24 +9,28 @@ export default function Sidebar(): JSX.Element {
href="/documentation/tutorial/intro"
component={Link}
label="Intro"
+ onClick={close}
/>
Documentation
)
diff --git a/apps/documentation/src/routes/__root.tsx b/apps/documentation/src/routes/__root.tsx
index b063f980..619240c2 100644
--- a/apps/documentation/src/routes/__root.tsx
+++ b/apps/documentation/src/routes/__root.tsx
@@ -6,11 +6,12 @@ import {
AppShell,
} from '@mantine/core'
import { useDisclosure } from '@mantine/hooks'
-import { Head } from 'tuono'
+import { Head, useRouter } from 'tuono'
import Navbar from '../components/navbar'
import '@mantine/core/styles.css'
import '@mantine/code-highlight/styles.css'
+import Sidebar from '../components/sidebar'
interface RootRouteProps {
children: ReactNode
@@ -52,6 +53,8 @@ const theme = createTheme({
export default function RootRoute({ children }: RootRouteProps): JSX.Element {
const [opened, { toggle }] = useDisclosure()
+ const { pathname } = useRouter()
+
return (
<>
@@ -67,6 +70,7 @@ export default function RootRoute({ children }: RootRouteProps): JSX.Element {
}}
>
+ {pathname.startsWith('/documentation') && }
{children}
diff --git a/apps/documentation/src/routes/documentation/__root.tsx b/apps/documentation/src/routes/documentation/__root.tsx
index 63e7ae01..608fafe5 100644
--- a/apps/documentation/src/routes/documentation/__root.tsx
+++ b/apps/documentation/src/routes/documentation/__root.tsx
@@ -1,7 +1,6 @@
import type { ReactNode } from 'react'
import { AppShell, Container } from '@mantine/core'
import MdxProvider from '../../components/mdx-provider'
-import Sidebar from '../../components/sidebar'
import EditPage from '../../components/edit-page'
interface RootRouteProps {
@@ -10,14 +9,11 @@ interface RootRouteProps {
export default function RootRoute({ children }: RootRouteProps): JSX.Element {
return (
- <>
-
-
-
- {children}
-
-
-
- >
+
+
+ {children}
+
+
+
)
}