output all entities in sidebar as menu items

src/components/Sidebar.module.scss

@@ -85,10 +85,11 @@
 .toc {
     ul {
         padding-left: 0;
+        margin: 0;
 
         ul {
-            padding-left: $spacer / 2;
-            margin: 0;
+            border-left: 1px solid $brand-grey-lighter;
+            margin-left: $spacer;
         }
     }
 

src/templates/Typedoc.jsx

@@ -17,15 +17,29 @@ const showKindOfProperty = ['Method', 'Property']
 
 const toc = typedoc => {
     const items = typedoc
-        .map(
-            ({ name }) => `
+        .map(({ name, children }) => {
+            const parentName = name
+
+            return `
             <li>
                 <a href="#${slugify(name)}"><code>
                     ${name}
                 </code></a>
+                <ul>
+                    ${children
+                        .map(
+                            ({ name }) =>
+                                `<li key={name}>
+                                <a href="#${parentName}-${slugify(name)}">
+                                    <code>${name}</code>
+                                </a>
+                            </li>`
+                        )
+                        .join('')}
+                </ul>
             </li>
         `
-        )
+        })
         .join('')
 
     return `<ul>${items}</ul>`
@@ -167,7 +181,7 @@ const PropertyWrapper = ({ property, sourceUrl, parentAnchor }) => {
 
     return (
         <div
-            id={`${parentAnchor}/${slugify(name)}`}
+            id={`${parentAnchor}-${slugify(name)}`}
             className={styles.property}
             data-private={!isPublic}
             data-deprecated={!!deprecation}

src/templates/Typedoc.module.scss

@@ -14,8 +14,10 @@
     margin-bottom: $spacer;
 
     code {
-        // stylelint-disable-next-line
+        // stylelint-disable declaration-no-important
         background: none !important;
+        padding: 0 !important;
+        // stylelint-enable declaration-no-important
     }
 }