Docs: Sidebar styles

This commit is contained in:
Lucas Larroche 2021-11-02 00:20:55 +07:00
parent 7e02e9f959
commit c71144455b
52 changed files with 247 additions and 159 deletions

View file

@ -1,6 +1,16 @@
<aside>
<nav>
<h1>Documentation</h1>
<nav class="closed-on-mobile">
<a href="./" class="secondary" id="toggle-docs-navigation">
<svg xmlns="http://www.w3.org/2000/svg" class="expand" fill="currentColor" viewBox="0 0 16 16">
<title>Expand</title>
<path fill-rule="evenodd" d="M1 8a.5.5 0 0 1 .5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 1 8zM7.646.146a.5.5 0 0 1 .708 0l2 2a.5.5 0 0 1-.708.708L8.5 1.707V5.5a.5.5 0 0 1-1 0V1.707L6.354 2.854a.5.5 0 1 1-.708-.708l2-2zM8 10a.5.5 0 0 1 .5.5v3.793l1.146-1.147a.5.5 0 0 1 .708.708l-2 2a.5.5 0 0 1-.708 0l-2-2a.5.5 0 0 1 .708-.708L7.5 14.293V10.5A.5.5 0 0 1 8 10z"></path>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" class="collapse" fill="currentColor" viewBox="0 0 16 16">
<title>Collapse</title>
<path fill-rule="evenodd" d="M1 8a.5.5 0 0 1 .5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 1 8zm7-8a.5.5 0 0 1 .5.5v3.793l1.146-1.147a.5.5 0 0 1 .708.708l-2 2a.5.5 0 0 1-.708 0l-2-2a.5.5 0 1 1 .708-.708L7.5 4.293V.5A.5.5 0 0 1 8 0zm-.5 11.707l-1.146 1.147a.5.5 0 0 1-.708-.708l2-2a.5.5 0 0 1 .708 0l2 2a.5.5 0 0 1-.708.708L8.5 11.707V15.5a.5.5 0 0 1-1 0v-3.793z"></path>
</svg>
Table of content
</a>
<details>
<summary>Getting started</summary>
<ul>
@ -53,11 +63,10 @@
</ul>
</details>
</nav>
</aside>
<script>
const activeLink = document.querySelector(`aside a#${props.active}`);
const parentAccordion = activeLink.closest('details');
activeLink.classList.add('active');
parentAccordion.setAttribute('open', 'true');
</script>
<script>
const activeLink = document.querySelector(`aside a#${props.active}`);
const parentAccordion = activeLink.closest('details');
activeLink.classList.add('active');
parentAccordion.setAttribute('open', 'true');
</script>
</aside>