Fix: Improve sidebar indentation for nested documentation groups

docs/guides/running-tscircuit/scripting/_category_.json

@@ -0,0 +1,10 @@
+{
+  "label": "Scripting",
+  "position": 10,
+  "link": {
+    "type": "generated-index",
+    "description": "Learn how to use tscircuit programmatically with scripts."
+  },
+  "collapsible": true,
+  "collapsed": false
+}

src/css/custom.css

@@ -624,6 +624,33 @@ figure img {
   padding-right: 16px !important;
 }
 
+.theme-doc-sidebar-item-category[class*="level-3"]
+  > .menu__list-item-collapsible
+  > .menu__link {
+  padding-left: 28px !important;
+}
+
+.theme-doc-sidebar-item-link[class*="level-4"] .menu__link,
+.theme-doc-sidebar-item-category[class*="level-4"]
+  > .menu__list-item-collapsible
+  > .menu__link {
+  padding-left: 40px !important;
+}
+
+.theme-doc-sidebar-item-link[class*="level-5"] .menu__link,
+.theme-doc-sidebar-item-category[class*="level-5"]
+  > .menu__list-item-collapsible
+  > .menu__link {
+  padding-left: 52px !important;
+}
+
+.theme-doc-sidebar-item-link[class*="level-6"] .menu__link,
+.theme-doc-sidebar-item-category[class*="level-6"]
+  > .menu__list-item-collapsible
+  > .menu__link {
+  padding-left: 64px !important;
+}
+
 @media (max-width: 768px) {
   iframe {
     max-width: 90vw;

src/theme/DocSidebarItem/index.tsx

@@ -0,0 +1,10 @@
+import React, { type ReactNode } from "react"
+import DocSidebarItem from "@theme-original/DocSidebarItem"
+import type DocSidebarItemType from "@theme/DocSidebarItem"
+import type { WrapperProps } from "@docusaurus/types"
+
+type Props = WrapperProps<typeof DocSidebarItemType>
+
+export default function DocSidebarItemWrapper(props: Props): ReactNode {
+  return <DocSidebarItem {...props} />
+}