From c8c0c1de6893d4b792c42694e77669438697d401 Mon Sep 17 00:00:00 2001
From: Helen Chong <119173961+helenclx@users.noreply.github.com>
Date: Tue, 16 Apr 2024 00:28:11 +0800
Subject: [PATCH] Move table of contents styling to the template

---
 src/_includes/toc.njk   | 44 +++++++++++++++++++++++++++++++++++++++++
 src/assets/css/main.css | 42 ---------------------------------------
 2 files changed, 44 insertions(+), 42 deletions(-)

diff --git a/src/_includes/toc.njk b/src/_includes/toc.njk
index 845e5212..6db3bb2d 100644
--- a/src/_includes/toc.njk
+++ b/src/_includes/toc.njk
@@ -6,6 +6,50 @@
         {{ content | toc | safe }}
     </details>
 </aside>
+
+<style>
+    .toc__wrapper {
+        position: sticky;
+        top: 4rem;
+    }
+
+    .toc__heading {
+        font-size: 1.3rem;
+        font-weight: 700;
+        color: var(--clr-sub-heading);
+        cursor: pointer;
+    }
+
+    .toc ol,
+    .toc ol ol  {
+        display: grid;
+        gap: 0.3em;
+    }
+
+    .toc ol {
+        border-top: 0.1em solid var(--clr-title-border);
+        padding-left: 1.5em;
+        padding-top: 1em;
+    }
+
+    .toc ol ol {
+        border-top: none;
+        list-style-type: disc;
+        padding-left: 1.5em;
+        padding-top: 0.3em;
+    }
+
+    .toc ol a {
+        font-size: 1.1rem;
+        padding-left: 0.3em;
+    }
+
+    .toc ol ol a {
+        padding: 0;
+        font-size: 1rem;
+    }
+</style>
+
 <script defer>
     // Close article ToC accordion for small screen sizes
     const tocWrapper = docucument.querySelector('.toc__wrapper');
diff --git a/src/assets/css/main.css b/src/assets/css/main.css
index f63b6b8c..bcb32462 100644
--- a/src/assets/css/main.css
+++ b/src/assets/css/main.css
@@ -465,48 +465,6 @@ main {
     gap: 0.5rem;
 }
 
-/* Table of Contents */
-.toc__wrapper {
-    position: sticky;
-    top: 4rem;
-}
-
-.toc__heading {
-    font-size: 1.3rem;
-    font-weight: 700;
-    color: var(--clr-sub-heading);
-    cursor: pointer;
-}
-
-.toc ol,
-.toc ol ol  {
-    display: grid;
-    gap: 0.3em;
-}
-
-.toc ol {
-    border-top: 0.1em solid var(--clr-title-border);
-    padding-left: 1.5em;
-    padding-top: 1em;
-}
-
-.toc ol ol {
-    border-top: none;
-    list-style-type: disc;
-    padding-left: 1.5em;
-    padding-top: 0.3em;
-}
-
-.toc ol a {
-    font-size: 1.1rem;
-    padding-left: 0.3em;
-}
-
-.toc ol ol a {
-    padding: 0;
-    font-size: 1rem;
-}
-
 /* UTILITY CLASSES */
 .bold-text {
     font-weight: 700;