66 lines
1.3 KiB
Plaintext
66 lines
1.3 KiB
Plaintext
---
|
|
import { type Hierarchy } from "../lib/hierarchy.ts";
|
|
|
|
interface Props {
|
|
prefix: string;
|
|
hierarchy: Hierarchy;
|
|
}
|
|
|
|
const { prefix, hierarchy } = Astro.props;
|
|
|
|
const pathname = Astro.url.pathname.replace(import.meta.env.BASE_URL, '/');
|
|
|
|
---
|
|
{
|
|
Object.entries(hierarchy).map(([leader, node]) => {
|
|
const notePath = `${prefix}/${leader}`;
|
|
const isActive = pathname === notePath;
|
|
const linkClasses = isActive ? "active" : "";
|
|
|
|
if (node.children) {
|
|
return (
|
|
<details open={pathname.startsWith(notePath) && "true"}>
|
|
<summary>
|
|
{ node.id
|
|
? <a href={notePath} class={linkClasses}>{node.title || leader}</a>
|
|
: <span class="header-only">{node.title || leader}</span>
|
|
}
|
|
</summary>
|
|
<div class="child-notes">
|
|
{ <Astro.self prefix={notePath} hierarchy={node.children} /> }
|
|
</div>
|
|
</details>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div>
|
|
<a href={notePath} class={linkClasses}>
|
|
{node.title || leader}
|
|
</a>
|
|
</div>
|
|
);
|
|
})
|
|
}
|
|
|
|
<style>
|
|
.active {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.child-notes {
|
|
margin-left: 1em;
|
|
}
|
|
|
|
summary {
|
|
.header-only {
|
|
color: var(--color-gray)
|
|
}
|
|
|
|
&:hover {
|
|
color: var(--color-gold);
|
|
}
|
|
}
|
|
|
|
</style>
|