Fixes sidebar

public_html/static/all.css

@@ -120,3 +120,16 @@
 .widget {
     border: 1px solid gray;
 }
+
+.sidebar-wrapper {
+    width: 250px; /* Default width of the sidebar */
+    transition: width 0.3s; /* Smooth transition for collapsing */
+    overflow-x: hidden; /* Hide horizontal scrollbar */
+}
+.sidebar-wrapper.collapsed {
+    width: 0; /* Collapsed width */
+}
+.sidebar-content {
+    width: 250px; /* Keep content width for centering */
+}
+

public_html/templates/page-menu.php

@@ -2,6 +2,10 @@
         <!-- Menu -->
         <div class="menu-container">
             <ul class="menu-left">
+                <button class="btn btn-primary mb-3" type="button" data-toggle="collapse" data-target="#sidebar" aria-expanded="false" aria-controls="sidebar">
+                    sidebar
+                </button>
+
                 <li><a href="index.php">home</a></li>
 <?php if ( isset($_SESSION['username']) ) { ?>
                 <li><a href="?page=config">config</a></li>

public_html/templates/page-sidebar.php

@@ -1,11 +1,7 @@
         <div class="row">
 
             <!-- Sidebar -->
-            <div class="col-md-3">
-                <button class="btn btn-primary mb-3" type="button" data-toggle="collapse" data-target="#sidebar" aria-expanded="false" aria-controls="sidebar">
-                    sidebar
-                </button>
-                <div class="collapse show" id="sidebar">
+            <div class="col-md-3 sidebar-wrapper collapse show" id="sidebar">
                 <div class="card card-body bg-light">
                     <ul class="list-group">
                         <li class="list-group-item"><a href="#">stats</a></li>
@@ -14,7 +10,6 @@
                     </ul>
                 </div>
             </div>
-            </div>
             <!-- /Sidebar -->
 
         <div class="col-md-9">