From 90eb062518d646e21a1d74d05fc952612676e200 Mon Sep 17 00:00:00 2001
From: Giorgio UTZERI <giorgio.utzeri.etu@univ-lille.fr>
Date: Sat, 15 Mar 2025 14:37:48 +0100
Subject: [PATCH] test responsive
---
css/styleMenu.css | 9 +++++++++
menu.jsp | 12 +++++++++++-
2 files changed, 20 insertions(+), 1 deletion(-)
diff --git a/css/styleMenu.css b/css/styleMenu.css
index 06d36fe..56ae806 100644
--- a/css/styleMenu.css
+++ b/css/styleMenu.css
@@ -167,4 +167,13 @@ body {
}
}
+#sidebar {
+ width: 0;
+ transition: width 0.3s ease;
+}
+
+#sidebar.show {
+ width: 100vw !important;
+}
+
diff --git a/menu.jsp b/menu.jsp
index b461aaa..8750a9a 100644
--- a/menu.jsp
+++ b/menu.jsp
@@ -32,7 +32,7 @@
</button>
<!-- Sidebar (visible sur PC et cachée sur mobile) -->
- <div class="sidebar collapse d-lg-block col-12 col-md-3" id="sidebar">
+ <div class="sidebar collapse d-lg-block" id="sidebar">
<div class="d-flex align-items-center justify-content-between w-100">
<a href="UserInfo" class="d-flex align-items-center gap-3 fs-4 text-decoration-none text-light">
<i class="bi bi-person"></i>
@@ -171,5 +171,15 @@ if(isAdmin){
}
};
</script>
+<script>
+ document.addEventListener('DOMContentLoaded', function () {
+ const sidebar = document.getElementById('sidebar');
+ const toggleButton = document.querySelector('.navbar-toggler');
+
+ toggleButton.addEventListener('click', function () {
+ sidebar.classList.toggle('show');
+ });
+ });
+</script>
</body>
</html>
--
GitLab