replaced manually-added table of contents with automatic ContentSidebar toc where needed

This commit is contained in:
2026-04-26 22:22:29 +02:00
parent b24712ef4c
commit 3586d7eece
5 changed files with 21 additions and 40 deletions

View File

@@ -14,12 +14,10 @@
} = $props();
</script>
<div class="banner-container">
<div class="container">
<Banner2 content={bannerContent}/>
</div>
<div class="content">
<div class="content">
<div class="main">
<ScrollTopButton />
{@render children()}
@@ -27,20 +25,20 @@
<div class="side">
<TableOfContents type="side" />
</div>
</div>
</div>
<style>
.banner-container {
.container {
width: var(--page-width);
margin: 0 auto;
padding: 0 24px;
box-sizing: border-box;
}
.content {
max-width: var(--page-width);
margin: 0 auto;
display: flex;
flex-direction: row;
padding: 0 24px;
}
.side {
width: fit-content;

View File

@@ -1,7 +1,5 @@
<script>
import Banner2 from "$lib/banner2.svelte";
import Content from "$lib/viewport/content.svelte";
import TableOfContents from "$lib/components/table-of-contents.svelte";
import ContentSidebar from "$lib/viewport/content-sidebar.svelte";
export let data;
</script>
@@ -12,7 +10,7 @@
<meta name="DCTERMS.created" content="{data.date}T{data.time}">
</svelte:head>
<Content bannerContent={{
<ContentSidebar bannerContent={{
title: data.title,
subtitle: data.subtitle,
date: data.date,
@@ -22,8 +20,6 @@
tags: data.tags,
}}>
<!-- <TableOfContents /> -->
<svelte:component this={data.content} />
</Content>
</ContentSidebar>

View File

@@ -1,8 +1,6 @@
<script lang="ts">
import Content from "$lib/viewport/content.svelte";
import Banner2 from "$lib/banner2.svelte";
import TableOfContents from "$lib/components/table-of-contents.svelte";
import ImageRow from "$lib/media/image-row.svelte";
import ContentSidebar from "$lib/viewport/content-sidebar.svelte";
export let data;
</script>
@@ -31,7 +29,7 @@
</div>
{/snippet}
<Content bannerContent={{
<ContentSidebar bannerContent={{
title: "Creative Feed",
banner: "banner.webp",
bannerAlt: "A blue screen with the text 'how do you do art ? 1. face your fears 2. become your heroes'. The 'art' looks to have been edited in. The music artist Porter Robinson is standing in the bottom right corner.",
@@ -42,8 +40,6 @@
<p>This page is intended to be a contrasting companion to the <a href="/projects"><code>projects</code> page</a>; I'll use this page for smaller things that don't fit the dedicated-page-format.</p>
<!-- <TableOfContents /> -->
{@render pageButtons(data.currentPage)}
{#each data.feedPosts as post}
@@ -61,7 +57,7 @@
{@render pageButtons(data.currentPage)}
</Content>
</ContentSidebar>
<style>
.page-button-container {

View File

@@ -1,8 +1,5 @@
<script>
import Banner2 from "$lib/banner2.svelte";
import ContentSidebar from "$lib/viewport/content-sidebar.svelte";
import Content from "$lib/viewport/content.svelte";
// import TableOfContents from "$lib/components/table-of-contents.svelte";
export let data;
</script>
@@ -22,8 +19,6 @@
bannerAlt: data.projectDetails.bannerAlt,
}}>
<!-- <TableOfContents /> -->
{#if data.projectDetails.links.length > 0}
<div class="link-button-container">
{#each data.projectDetails.links as l}

View File

@@ -1,7 +1,5 @@
<script>
import Banner2 from "$lib/banner2.svelte";
import Content from "$lib/viewport/content.svelte";
import TableOfContents from "$lib/components/table-of-contents.svelte";
import ContentSidebar from "$lib/viewport/content-sidebar.svelte";
export let data;
</script>
@@ -12,7 +10,7 @@
<meta name="DCTERMS.created" content="{data.date}">
</svelte:head>
<Content bannerContent={{
<ContentSidebar bannerContent={{
title: data.title,
subtitle: "Homesick Devlog",
date: data.date,
@@ -20,8 +18,6 @@
bannerAlt: data.bannerAlt,
}}>
<!-- <TableOfContents /> -->
<svelte:component this={data.content} />
</Content>
</ContentSidebar>