From 18bb5a53ee4aa40f928431768e9eaa0f205d4f16 Mon Sep 17 00:00:00 2001
From: Jean-Baptiste Pasquier <contact@jbpasquier.eu>
Date: Tue, 15 Sep 2020 10:32:36 +0200
Subject: [PATCH] update: toggle the user list on chevron
---
src/scripts/menu-toggle.js | 11 +++++++++++
src/styles/base/main.scss | 2 +-
src/styles/base/menu-left.scss | 18 +++++++++++++-----
3 files changed, 25 insertions(+), 6 deletions(-)
create mode 100644 src/scripts/menu-toggle.js
diff --git a/src/scripts/menu-toggle.js b/src/scripts/menu-toggle.js
new file mode 100644
index 00000000..8f966706
--- /dev/null
+++ b/src/scripts/menu-toggle.js
@@ -0,0 +1,11 @@
+document.addEventListener("DOMContentLoaded", () => {
+ const menuWrappers = Array.from(document.querySelectorAll(".menu-wrapper"));
+
+ //- Toggle sub-menus
+ menuWrappers.forEach(menuWrapper => {
+ const menu = menuWrapper.querySelector(".menu");
+ menu.addEventListener("click", e => {
+ menuWrapper.classList.toggle("is-closed");
+ });
+ });
+});
\ No newline at end of file
diff --git a/src/styles/base/main.scss b/src/styles/base/main.scss
index 950b85a4..835e8db0 100644
--- a/src/styles/base/main.scss
+++ b/src/styles/base/main.scss
@@ -61,7 +61,7 @@ solid-dashboard section {
position: sticky;
top: 0;
overflow-x: hidden;
- overflow-y: auto;
+ overflow-y: scroll;
}
&.jsLeftMenu {
diff --git a/src/styles/base/menu-left.scss b/src/styles/base/menu-left.scss
index a018b5d7..6996fb63 100644
--- a/src/styles/base/menu-left.scss
+++ b/src/styles/base/menu-left.scss
@@ -13,13 +13,21 @@
solid-router {
.menu-wrapper {
- &.is-closed {
- .sub-menu {
- display: none;
+ .menu-icon.icon-arrow-up {
+ visibility: hidden;
+ }
+ @include breakpoint(lg) {
+ .menu-icon.icon-arrow-up {
+ visibility: visible;
}
+ &.is-closed {
+ .sub-menu {
+ display: none;
+ }
- .menu-chevron {
- transform: rotate(180deg);
+ .menu-chevron {
+ transform: rotate(180deg);
+ }
}
}
}
--
GitLab