Update sidebar [docs]

bboonstra · Oct 22, 2024 · b5b8cd1 · b5b8cd1
1 parent 1e1fbc9
commit b5b8cd1
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 13 deletions.
diff --git a/docs/docs/index.html b/docs/docs/index.html
@@ -43,7 +43,7 @@ <h3>Looking for technicals?</h3>
                     >EffortlessConfig</a
                 >
                 <a href="technical/fields.html" class="tab tab-forward"
-                    >Fields / Queries</a
+                    >Fields</a
                 >
             </div>
         </main>

diff --git a/docs/home.js b/docs/home.js
@@ -13,26 +13,35 @@ document.addEventListener("templateConstructed", function () {
                 section.style.background = "var(--background-color)";
             } else {
                 section.style.backgroundColor = "transparent";
-                section.style.background = "linear-gradient(90deg, var(--effortless-blue), var(--effortless-green))";
+                section.style.background =
+                    "linear-gradient(90deg, var(--effortless-blue), var(--effortless-green))";
             }
         });
     }
 
     function updateArrowColors() {
-        var currentSectionColor = getComputedStyle(sections[currentSection]).backgroundColor;
-        var backgroundColorHex = getComputedStyle(document.documentElement).getPropertyValue("--background-color").trim();
+        var currentSectionColor = getComputedStyle(
+            sections[currentSection]
+        ).backgroundColor;
+        var backgroundColorHex = getComputedStyle(document.documentElement)
+            .getPropertyValue("--background-color")
+            .trim();
         var backgroundColorRgb = hexToRgb(backgroundColorHex);
-        var arrowColor = currentSectionColor === backgroundColorRgb
-            ? "var(--primary-color)"
-            : "var(--background-color)";
+        var arrowColor =
+            currentSectionColor === backgroundColorRgb
+                ? "var(--primary-color)"
+                : "var(--background-color)";
 
         upArrow.style.color = arrowColor;
         downArrow.style.color = arrowColor;
     }
 
     function updateArrowVisibility() {
         upArrow.classList.toggle("show", currentSection > 0);
-        downArrow.classList.toggle("show", currentSection < sections.length - 1);
+        downArrow.classList.toggle(
+            "show",
+            currentSection < sections.length - 1
+        );
     }
 
     function scrollToSection(index) {

diff --git a/docs/templating.js b/docs/templating.js
@@ -61,18 +61,27 @@ document.addEventListener("DOMContentLoaded", function () {
     const sidebar = `
         <div id="sidebar" class="collapsed">
             <ul>
+                <li>
+                    <span class="dropdown-toggle">What's New?</span>
+                    <ul class="dropdown">
+                        <li><a href="/changelog.html">Changelog</a></li>
+                    </ul>
+                </li>
                 <li>
                     <span class="dropdown-toggle">Getting Started</span>
                     <ul class="dropdown">
                         <li><a href="/docs/quickstart.html">Quickstart</a></li>
+                        <li><a href="/docs/effortless-usage.html">Effortless Usage</a></li>
+                        <li><a href="/docs/basic-usage.html">Basic Usage</a></li>
+                        <li><a href="/docs/advanced-usage.html">Advanced Usage</a></li>
                     </ul>
                 </li>
                 <li>
-                    <span class="dropdown-toggle">Usage</span>
+                    <span class="dropdown-toggle">Technical</span>
                     <ul class="dropdown">
-                        <li><a href="/docs/effortless-usage.html">Effortless</a></li>
-                        <li><a href="/docs/basic-usage.html">Basic</a></li>
-                        <li><a href="/docs/advanced-usage.html">Advanced</a></li>
+                        <li><a href="/docs/technical/db.html">EffortlessDB</a></li>
+                        <li><a href="/docs/technical/config.html">EffortlessConfig</a></li>
+                        <li><a href="/docs/technical/fields.html">Fields</a></li>
                     </ul>
                 </li>
             </ul>
@@ -170,7 +179,7 @@ const isLocalhost =
     window.location.hostname === "127.0.0.1";
 
 function adjustLinks() {
-    const baseUrl = isLocalhost ? '' : '/Effortless';
+    const baseUrl = isLocalhost ? "" : "/Effortless";
     var links = document.querySelectorAll("a");
     links.forEach((link) => {
         var href = link.getAttribute("href");