feat: add my pages mobile dropdown cmoponent, parallel route, and consume + zustand store

2024-06-19 07:57:26 +02:00
parent f5d998d056
commit cfb08fff2c
11 changed files with 224 additions and 12 deletions
@@ -0,0 +1,55 @@
+.navigationMenu {
+  background-color: #fff;
+  border-top: 1px solid #e3e0db;
+  display: none;
+  list-style: none;
+  overflow-y: visible;
+  margin: 0;
+  padding-inline-start: 0;
+}
+
+.navigationMenu.navigationMenuIsOpen {
+  display: block;
+  left: 0;
+  position: absolute;
+  right: 0;
+  top: 100%;
+}
+
+.dropdownWrapper {
+  display: flex;
+  width: 100%;
+  padding: 20px;
+  flex-direction: column;
+  justify-content: center;
+  align-items: flex-start;
+  background-color: var(--Main-Grey-White);
+  box-shadow:
+    0px 276px 77px 0px rgba(0, 0, 0, 0),
+    0px 177px 71px 0px rgba(0, 0, 0, 0.01),
+    0px 99px 60px 0px rgba(0, 0, 0, 0.05),
+    0px 44px 44px 0px rgba(0, 0, 0, 0.09),
+    0px 11px 24px 0px rgba(0, 0, 0, 0.1);
+}
+
+.heading {
+  padding: 20px;
+}
+
+.dropdownLinks {
+  display: flex;
+  flex-direction: column;
+  gap: var(--Spacing-x-half);
+  width: 100%;
+  list-style: none;
+}
+
+@media screen and (min-width: 950px) {
+  .navigationMenu {
+    display: none;
+  }
+
+  .navigationMenu.navigationMenuIsOpen {
+    display: none;
+  }
+}