fixed table of contents sticking on all pages; more minor changes
This commit is contained in:
@@ -1,6 +1,12 @@
|
||||
<script lang="ts">
|
||||
import {onMount} from 'svelte';
|
||||
|
||||
let {
|
||||
disableStickyScrolling,
|
||||
}: {
|
||||
disableStickyScrolling?: boolean;
|
||||
} = $props();
|
||||
|
||||
let idCounter: number = 0;
|
||||
|
||||
let container: HTMLElement;
|
||||
@@ -46,9 +52,15 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
{#if disableStickyScrolling}
|
||||
<div class="toc-container notched">
|
||||
<ul class="toc-list" bind:this={container}></ul>
|
||||
</div>
|
||||
{:else}
|
||||
<div class="toc-container notched sticky-toc">
|
||||
<ul class="toc-list" bind:this={container}></ul>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<style>
|
||||
:global {
|
||||
@@ -59,6 +71,9 @@
|
||||
|
||||
background-color: var(--color-background-highlight);
|
||||
padding: 16px 0;
|
||||
}
|
||||
|
||||
.sticky-toc {
|
||||
position: sticky;
|
||||
top: 20px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user