@@ -36,7 +36,7 @@ const breadcrumbs = (posts, paths) => {
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>
@@ -74,6 +74,14 @@ export default function UnderstandingLayout({
74 previousPost,
74 previousPost,
77+ const router = useRouter();
78+ const isSelected = "/understanding-urbit".includes(router.asPath);
79+ const selectedClasses = classnames({
81+ "text-green": isSelected,
82+ "text-black": !isSelected,
84+ const rootClasses = "pl-4 text-base hover:text-green";
@@ -82,6 +90,15 @@ export default function UnderstandingLayout({
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}>
95+ <Link href="/understanding-urbit">
96+ <a className={`relative ${selectedClasses} ${rootClasses}`}>
85 {childPages("/understanding-urbit", posts.pages)}
102 {childPages("/understanding-urbit", posts.pages)}
86 </Sidebar>
103 </Sidebar>
87 <ContentArea
104 <ContentArea