The side navigation is used to display a list of links to move between pages within a related category. It is used as a secondary form of navigation where the primary navigation is located hierachically above the page frame.
<navclass="sidenav sgds list-unstyled open1"><liclass="sidenav-item"><buttonclass="sgds btn collapsed active"type="button"data-bs-toggle="collapse"data-bs-target="#collapseExampleA"aria-expanded="false"aria-controls="collapseExampleA"><iclass="bi bi-layers"></i>Sub menu
<iclass="bi bi-chevron-down"></i></button><divclass="collapse show"id="collapseExampleA"data-bs-parent=".open1"><ulclass="list-unstyled"><li><ahref="#"class="nav-link">Sub menu item</a></li><li><ahref="#"class="nav-link active">Sub menu item</a></li><li><ahref="#"class="nav-link">Sub menu item</a></li></ul></div></li><liclass="sidenav-item"><buttonclass="sgds btn collapsed"type="button"data-bs-toggle="collapse"data-bs-target="#collapseExampleB"aria-expanded="false"aria-controls="collapseExampleB"><iclass="bi bi-layers"></i>Sub menu
<iclass="bi bi-chevron-down"></i></button><divclass="collapse"id="collapseExampleB"data-bs-parent=".open1"><ulclass="list-unstyled"><li><ahref="#"class="nav-link">Sub menu item</a></li><li><ahref="#"class="nav-link">Sub menu item</a></li><li><ahref="#"class="nav-link">Sub menu item</a></li></ul></div></li><liclass="sidenav-item"><buttonclass="sgds btn collapsed"type="button"data-bs-toggle="collapse"data-bs-target="#collapseExampleC"aria-expanded="false"aria-controls="collapseExampleC"><iclass="bi bi-layers"></i>Sub menu
<iclass="bi bi-chevron-down"></i></button><divclass="collapse"id="collapseExampleC"data-bs-parent=".open1"><ulclass="list-unstyled"><li><ahref="#"class="nav-link">Sub menu item</a></li><li><ahref="#"class="nav-link">Sub menu item</a></li><li><ahref="#"class="nav-link">Sub menu item</a></li></ul></div></li></nav>
<navclass="sidenav sgds list-unstyled open2"><liclass="sidenav-item"><buttonclass="sgds btn collapsed active"type="button"data-bs-toggle="collapse"data-bs-target="#collapseExampleD"aria-expanded="false"aria-controls="collapseExampleD">
Sub menu
<iclass="bi bi-chevron-down"></i></button><divclass="collapse show"id="collapseExampleD"data-bs-parent=".open2"><ulclass="list-unstyled"><li><ahref="#"class="nav-link">Sub menu item</a></li><li><ahref="#"class="nav-link active">Sub menu item</a></li><li><ahref="#"class="nav-link">Sub menu item</a></li></ul></div></li><liclass="sidenav-item"><buttonclass="sgds btn collapsed"type="button"data-bs-toggle="collapse"data-bs-target="#collapseExampleE"aria-expanded="false"aria-controls="collapseExampleE">
Sub menu
<iclass="bi bi-chevron-down"></i></button><divclass="collapse"id="collapseExampleE"data-bs-parent=".open2"><ulclass="list-unstyled"><li><ahref="#"class="nav-link">Sub menu item</a></li><li><ahref="#"class="nav-link">Sub menu item</a></li><li><ahref="#"class="nav-link">Sub menu item</a></li></ul></div></li><liclass="sidenav-item"><buttonclass="sgds btn collapsed"type="button"data-bs-toggle="collapse"data-bs-target="#collapseExampleF"aria-expanded="false"aria-controls="collapseExampleF">
Sub menu
<iclass="bi bi-chevron-down"></i></button><divclass="collapse"id="collapseExampleF"data-bs-parent=".open2"><ulclass="list-unstyled"><li><ahref="#"class="nav-link">Sub menu item</a></li><li><ahref="#"class="nav-link">Sub menu item</a></li><li><ahref="#"class="nav-link">Sub menu item</a></li></ul></div></li></nav>