Navs navbar

Side [ .side ]

Menu lateral com icones e texto. Texto só aparece no hover, e no mobile não aparece. Com ajustes de posicionamento: Esquerdo ou Direito;

Por padrão o posicionamento é a Esquerda. para colocar o posicionamento a direita acrescente na div aside a classe .sideb-right.

As cores e alguns ajustes do sideb, você pode fazer no arquivo swconfig.

                        
                        
                        <aside class="side">
                            <div class="side-header">
                                <i class="bx bxs-leaf"></i></a>
                                <h2>CodingLab</h2>
                            </div>
                            <ul class="side-links">
                                <h4><div class="menu-separator"></div></h4>
                                <li><a href="#">
                                    <i class="bx bx-home-alt-2"></i>Home</a>
                                </li>
                                <li><a href="#">
                                    <i class="bx bx-leaf"></i>Overview</a>
                                </li>
                                <li><a href="#">
                                    <i class="bx bx-buildings"></i>Analytic</a>
                                </li>
                                <h4><div class="menu-separator"></div></h4>
                                <li><a href="#">
                                    <i class="bx bx-comment-dots"></i>Comment</a>
                                </li>
                                <li><a href="#">
                                    <i class="bx bx-bowl-hot"></i>Groups</a>
                                </li>
                                <li><a href="#">
                                    <i class="bx bx-wifi-off"></i>Transfer</a>
                                </li>
                                <li><a href="#">
                                    <i class="bx bx-file-find"></i>All Reports</a>
                                </li>
                                <li><a href="#">
                                    <i class="bx bx-smile"></i>Notifications</a>
                                </li>

                                <h4><div class="menu-separator"></div></h4>
                                <li><a href="#">
                                    <i class="bx bx-smile"></i>Profile</a>
                                </li>
                                <li><a href="#">
                                    <i class="bx bx-gift"></i>Settings</a>
                                </li>
                            </ul>
                        </aside>