Merged in feat/SW-475-enter-details-header (pull request #630)

Feat/SW-475 enter details header * feat(SW-475): updated hotel mock data to reflect api * feat(SW-475): Added hotel selection header with sidepeek buttons * fix(SW-475): fixes from PR * fix(SW-475): changed intl string Approved-by: Arvid Norlin
2024-10-03 07:42:26 +00:00
parent aee9e94f7a
commit 18a1649bdf
9 changed files with 840 additions and 107 deletions
@@ -0,0 +1,52 @@
+.hotelSelectionHeader {
+  display: flex;
+  flex-direction: column;
+  background-color: var(--Base-Surface-Subtle-Normal);
+  padding: var(--Spacing-x3) var(--Spacing-x2);
+  justify-content: center;
+  gap: var(--Spacing-x3);
+}
+
+.titleContainer {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  justify-content: center;
+  gap: var(--Spacing-x1);
+}
+
+.descriptionContainer {
+  display: flex;
+  flex-direction: column;
+  gap: var(--Spacing-x-one-and-half);
+}
+
+.address {
+  display: flex;
+  gap: var(--Spacing-x-one-and-half);
+  font-style: normal;
+}
+
+.dividerContainer {
+  display: none;
+}
+
+@media (min-width: 768px) {
+  .hotelSelectionHeader {
+    flex-direction: row;
+    padding: var(--Spacing-x4) var(--Spacing-x5);
+    gap: var(--Spacing-x6);
+  }
+
+  .titleContainer > h1 {
+    white-space: nowrap;
+  }
+
+  .dividerContainer {
+    display: block;
+  }
+
+  .address {
+    gap: var(--Spacing-x3);
+  }
+}