mirror of
https://github.com/LukeHagar/website.git
synced 2025-12-07 12:57:49 +00:00
@@ -1,5 +1,20 @@
|
|||||||
|
<script lang="ts" context="module">
|
||||||
|
export type TocItem = {
|
||||||
|
title: string;
|
||||||
|
href: string;
|
||||||
|
step?: number;
|
||||||
|
selected?: boolean;
|
||||||
|
level?: number;
|
||||||
|
children?: Array<{
|
||||||
|
title: string;
|
||||||
|
href: string;
|
||||||
|
selected: boolean;
|
||||||
|
level?: number;
|
||||||
|
}>;
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import type { TocItem } from '$lib/layouts/DocsArticle.svelte';
|
|
||||||
import { classNames } from '$lib/utils/classnames';
|
import { classNames } from '$lib/utils/classnames';
|
||||||
import { fade } from 'svelte/transition';
|
import { fade } from 'svelte/transition';
|
||||||
|
|
||||||
@@ -9,14 +24,16 @@
|
|||||||
|
|
||||||
let isScrolled: boolean = false;
|
let isScrolled: boolean = false;
|
||||||
|
|
||||||
window.addEventListener('scroll', () => {
|
const handleIsScrolled = () => {
|
||||||
isScrolled = !!window.scrollY;
|
isScrolled = !!window.scrollY;
|
||||||
});
|
};
|
||||||
|
|
||||||
export let toc: Array<TocItem> = [];
|
export let toc: Array<TocItem> = [];
|
||||||
export let heading: string = 'Table of Contents';
|
export let heading: string = 'Table of Contents';
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<svelte:window on:scroll={handleIsScrolled} />
|
||||||
|
|
||||||
<nav class="sticky top-32 col-span-3 mt-2 -ml-4 hidden h-[800px] flex-col gap-6 lg:flex">
|
<nav class="sticky top-32 col-span-3 mt-2 -ml-4 hidden h-[800px] flex-col gap-6 lg:flex">
|
||||||
<span class="text-micro tracking-loose text-primary font-aeonik-fono ps-6 uppercase"
|
<span class="text-micro tracking-loose text-primary font-aeonik-fono ps-6 uppercase"
|
||||||
>{heading}</span
|
>{heading}</span
|
||||||
|
|||||||
@@ -18,7 +18,6 @@
|
|||||||
import { setContext } from 'svelte';
|
import { setContext } from 'svelte';
|
||||||
import { writable } from 'svelte/store';
|
import { writable } from 'svelte/store';
|
||||||
import { Feedback } from '$lib/components';
|
import { Feedback } from '$lib/components';
|
||||||
import { scrollToTop } from '$lib/actions/scrollToTop';
|
|
||||||
import TableOfContents from '$lib/components/blog/table-of-contents.svelte';
|
import TableOfContents from '$lib/components/blog/table-of-contents.svelte';
|
||||||
|
|
||||||
export let title: string;
|
export let title: string;
|
||||||
|
|||||||
Reference in New Issue
Block a user