on master help sign in
understanding-urbit: add intro to sidebar
ed3d3d9Matilde Park
pages/understanding-urbit/[[...slug]].js+18−1
@@ -36,7 +36,7 @@ const breadcrumbs = (posts, paths) => {
36};
36};
37
37
38const childPages = (thisLink, children, level = 0) => (
38const childPages = (thisLink, children, level = 0) => (
39− <ul className="pl-1">
39+ <ul>
40 {children?.map((child) => (
40 {children?.map((child) => (
41 <li>{pageTree(join(thisLink, child.slug), child, level)}</li>
41 <li>{pageTree(join(thisLink, child.slug), child, level)}</li>
42 ))}
42 ))}
@@ -74,6 +74,14 @@ export default function UnderstandingLayout({
74 previousPost,
74 previousPost,
75 nextPost,
75 nextPost,
76}) {
76}) {
77+ const router = useRouter();
78+ const isSelected = "/understanding-urbit".includes(router.asPath);
79+ const selectedClasses = classnames({
80+ dot: isSelected,
81+ "text-green": isSelected,
82+ "text-black": !isSelected,
83+ });
84+ const rootClasses = "pl-4 text-base hover:text-green";
77 return (
85 return (
78 <>
86 <>
79 <Head>
87 <Head>
@@ -82,6 +90,15 @@ export default function UnderstandingLayout({
82 </Head>
90 </Head>
83 <div className="flex w-screen h-screen min-h-screen w-screen sidebar">
91 <div className="flex w-screen h-screen min-h-screen w-screen sidebar">
84 <Sidebar search={search}>
92 <Sidebar search={search}>
93+ <ul>
94+ <li>
95+ <Link href="/understanding-urbit">
96+ <a className={`relative ${selectedClasses} ${rootClasses}`}>
97+ Introduction
98+ </a>
99+ </Link>
100+ </li>
101+ </ul>
85 {childPages("/understanding-urbit", posts.pages)}
102 {childPages("/understanding-urbit", posts.pages)}
86 </Sidebar>
103 </Sidebar>
87 <ContentArea
104 <ContentArea