diff --git a/apps/scandic-web/components/HotelReservation/HotelCardDialog/ListingHotelCardDialog/index.tsx b/apps/scandic-web/components/HotelReservation/HotelCardDialog/ListingHotelCardDialog/index.tsx index bbdd3dc9b..db216eb16 100644 --- a/apps/scandic-web/components/HotelReservation/HotelCardDialog/ListingHotelCardDialog/index.tsx +++ b/apps/scandic-web/components/HotelReservation/HotelCardDialog/ListingHotelCardDialog/index.tsx @@ -37,6 +37,7 @@ export default function ListingHotelCardDialog({ const { data: session } = useSession() const isUserLoggedIn = isValidClientSession(session) const { + bookingCode, name, publicPrice, memberPrice, @@ -97,7 +98,7 @@ export default function ListingHotelCardDialog({ )}
- {publicPrice && !isUserLoggedIn && memberPrice && ( + {publicPrice && !isUserLoggedIn && memberPrice ? ( <> {publicPrice} {currency} @@ -105,6 +106,13 @@ export default function ListingHotelCardDialog({ {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */} {memberPrice && /} + ) : ( + bookingCode && + publicPrice && ( + + {publicPrice} {currency} + + ) )} {memberPrice && ( diff --git a/apps/scandic-web/components/HotelReservation/SelectHotel/BookingCodeFilter/bookingCodeFilter.module.css b/apps/scandic-web/components/HotelReservation/SelectHotel/BookingCodeFilter/bookingCodeFilter.module.css index d37db9f78..2d5c4a3eb 100644 --- a/apps/scandic-web/components/HotelReservation/SelectHotel/BookingCodeFilter/bookingCodeFilter.module.css +++ b/apps/scandic-web/components/HotelReservation/SelectHotel/BookingCodeFilter/bookingCodeFilter.module.css @@ -1,7 +1,6 @@ .bookingCodeFilter { display: flex; justify-content: flex-end; - width: 100%; } .dialog { @@ -48,12 +47,6 @@ box-shadow: inset 0 0 0 8px var(--Surface-UI-Fill-Active); } -@media screen and (max-width: 767px) { - .bookingCodeFilter { - margin-bottom: var(--Space-x3); - } -} - .modalOverlay { position: fixed; inset: 0; @@ -101,6 +94,10 @@ } @media screen and (min-width: 768px) { + .bookingCodeFilter { + width: 100%; + } + .radioGroup { padding: var(--Space-x1); } diff --git a/apps/scandic-web/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContent/index.tsx b/apps/scandic-web/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContent/index.tsx index 349b43266..207187378 100644 --- a/apps/scandic-web/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContent/index.tsx +++ b/apps/scandic-web/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContent/index.tsx @@ -173,7 +173,9 @@ export default function SelectHotelContent({ {bookingCode && isBookingCodeRateAvailable && isRegularRateAvailable ? ( - +
+ +
) : null}
diff --git a/apps/scandic-web/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContent/selectHotelMapContent.module.css b/apps/scandic-web/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContent/selectHotelMapContent.module.css index 728c9ec0a..87409af38 100644 --- a/apps/scandic-web/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContent/selectHotelMapContent.module.css +++ b/apps/scandic-web/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContent/selectHotelMapContent.module.css @@ -1,7 +1,7 @@ .container .closeButton { pointer-events: initial; box-shadow: var(--button-box-shadow); - gap: var(--Spacing-x-half); + gap: var(--Space-x05); display: none; } @@ -15,8 +15,8 @@ align-items: center; position: relative; background-color: var(--Base-Surface-Secondary-light-Normal); - padding: 0 var(--Spacing-x2); - height: 44px; + padding: var(--Space-x025) var(--Space-x2); + min-height: 44px; } .container .listingContainer .filterContainer > button { @@ -31,6 +31,10 @@ color: var(--Component-Button-Brand-Secondary-On-fill-Default); } +.bookingCodeFilter { + width: auto; +} + @media (min-width: 768px) { .container .closeButton { display: flex; @@ -41,7 +45,7 @@ .listingContainer { background-color: var(--Base-Surface-Secondary-light-Normal); - padding: var(--Spacing-x3) var(--Spacing-x4) var(--Spacing-x3) + padding: var(--Space-x3) var(--Space-x4) var(--Space-x3) var(--Layout-Tablet-Margin-Margin-min); overflow-y: auto; min-width: 420px; @@ -54,20 +58,20 @@ .filterContainer { justify-content: flex-end; - padding: 0 0 var(--Spacing-x1); + padding: 0 0 var(--Space-x1); position: static; } .skeletonContainer { display: flex; flex-direction: column; - gap: var(--Spacing-x2); + gap: var(--Space-x2); } } @media (min-width: 1367px) { .listingContainer { - padding: var(--Spacing-x3) var(--Spacing-x4) var(--Spacing-x3) + padding: var(--Space-x3) var(--Space-x4) var(--Space-x3) var(--Layout-Desktop-Margin-Margin-min); } }