From bb98d5e270c0fe9c1181efdda9b9a8b34005f098 Mon Sep 17 00:00:00 2001
From: Jesse Winton <jesse@appwrite.io>
Date: Mon, 17 Mar 2025 10:48:45 -0400
Subject: [PATCH 1/2] consistent table of contents
---
src/lib/components/blog/table-of-contents.svelte | 12 ++++++------
1 file changed, 6 insertions(+), 6 deletions(-)
diff --git a/src/lib/components/blog/table-of-contents.svelte b/src/lib/components/blog/table-of-contents.svelte
index 788d5e6ff1..ca9787fe8a 100644
--- a/src/lib/components/blog/table-of-contents.svelte
+++ b/src/lib/components/blog/table-of-contents.svelte
@@ -9,21 +9,21 @@
export let toc: Array<TocItem> = [];
</script>
-<nav class="sticky top-32 col-span-3 -ml-4 hidden h-[800px] lg:block">
- <span class="text-micro tracking-loose text-primary pl-8 uppercase">Table of Contents</span>
+<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 text-primary ps-6 uppercase tracking-tighter">Table of Contents</span>
<div class="relative">
<ul
- class="border-smooth mask mt-11 flex max-h-[600px] flex-col gap-7 overflow-scroll border-b pb-11 [scrollbar-width:none]"
+ class="border-smooth mask text-caption flex max-h-[600px] flex-col gap-4 overflow-scroll border-b pb-11 [scrollbar-width:none]"
>
{#each toc as parent (parent.href)}
<li
class={classNames(
parent.selected ? 'text-primary' : 'text-secondary',
- 'relative pl-7 transition-colors',
- 'before:bg-primary before:absolute before:top-0 before:left-0 before:h-6 before:w-px before:rounded-full before:opacity-0 before:transition-opacity',
+ 'relative ps-6 transition-colors',
+ 'before:bg-greyscale-300 before:absolute before:top-0 before:left-0 before:h-6 before:w-px before:rounded-full before:opacity-0 before:transition-opacity',
{
'font-medium': parent.level && parent.level === 1,
- 'pl-11': parent.level && parent.level === 2,
+ 'ps-6': parent.level && parent.level === 2,
'pl-16': parent.level && parent.level >= 3,
'before:opacity-100': parent.selected
}
From 2af0a9ccd415be26a721ecd7588b64a13ebde655 Mon Sep 17 00:00:00 2001
From: Jesse Winton <jesse@appwrite.io>
Date: Mon, 17 Mar 2025 10:50:45 -0400
Subject: [PATCH 2/2] Update table-of-contents.svelte
---
src/lib/components/blog/table-of-contents.svelte | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/lib/components/blog/table-of-contents.svelte b/src/lib/components/blog/table-of-contents.svelte
index ca9787fe8a..1bec3b4517 100644
--- a/src/lib/components/blog/table-of-contents.svelte
+++ b/src/lib/components/blog/table-of-contents.svelte
@@ -24,7 +24,7 @@
{
'font-medium': parent.level && parent.level === 1,
'ps-6': parent.level && parent.level === 2,
- 'pl-16': parent.level && parent.level >= 3,
+ 'pl-10': parent.level && parent.level >= 3,
'before:opacity-100': parent.selected
}
)}