feat: add mobile ui to calendar

2024-09-27 17:44:36 +02:00
parent 73eddcf4b7
commit 1380dec6e3
32 changed files with 1005 additions and 296 deletions
--- a/components/BookingWidget/MobileToggleButton/button.module.css
+++ b/components/BookingWidget/MobileToggleButton/button.module.css
@@ -0,0 +1,35 @@
+.complete,
+.partial {
+  align-items: center;
+  box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.16);
+  cursor: pointer;
+  display: grid;
+  gap: var(--Spacing-x-one-and-half);
+  padding: var(--Spacing-x2);
+}
+
+.complete {
+  grid-template-columns: 1fr 36px;
+}
+
+.partial {
+  grid-template-columns: min(1fr, 150px) min-content min(1fr, 150px) 1fr;
+}
+
+.icon {
+  align-items: center;
+  background-color: var(--Base-Button-Primary-Fill-Normal);
+  border-radius: 50%;
+  display: flex;
+  height: 36px;
+  justify-content: center;
+  justify-self: flex-end;
+  width: 36px;
+}
+
+@media screen and (min-width: 768px) {
+  .complete,
+  .partial {
+    display: none;
+  }
+}