diff --git a/packages/booking-flow/lib/components/EnterDetails/Confirm/SmsConfirmation.tsx b/packages/booking-flow/lib/components/EnterDetails/Confirm/SmsConfirmation.tsx index d40a41c19..7d10fa4f1 100644 --- a/packages/booking-flow/lib/components/EnterDetails/Confirm/SmsConfirmation.tsx +++ b/packages/booking-flow/lib/components/EnterDetails/Confirm/SmsConfirmation.tsx @@ -12,7 +12,7 @@ export default function SmsConfirmation() { {intl.formatMessage({ id: "booking.smsConfirmationLabel", defaultMessage: - "I would like to get my booking confirmation via sms", + "I would like to receive my booking confirmation via sms.", })} diff --git a/packages/booking-flow/lib/components/EnterDetails/Confirm/confirm.module.css b/packages/booking-flow/lib/components/EnterDetails/Confirm/confirm.module.css index ede307156..25e7dcc1a 100644 --- a/packages/booking-flow/lib/components/EnterDetails/Confirm/confirm.module.css +++ b/packages/booking-flow/lib/components/EnterDetails/Confirm/confirm.module.css @@ -3,6 +3,20 @@ gap: var(--Space-x3); } +.redemptionInfo { + display: flex; + align-items: flex-start; + background-color: var(--Surface-Secondary-Default); + border-radius: var(--Corner-Radius-lg); + padding: var(--Space-x2); + gap: var(--Space-x1); +} + +.textWrapper { + display: flex; + flex-direction: column; + gap: var(--Space-x05); +} .selections { background-color: var(--Surface-Secondary-Default); border-radius: var(--Corner-Radius-lg); diff --git a/packages/booking-flow/lib/components/EnterDetails/Confirm/index.tsx b/packages/booking-flow/lib/components/EnterDetails/Confirm/index.tsx index 1ab82fede..83a3a8752 100644 --- a/packages/booking-flow/lib/components/EnterDetails/Confirm/index.tsx +++ b/packages/booking-flow/lib/components/EnterDetails/Confirm/index.tsx @@ -2,6 +2,7 @@ import { useIntl } from "react-intl" import { Divider } from "@scandic-hotels/design-system/Divider" +import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon" import { Typography } from "@scandic-hotels/design-system/Typography" import TermsAndConditions from "../Payment/TermsAndConditions" @@ -36,15 +37,29 @@ export default function ConfirmBooking({ if (isRedemptionBooking) { return (
- {intl.formatMessage({ - id: "enterDetails.confirmBooking.redemptionGuaranteeInfo", - defaultMessage: - "When you confirm the booking the room will be guaranteed for late arrival. If you fail to arrive without cancelling in advance or if you cancel after 18:00 local time, you will be charged for one reward night.", - })} -
-+ {intl.formatMessage({ + id: "enterDetails.guarantee.guaranteeLabel", + defaultMessage: "Guarantee for late arrival", + })} +
++ {intl.formatMessage({ + id: "enterDetails.confirmBooking.rewardNightGuaranteeInfo", + defaultMessage: + "When you complete the booking the room will be guaranteed for late arrival. The hotel will hold your booking, even if you arrive after 18:00. In case of a no-show, you will be charged for one reward night.", + })} +
+