continued working on sidebar

2024-02-07 12:36:43 +01:00
parent 36fed98627
commit db8ad07ef8
8 changed files with 538 additions and 17 deletions
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -7,12 +7,13 @@ import remarkDirective from 'remark-directive';
 import remarkCalloutDirectives from "@microflash/remark-callout-directives";
 import remarkExternalLinks from 'remark-external-links';
 import mdx from "@astrojs/mdx";
-
 import lighthouse from "astro-lighthouse";

+import icon from "astro-icon";
+
 // https://astro.build/config
 export default defineConfig({
-  integrations: [minify(), metaTags(), mdx(), lighthouse()],
+  integrations: [minify(), metaTags(), mdx(), lighthouse(), icon()],
  markdown: {
    rehypePlugins: [rehypeSlug, [rehypeAutolinkHeadings, {
      behavior: 'wrap'
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,6 +12,7 @@
        "@astrojs/mdx": "^2.1.1",
        "@microflash/remark-callout-directives": "^2.0.0",
        "astro": "^4.2.6",
+        "astro-icon": "^1.1.0",
        "astro-lighthouse": "^0.1.3",
        "astro-meta-tags": "^0.2.1",
        "astro-min": "^1.1.0-dev.4",
@@ -21,6 +22,9 @@
        "remark-directive": "^3.0.0",
        "remark-external-links": "^9.0.1",
        "sass": "^1.70.0"
+      },
+      "devDependencies": {
+        "@iconify-json/mdi": "^1.1.64"
      }
    },
    "node_modules/@ampproject/remapping": {
@@ -35,6 +39,124 @@
        "node": ">=6.0.0"
      }
    },
+    "node_modules/@antfu/install-pkg": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/@antfu/install-pkg/-/install-pkg-0.1.1.tgz",
+      "integrity": "sha512-LyB/8+bSfa0DFGC06zpCEfs89/XoWZwws5ygEa5D+Xsm3OfI+aXQ86VgVG7Acyef+rSZ5HE7J8rrxzrQeM3PjQ==",
+      "dependencies": {
+        "execa": "^5.1.1",
+        "find-up": "^5.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@antfu/install-pkg/node_modules/execa": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/execa/-/execa-5.1.1.tgz",
+      "integrity": "sha512-8uSpZZocAZRBAPIEINJj3Lo9HyGitllczc27Eh5YYojjMFMn8yHMDMaUHE2Jqfq05D/wucwI4JGURyXt1vchyg==",
+      "dependencies": {
+        "cross-spawn": "^7.0.3",
+        "get-stream": "^6.0.0",
+        "human-signals": "^2.1.0",
+        "is-stream": "^2.0.0",
+        "merge-stream": "^2.0.0",
+        "npm-run-path": "^4.0.1",
+        "onetime": "^5.1.2",
+        "signal-exit": "^3.0.3",
+        "strip-final-newline": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sindresorhus/execa?sponsor=1"
+      }
+    },
+    "node_modules/@antfu/install-pkg/node_modules/get-stream": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-6.0.1.tgz",
+      "integrity": "sha512-ts6Wi+2j3jQjqi70w5AlN8DFnkSwC+MqmxEzdEALB2qXZYV3X/b1CTfgPLGJNMeAWxdPfU8FO1ms3NUfaHCPYg==",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@antfu/install-pkg/node_modules/human-signals": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/human-signals/-/human-signals-2.1.0.tgz",
+      "integrity": "sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw==",
+      "engines": {
+        "node": ">=10.17.0"
+      }
+    },
+    "node_modules/@antfu/install-pkg/node_modules/is-stream": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-2.0.1.tgz",
+      "integrity": "sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg==",
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@antfu/install-pkg/node_modules/mimic-fn": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz",
+      "integrity": "sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@antfu/install-pkg/node_modules/npm-run-path": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-4.0.1.tgz",
+      "integrity": "sha512-S48WzZW777zhNIrn7gxOlISNAqi9ZC/uQFnRdbeIHhZhCA6UqpkOT8T1G7BvfdgP4Er8gF4sUbaS0i7QvIfCWw==",
+      "dependencies": {
+        "path-key": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@antfu/install-pkg/node_modules/onetime": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/onetime/-/onetime-5.1.2.tgz",
+      "integrity": "sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==",
+      "dependencies": {
+        "mimic-fn": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@antfu/install-pkg/node_modules/signal-exit": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz",
+      "integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ=="
+    },
+    "node_modules/@antfu/install-pkg/node_modules/strip-final-newline": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/strip-final-newline/-/strip-final-newline-2.0.0.tgz",
+      "integrity": "sha512-BrpvfNAE3dcvq7ll3xVumzjKjZQ5tI1sEUIKr3Uoks0XUl45St3FlatVqef9prk4jRDzhW6WZg+3bk93y6pLjA==",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@antfu/utils": {
+      "version": "0.7.7",
+      "resolved": "https://registry.npmjs.org/@antfu/utils/-/utils-0.7.7.tgz",
+      "integrity": "sha512-gFPqTG7otEJ8uP6wrhDv6mqwGWYZKNvAcCq6u9hOj0c+IKCEsY4L1oC9trPq2SaWIzAfHvqfBDxF591JkMf+kg==",
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
    "node_modules/@astrojs/compiler": {
      "version": "2.5.2",
      "resolved": "https://registry.npmjs.org/@astrojs/compiler/-/compiler-2.5.2.tgz",
@@ -884,6 +1006,89 @@
      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
    },
+    "node_modules/@iconify-json/mdi": {
+      "version": "1.1.64",
+      "resolved": "https://registry.npmjs.org/@iconify-json/mdi/-/mdi-1.1.64.tgz",
+      "integrity": "sha512-zGeo5TjhNFAY6FmSDBLAzDO811t77r6v/mDi7CAL9w5eXqKez6bIjk8R9AL/RHIeq44ALP4Ozr4lMqFTkHr7ug==",
+      "dev": true,
+      "dependencies": {
+        "@iconify/types": "*"
+      }
+    },
+    "node_modules/@iconify/tools": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/@iconify/tools/-/tools-3.0.7.tgz",
+      "integrity": "sha512-DxfhFLMnooS34dHelpGUnnYrxLZHs0czC1CgrBhAbuL8ddVzBb2VEQm8kh9qGh7A34qeXAB5iSHH3A72rAaFrg==",
+      "dependencies": {
+        "@iconify/types": "^2.0.0",
+        "@iconify/utils": "^2.1.10",
+        "@types/cheerio": "^0.22.32",
+        "@types/tar": "^6.1.6",
+        "cheerio": "^1.0.0-rc.12",
+        "extract-zip": "^2.0.1",
+        "local-pkg": "^0.4.3",
+        "pathe": "^1.1.1",
+        "svgo": "3.0.3",
+        "tar": "^6.2.0"
+      }
+    },
+    "node_modules/@iconify/tools/node_modules/svgo": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/svgo/-/svgo-3.0.3.tgz",
+      "integrity": "sha512-X4UZvLhOglD5Xrp834HzGHf8RKUW0Ahigg/08yRO1no9t2NxffOkMiQ0WmaMIbaGlVTlSst2zWANsdhz5ybXgA==",
+      "dependencies": {
+        "@trysound/sax": "0.2.0",
+        "commander": "^7.2.0",
+        "css-select": "^5.1.0",
+        "css-tree": "^2.2.1",
+        "csso": "5.0.5",
+        "picocolors": "^1.0.0"
+      },
+      "bin": {
+        "svgo": "bin/svgo"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/svgo"
+      }
+    },
+    "node_modules/@iconify/types": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@iconify/types/-/types-2.0.0.tgz",
+      "integrity": "sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg=="
+    },
+    "node_modules/@iconify/utils": {
+      "version": "2.1.22",
+      "resolved": "https://registry.npmjs.org/@iconify/utils/-/utils-2.1.22.tgz",
+      "integrity": "sha512-6UHVzTVXmvO8uS6xFF+L/QTSpTzA/JZxtgU+KYGFyDYMEObZ1bu/b5l+zNJjHy+0leWjHI+C0pXlzGvv3oXZMA==",
+      "dependencies": {
+        "@antfu/install-pkg": "^0.1.1",
+        "@antfu/utils": "^0.7.5",
+        "@iconify/types": "^2.0.0",
+        "debug": "^4.3.4",
+        "kolorist": "^1.8.0",
+        "local-pkg": "^0.5.0",
+        "mlly": "^1.5.0"
+      }
+    },
+    "node_modules/@iconify/utils/node_modules/local-pkg": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/local-pkg/-/local-pkg-0.5.0.tgz",
+      "integrity": "sha512-ok6z3qlYyCDS4ZEU27HaU6x/xZa9Whf8jD4ptH5UZTQYZVYeb9bnZ3ojVhiJNLiXK1Hfc0GNbLXcmZ5plLDDBg==",
+      "dependencies": {
+        "mlly": "^1.4.2",
+        "pkg-types": "^1.0.3"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
    "node_modules/@jridgewell/gen-mapping": {
      "version": "0.3.3",
      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz",
@@ -1384,6 +1589,14 @@
        "@babel/types": "^7.20.7"
      }
    },
+    "node_modules/@types/cheerio": {
+      "version": "0.22.35",
+      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.35.tgz",
+      "integrity": "sha512-yD57BchKRvTV+JD53UZ6PD8KWY5g5rvvMLRnZR3EQBCZXiDT/HR+pKpMzFGlWNhFrXlo7VPZXtKvIEwZkAWOIA==",
+      "dependencies": {
+        "@types/node": "*"
+      }
+    },
    "node_modules/@types/debug": {
      "version": "4.1.12",
      "resolved": "https://registry.npmjs.org/@types/debug/-/debug-4.1.12.tgz",
@@ -1452,6 +1665,15 @@
        "undici-types": "~5.26.4"
      }
    },
+    "node_modules/@types/tar": {
+      "version": "6.1.11",
+      "resolved": "https://registry.npmjs.org/@types/tar/-/tar-6.1.11.tgz",
+      "integrity": "sha512-ThA1WD8aDdVU4VLuyq5NEqriwXErF5gEIJeyT6gHBWU7JtSmW2a5qjNv3/vR82O20mW+1vhmeZJfBQPT3HCugg==",
+      "dependencies": {
+        "@types/node": "*",
+        "minipass": "^4.0.0"
+      }
+    },
    "node_modules/@types/unist": {
      "version": "3.0.2",
      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.2.tgz",
@@ -1715,6 +1937,16 @@
        "sharp": "^0.32.6"
      }
    },
+    "node_modules/astro-icon": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/astro-icon/-/astro-icon-1.1.0.tgz",
+      "integrity": "sha512-Nksc09p7UuHeMcPNS9w1pKqRw3+wEmmh0A3FJW+FNXvqaeWI4RLvD1MCWErpY3Z5Cvad317rvLdik/Hg8GEk8Q==",
+      "dependencies": {
+        "@iconify/tools": "^3.0.1",
+        "@iconify/types": "^2.0.0",
+        "@iconify/utils": "^2.1.5"
+      }
+    },
    "node_modules/astro-lighthouse": {
      "version": "0.1.3",
      "resolved": "https://registry.npmjs.org/astro-lighthouse/-/astro-lighthouse-0.1.3.tgz",
@@ -2056,6 +2288,42 @@
        "url": "https://github.com/sponsors/wooorm"
      }
    },
+    "node_modules/cheerio": {
+      "version": "1.0.0-rc.12",
+      "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-1.0.0-rc.12.tgz",
+      "integrity": "sha512-VqR8m68vM46BNnuZ5NtnGBKIE/DfN0cRIzg9n40EIq9NOv90ayxLBXA8fXC5gquFRGJSTRqBq25Jt2ECLR431Q==",
+      "dependencies": {
+        "cheerio-select": "^2.1.0",
+        "dom-serializer": "^2.0.0",
+        "domhandler": "^5.0.3",
+        "domutils": "^3.0.1",
+        "htmlparser2": "^8.0.1",
+        "parse5": "^7.0.0",
+        "parse5-htmlparser2-tree-adapter": "^7.0.0"
+      },
+      "engines": {
+        "node": ">= 6"
+      },
+      "funding": {
+        "url": "https://github.com/cheeriojs/cheerio?sponsor=1"
+      }
+    },
+    "node_modules/cheerio-select": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/cheerio-select/-/cheerio-select-2.1.0.tgz",
+      "integrity": "sha512-9v9kG0LvzrlcungtnJtpGNxY+fzECQKhK4EGJX2vByejiMX84MFNQw4UxPJl3bFbTMw+Dfs37XaIkCwTZfLh4g==",
+      "dependencies": {
+        "boolbase": "^1.0.0",
+        "css-select": "^5.1.0",
+        "css-what": "^6.1.0",
+        "domelementtype": "^2.3.0",
+        "domhandler": "^5.0.3",
+        "domutils": "^3.0.1"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/fb55"
+      }
+    },
    "node_modules/chokidar": {
      "version": "3.5.3",
      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
@@ -3192,6 +3460,33 @@
        "node": ">=6 <7 || >=8"
      }
    },
+    "node_modules/fs-minipass": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/fs-minipass/-/fs-minipass-2.1.0.tgz",
+      "integrity": "sha512-V/JgOLFCS+R6Vcq0slCuaeWEdNC3ouDlJMNIsacH2VtALiu9mV4LPrHc5cDl8k5aw6J8jwgWWpiTo5RYhmIzvg==",
+      "dependencies": {
+        "minipass": "^3.0.0"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/fs-minipass/node_modules/minipass": {
+      "version": "3.3.6",
+      "resolved": "https://registry.npmjs.org/minipass/-/minipass-3.3.6.tgz",
+      "integrity": "sha512-DxiNidxSEK+tHG6zOIklvNOwm3hvCrbUrdtzY74U6HKTJxvIDfOUL5W5P2Ghd3DTkhhKPYGqeNUIh5qcM4YBfw==",
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/fs-minipass/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+    },
    "node_modules/fs.realpath": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
@@ -3634,6 +3929,24 @@
        "url": "https://github.com/sponsors/wooorm"
      }
    },
+    "node_modules/htmlparser2": {
+      "version": "8.0.2",
+      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-8.0.2.tgz",
+      "integrity": "sha512-GYdjWKDkbRLkZ5geuHs5NY1puJ+PXwP7+fHPRz06Eirsb9ugf6d8kkXav6ADhcODhFFPMIXyxkxSuMf3D6NCFA==",
+      "funding": [
+        "https://github.com/fb55/htmlparser2?sponsor=1",
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/fb55"
+        }
+      ],
+      "dependencies": {
+        "domelementtype": "^2.3.0",
+        "domhandler": "^5.0.3",
+        "domutils": "^3.0.1",
+        "entities": "^4.4.0"
+      }
+    },
    "node_modules/http-cache-semantics": {
      "version": "4.1.1",
      "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.1.1.tgz",
@@ -4103,6 +4416,11 @@
        "node": ">=6"
      }
    },
+    "node_modules/jsonc-parser": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.2.1.tgz",
+      "integrity": "sha512-AilxAyFOAcK5wA1+LeaySVBrHsGQvUFCDWXKpZjzaL0PqW+xfBOttn8GNtWKFWqneyMZj41MWF9Kl6iPWLwgOA=="
+    },
    "node_modules/jsonfile": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz",
@@ -4127,6 +4445,11 @@
        "node": ">=6"
      }
    },
+    "node_modules/kolorist": {
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/kolorist/-/kolorist-1.8.0.tgz",
+      "integrity": "sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ=="
+    },
    "node_modules/lighthouse": {
      "version": "11.5.0",
      "resolved": "https://registry.npmjs.org/lighthouse/-/lighthouse-11.5.0.tgz",
@@ -4240,6 +4563,17 @@
        "js-yaml": "bin/js-yaml.js"
      }
    },
+    "node_modules/local-pkg": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/local-pkg/-/local-pkg-0.4.3.tgz",
+      "integrity": "sha512-SFppqq5p42fe2qcZQqqEOiVRXl+WCP1MdT6k7BDEW1j++sp5fIY+/fdRQitvKgB5BrBcmrs5m/L0v2FrU5MY1g==",
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
    "node_modules/locate-path": {
      "version": "6.0.0",
      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
@@ -5478,16 +5812,74 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
+    "node_modules/minipass": {
+      "version": "4.2.8",
+      "resolved": "https://registry.npmjs.org/minipass/-/minipass-4.2.8.tgz",
+      "integrity": "sha512-fNzuVyifolSLFL4NzpF+wEF4qrgqaaKX0haXPQEdQ7NKAN+WecoKMHV09YcuL/DHxrUsYQOK3MiuDf7Ip2OXfQ==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/minizlib": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/minizlib/-/minizlib-2.1.2.tgz",
+      "integrity": "sha512-bAxsR8BVfj60DWXHE3u30oHzfl4G7khkSuPW+qvpd7jFRHm7dLxOjUk1EHACJ/hxLY8phGJ0YhYHZo7jil7Qdg==",
+      "dependencies": {
+        "minipass": "^3.0.0",
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/minizlib/node_modules/minipass": {
+      "version": "3.3.6",
+      "resolved": "https://registry.npmjs.org/minipass/-/minipass-3.3.6.tgz",
+      "integrity": "sha512-DxiNidxSEK+tHG6zOIklvNOwm3hvCrbUrdtzY74U6HKTJxvIDfOUL5W5P2Ghd3DTkhhKPYGqeNUIh5qcM4YBfw==",
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/minizlib/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+    },
    "node_modules/mitt": {
      "version": "3.0.1",
      "resolved": "https://registry.npmjs.org/mitt/-/mitt-3.0.1.tgz",
      "integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw=="
    },
+    "node_modules/mkdirp": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-1.0.4.tgz",
+      "integrity": "sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==",
+      "bin": {
+        "mkdirp": "bin/cmd.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
    "node_modules/mkdirp-classic": {
      "version": "0.5.3",
      "resolved": "https://registry.npmjs.org/mkdirp-classic/-/mkdirp-classic-0.5.3.tgz",
      "integrity": "sha512-gKLcREMhtuZRwRAfqP3RFW+TK4JqApVBtOIftVgjuABpAtpxhPGaDcfvbhNvD0B8iD1oUr/txX35NjcaY6Ns/A=="
    },
+    "node_modules/mlly": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/mlly/-/mlly-1.5.0.tgz",
+      "integrity": "sha512-NPVQvAY1xr1QoVeG0cy8yUYC7FQcOx6evl/RjT1wL5FvzPnzOysoqB/jmx/DhssT2dYa8nxECLAaFI/+gVLhDQ==",
+      "dependencies": {
+        "acorn": "^8.11.3",
+        "pathe": "^1.1.2",
+        "pkg-types": "^1.0.3",
+        "ufo": "^1.3.2"
+      }
+    },
    "node_modules/ms": {
      "version": "2.1.2",
      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
@@ -7150,6 +7542,18 @@
        "url": "https://github.com/inikulin/parse5?sponsor=1"
      }
    },
+    "node_modules/parse5-htmlparser2-tree-adapter": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/parse5-htmlparser2-tree-adapter/-/parse5-htmlparser2-tree-adapter-7.0.0.tgz",
+      "integrity": "sha512-B77tOZrqqfUfnVcOrUvfdLbz4pu4RopLD/4vmu3HUPswwTA8OH0EMW9BlWR2B0RCoiZRAHEUu7IxeP1Pd1UU+g==",
+      "dependencies": {
+        "domhandler": "^5.0.2",
+        "parse5": "^7.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/inikulin/parse5?sponsor=1"
+      }
+    },
    "node_modules/path-exists": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -7184,6 +7588,11 @@
      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-6.2.1.tgz",
      "integrity": "sha512-JLyh7xT1kizaEvcaXOQwOc2/Yhw6KZOvPf1S8401UyLk86CU79LN3vl7ztXGm/pZ+YjoyAJ4rxmHwbkBXJX+yw=="
    },
+    "node_modules/pathe": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/pathe/-/pathe-1.1.2.tgz",
+      "integrity": "sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ=="
+    },
    "node_modules/pend": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/pend/-/pend-1.2.0.tgz",
@@ -7282,6 +7691,16 @@
        "node": ">=8"
      }
    },
+    "node_modules/pkg-types": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/pkg-types/-/pkg-types-1.0.3.tgz",
+      "integrity": "sha512-nN7pYi0AQqJnoLPC9eHFQ8AcyaixBUOwvqc5TDnIKCMEE6I0y8P7OKA7fPexsXGCGxQDl/cmrLAp26LhcwxZ4A==",
+      "dependencies": {
+        "jsonc-parser": "^3.2.0",
+        "mlly": "^1.2.0",
+        "pathe": "^1.1.0"
+      }
+    },
    "node_modules/postcss": {
      "version": "8.4.33",
      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.33.tgz",
@@ -8994,6 +9413,22 @@
        "url": "https://opencollective.com/svgo"
      }
    },
+    "node_modules/tar": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/tar/-/tar-6.2.0.tgz",
+      "integrity": "sha512-/Wo7DcT0u5HUV486xg675HtjNd3BXZ6xDbzsCUZPt5iw8bTQ63bP0Raut3mvro9u+CUyq7YQd8Cx55fsZXxqLQ==",
+      "dependencies": {
+        "chownr": "^2.0.0",
+        "fs-minipass": "^2.0.0",
+        "minipass": "^5.0.0",
+        "minizlib": "^2.1.1",
+        "mkdirp": "^1.0.3",
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
    "node_modules/tar-fs": {
      "version": "3.0.4",
      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.4.tgz",
@@ -9014,6 +9449,27 @@
        "streamx": "^2.15.0"
      }
    },
+    "node_modules/tar/node_modules/chownr": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/chownr/-/chownr-2.0.0.tgz",
+      "integrity": "sha512-bIomtDF5KGpdogkLd9VspvFzk9KfpyyGlS8YFVZl7TGPBHL5snIOnxeshwVgPteQ9b4Eydl+pVbIyE1DcvCWgQ==",
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/tar/node_modules/minipass": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/minipass/-/minipass-5.0.0.tgz",
+      "integrity": "sha512-3FnjYuehv9k6ovOEbyOswadCDPX1piCfhV8ncmYtHOjuPwylVWsghTLo7rabjC3Rx5xD4HDx8Wm1xnMF7S5qFQ==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/tar/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+    },
    "node_modules/third-party-web": {
      "version": "0.24.1",
      "resolved": "https://registry.npmjs.org/third-party-web/-/third-party-web-0.24.1.tgz",
@@ -9134,6 +9590,11 @@
        "is-typedarray": "^1.0.0"
      }
    },
+    "node_modules/ufo": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/ufo/-/ufo-1.4.0.tgz",
+      "integrity": "sha512-Hhy+BhRBleFjpJ2vchUNN40qgkh0366FWJGqVLYBHev0vpHTrXSA0ryT+74UiW6KWsldNurQMKGqCm1M2zBciQ=="
+    },
    "node_modules/unbzip2-stream": {
      "version": "1.4.3",
      "resolved": "https://registry.npmjs.org/unbzip2-stream/-/unbzip2-stream-1.4.3.tgz",
--- a/package.json
+++ b/package.json
@@ -14,6 +14,7 @@
    "@astrojs/mdx": "^2.1.1",
    "@microflash/remark-callout-directives": "^2.0.0",
    "astro": "^4.2.6",
+    "astro-icon": "^1.1.0",
    "astro-lighthouse": "^0.1.3",
    "astro-meta-tags": "^0.2.1",
    "astro-min": "^1.1.0-dev.4",
@@ -23,5 +24,8 @@
    "remark-directive": "^3.0.0",
    "remark-external-links": "^9.0.1",
    "sass": "^1.70.0"
+  },
+  "devDependencies": {
+    "@iconify-json/mdi": "^1.1.64"
  }
 }
--- a/src/layouts/DocsLayout.astro
+++ b/src/layouts/DocsLayout.astro
@@ -1,11 +1,13 @@
 ---
 const { frontmatter } = Astro.props;
 import Layout from "../layouts/Layout.astro";
-const title = frontmatter.title + "| Docs";
+import { Icon } from "astro-icon/components";
+import "../styles/sidebar.scss";
+const title = frontmatter.title + " | Docs";
 const unsortedDocs = await Astro.glob("../pages/docs/*/*.mdx");
-const docs = unsortedDocs
-  .sort((a, b) => +new Date(b.frontmatter.date) - +new Date(a.frontmatter.date))
-  .filter((doc) => doc.frontmatter.repo === frontmatter.repo);
+const docs = unsortedDocs.sort((a, b) =>
+  a.url === "/docs/" + a.frontmatter.repo ? -1 : 1
+);
 ---

 <Layout
@@ -13,15 +15,24 @@ const docs = unsortedDocs
  description="This is my personal website with my projects, docs and other useful stuff."
 >
  <div class="sidebar">
-    <a href={"/docs/" + frontmatter.repo}>Home</a><br />
-    {
-      docs.map((page) => (
-        <>
-          <a href={page.url}>{page.frontmatter.title}</a>
-          <br />
-        </>
-      ))
-    }
+    <input type="checkbox" class="sidebar" />
+    <div class="sidebar" style="display: unset;">
+      {
+        docs.map((page) => {
+          const isActive =
+            (Astro.url.pathname.startsWith(page.url) &&
+              page.url !== "/docs/" + page.frontmatter.repo) ||
+            Astro.url.pathname === page.url;
+          return (
+            <a href={page.url} class={isActive ? "active" : ""}>
+              <Icon name="mdi:file-outline" />
+              {page.frontmatter.title} <br />
+            </a>
+          );
+        })
+      }
+    </div>
+    <Icon size={22} name="mdi:chevron-left-circle" />
  </div>
  <div class="content">
    <a href={"https://github.com/vaporvee/" + frontmatter.repo} target="_blank"
--- a/src/pages/docs/discord-sdk-godot/index.mdx
+++ b/src/pages/docs/discord-sdk-godot/index.mdx
@@ -2,7 +2,7 @@
 layout: ../../../layouts/DocsLayout.astro
 repo: discord-sdk-godot
 has_thumbnail: true
-title: Discord SDK plugin for Godot
+title: Home
 subtitle: Discord Game SDK support for GDScript in Godot Engine 4.2. with the easiest code pattern!
 features: |
 - Activities (Make people see what you are playing)
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -88,4 +88,8 @@ h3 {
        color: white;
        text-decoration: none;
    }
+}
+
+svg{
+    margin-bottom: -1.5%;
 }
--- a/src/styles/navbar.scss
+++ b/src/styles/navbar.scss
@@ -1,3 +1,5 @@
+
+@import './_var.scss';
 header {
    padding-top: 2.5vh;
    padding-bottom: 2.5vh;
@@ -30,7 +32,7 @@ header {

            .active {
                font-family: "Satoshi-Bold";
-                color: #7eca9c;
+                color: $accent;
            }

            .highlighter {
--- a/src/styles/sidebar.scss
+++ b/src/styles/sidebar.scss
@@ -0,0 +1,38 @@
+@import "./_var.scss";
+.sidebar {
+  display: flex;
+  justify-content: space-evenly;
+  .sidebar-entries {
+    opacity: 1;
+  }
+  a {
+    color: white;
+    text-decoration: none;
+  }
+  .active {
+    color: $accent;
+  }
+
+  rotate: 0deg;
+  svg {
+    transition: 0.3s ease-in-out;
+    rotate: 0deg;
+  }
+  &:checked ~ {
+    svg {
+      rotate: 180deg;
+    }
+    div {
+      //only works when the checkbox is on the correct line in the astro file
+      margin-left: -330%;
+    }
+  }
+
+  &[type="checkbox"] {
+    position: absolute;
+    transform: scale(2);
+    z-index: 2;
+    &:checked {
+    }
+  }
+}