{blogSelected ? <strong>Blog</strong> : 'Blog'}
</a>
<ul class={blogSelected ? 's active' : 's'}>
- {/* Archive — only render year/post subtree on blog/archive pages */}
+ {/* Archive subtree — always rendered; off-class controls visibility via CSS */}
<li class={`s sub${archiveOff ? ' off' : ''}`}>
<a href="/blog/archive/" class={onArchive ? 's selected' : 's'}>
{onArchive ? <strong>Archive</strong> : 'Archive'}
</a>
- {(onArchive || onBlog) && (
- <ul class={onArchive ? 's active' : 's'}>
- {years.map(year => {
- const active = isActiveYear(year);
- return (
- <li class={`s${onBlog ? ' off' : ''}`}>
- <a href={`/blog/archive/${year}/`} class={active ? 's selected' : 's'}>
- {active ? <strong>{year}</strong> : year}
- </a>
- <ul class="s">
- {postsByYear[year].map(post => {
- const pUrl = postUrl(post);
- const current = pUrl === currentUrl;
- return (
- <li class="s nav-leaf">
- <a href={pUrl} class={current ? 's selected' : 's'}>
- {current ? <strong>{post.data.title}</strong> : post.data.title}
- </a>
- </li>
- );
- })}
- </ul>
- </li>
- );
- })}
- </ul>
- )}
+ <ul class={onArchive ? 's active' : 's'}>
+ {years.map(year => {
+ const active = isActiveYear(year);
+ // Year visible only when: on Archive root (all years are children) or this year is active.
+ // On Blog root, Categories, Tags, outside Blog: all years are off.
+ const yearOff = currentUrl !== '/blog/archive/' && !active;
+ return (
+ <li class={`s${yearOff ? ' off' : ''}`}>
+ <a href={`/blog/archive/${year}/`} class={active ? 's selected' : 's'}>
+ {active ? <strong>{year}</strong> : year}
+ </a>
+ <ul class="s">
+ {postsByYear[year].map(post => {
+ const pUrl = postUrl(post);
+ const current = pUrl === currentUrl;
+ return (
+ <li class="s nav-leaf">
+ <a href={pUrl} class={current ? 's selected' : 's'}>
+ {current ? <strong>{post.data.title}</strong> : post.data.title}
+ </a>
+ </li>
+ );
+ })}
+ </ul>
+ </li>
+ );
+ })}
+ </ul>
</li>
{/* Categories subtree */}
{categories.length > 0 && (