Code
<aside class="side-bar side-bar--active side-bar--1"></aside>
<div id="back-to-top" class="abc">
<div class="top-bar">
<div class="wrapper--1">
<div class="top-bar__left"></div>
<div class="top-bar__right"></div>
</div>
</div>
<header class="header">
<div class="wrapper--1"></div>
</header>
<main class="main">
<section class="section"></section>
<section class="section"></section>
<section class="section"></section>
<div class="back-to-top">
<a class="js-scroll" href="#back-to-top">
<i class="fas fa-angle-double-up"></i>
</a>
</div>
</main>
<footer class="footer">
<section class="footer__links">
<div class="wrapper--1"></div>
</section>
<section class="footer__legal">
<div class="wrapper--1"></div>
</section>
</footer>
</div>
Use Case
This is how the DOM should be structured.
The side bar is used on a site by site basis and if not needed the abc class can be removed.
The width of the side bar is defined via a custom property and can be set per theme.
Component Options
There are no options for this component.
