Update file layout.html

wiki/layout.html

@@ -84,6 +84,14 @@
         box-shadow: 2px 0 5px rgba(0,0,0,0.1);
         border-radius: 0px;
         overflow-y: auto; 
+        transition: transform 0.3s ease-in-out;
+      }
+      
+      /* Media query for screens smaller than 768px (typical tablet breakpoint) */
+      @media (max-width: 768px) {
+        .sidebar {
+          transform: translateX(-100%);
+        }
       }
       .sidebar ul {
         list-style: none;
@@ -137,51 +145,6 @@
         color: hsl(17, 100%, 50%);
       }
 
-      .back-to-top {
-        position: fixed;
-        left: 95px; 
-        bottom: 170px;
-        width: 40px;
-        height: 40px;
-        background-color: hsl(17, 100%, 50%);
-        border: none;
-        border-radius: 50%;
-        color: white;
-        font-size: 20px;
-        cursor: pointer;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        transition: opacity 0.3s, visibility 0.3s;
-        opacity: 0;
-        visibility: hidden;
-      }
-
-      .back-to-top.show {
-        opacity: 1;
-        visibility: visible;
-      }
-
-      .back-to-top:hover {
-        background-color: hsl(18, 25%, 8%);
-      }
-
-      .team-logo {
-        position: fixed;
-        left: 10px;
-        top: 130px;
-        transform: translateY(-50%);
-        width: 150px;  
-        height: 150px; 
-        border-radius: 75%;
-        overflow: hidden;
-        z-index: 10;
-      }
-      .team-logo img {
-        width: 100%;
-        height: 100%;
-        object-fit: cover;
-      }
       .text-size-toggle {
         position: fixed;
         right: 10px;
@@ -405,6 +368,22 @@
             }
             });
     
+            window.addEventListener('resize', function() {
+        var sidebar = document.querySelector('.sidebar');
+        if (window.innerWidth <= 768) {
+          sidebar.style.transform = 'translateX(-100%)';
+        } else {
+          sidebar.style.transform = 'translateX(0)';
+        }
+      });
+
+      // Initial check on page load
+      window.addEventListener('load', function() {
+        var sidebar = document.querySelector('.sidebar');
+        if (window.innerWidth <= 768) {
+          sidebar.style.transform = 'translateX(-100%)';
+        }
+      });
 </script>
 
 </body>