diff --git a/components/HotelReservation/SelectRate/HotelInfoCard/hotelInfoCard.module.css b/components/HotelReservation/SelectRate/HotelInfoCard/hotelInfoCard.module.css index d6fba4bc2..e3e5642db 100644 --- a/components/HotelReservation/SelectRate/HotelInfoCard/hotelInfoCard.module.css +++ b/components/HotelReservation/SelectRate/HotelInfoCard/hotelInfoCard.module.css @@ -30,9 +30,9 @@ gap: var(--Spacing-x-half); background-color: var(--Base-Surface-Primary-light-Normal); position: absolute; - left: var(--Spacing-x2); - top: var(--Spacing-x2); - padding: 0 var(--Spacing-x1); + left: 8px; + top: 8px; + padding: var(--Spacing-x-quarter) var(--Spacing-x1); border-radius: var(--Corner-radius-Small); } @@ -42,16 +42,16 @@ } .hotelInformation { + display: flex; + flex-direction: column; gap: var(--Spacing-x1); width: min(607px, 100%); } -.title { - margin-bottom: var(--Spacing-x1); -} - -.body { - margin-top: var(--Spacing-x2); +.hotelAddressDescription { + display: flex; + flex-direction: column; + gap: var(--Spacing-x2); } .facilities { @@ -73,10 +73,6 @@ gap: var(--Spacing-x1); } -.facilityName { - color: var(--UI-Text-Medium-contrast); -} - .hotelAlert { max-width: var(--max-width-navigation); margin: 0 auto; diff --git a/components/HotelReservation/SelectRate/HotelInfoCard/index.tsx b/components/HotelReservation/SelectRate/HotelInfoCard/index.tsx index b75e2b4ae..cd1d11f98 100644 --- a/components/HotelReservation/SelectRate/HotelInfoCard/index.tsx +++ b/components/HotelReservation/SelectRate/HotelInfoCard/index.tsx @@ -49,19 +49,17 @@ export default function HotelInfoCard({ hotelData }: HotelInfoCardProps) {
- + <Title as="h2" textTransform="uppercase"> {hotelAttributes.name} - - {`${hotelAttributes.address.streetAddress}, ${hotelAttributes.address.city} ∙ ${hotelAttributes.location.distanceToCentre} ${intl.formatMessage({ id: "km to city center" })}`} - - - {hotelAttributes.hotelContent.texts.descriptions.medium} - +
+ + {`${hotelAttributes.address.streetAddress}, ${hotelAttributes.address.city} ∙ ${hotelAttributes.location.distanceToCentre} ${intl.formatMessage({ id: "km to city center" })}`} + + + {hotelAttributes.hotelContent.texts.descriptions.medium} + +
@@ -79,9 +77,7 @@ export default function HotelInfoCard({ hotelData }: HotelInfoCardProps) { color="grey80" /> )} - - {facility.name} - + {facility.name}
) })}