feat(SW-791): make confirmation page dynamic

2024-11-06 16:31:03 +01:00
parent e6a70a0a8a
commit 0897a398ee
35 changed files with 983 additions and 577 deletions
--- a/components/HotelReservation/BookingConfirmation/Actions/actions.module.css
+++ b/components/HotelReservation/BookingConfirmation/Actions/actions.module.css
@@ -0,0 +1,34 @@
+.actions {
+  background-color: var(--Base-Surface-Subtle-Normal);
+  border-radius: var(--Corner-radius-Medium);
+  display: grid;
+  grid-area: actions;
+  padding: var(--Spacing-x1) var(--Spacing-x2);
+}
+
+@media screen and (max-width: 767px) {
+  .actions {
+    & > button[class*="btn"][class*="icon"][class*="small"] {
+      border-bottom: 1px solid var(--Base-Border-Subtle);
+      border-radius: 0;
+      justify-content: space-between;
+
+      &:last-of-type {
+        border-bottom: none;
+      }
+
+      & > svg {
+        order: 2;
+      }
+    }
+  }
+}
+
+@media screen and (min-width: 768px) {
+  .actions {
+    gap: var(--Spacing-x1);
+    grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
+    justify-content: center;
+    padding: var(--Spacing-x1) var(--Spacing-x3);
+  }
+}