diff --git a/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/booking-code.module.css b/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/booking-code.module.css index c51f67809..76609930c 100644 --- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/booking-code.module.css +++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/booking-code.module.css @@ -11,6 +11,11 @@ padding: var(--Spacing-x1) var(--Spacing-x-one-and-half); } +.bookingCodeErrorContainer { + display: flex; + flex-direction: column; +} + .bookingCodeLabel { display: flex; align-items: center; @@ -54,6 +59,7 @@ .bookingCodeError { white-space: normal; + margin-bottom: 1rem; } @media screen and (max-width: 767px) { .hideOnMobile { diff --git a/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx b/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx index 1108b9e15..3981fe836 100644 --- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx +++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx @@ -8,13 +8,13 @@ import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon" import { REDEMPTION } from "@/constants/booking" +import ButtonLink from "@/components/ButtonLink" import Modal from "@/components/Modal" import Button from "@/components/TempDesignSystem/Button" import Checkbox from "@/components/TempDesignSystem/Form/Checkbox" import Input from "@/components/TempDesignSystem/Form/Input" import { getErrorMessage } from "@/components/TempDesignSystem/Form/Input/errors" import Switch from "@/components/TempDesignSystem/Form/Switch" -import Link from "@/components/TempDesignSystem/Link" import Body from "@/components/TempDesignSystem/Text/Body" import Caption from "@/components/TempDesignSystem/Text/Caption" @@ -292,26 +292,18 @@ function BookingCodeError({ codeError }: { codeError: FieldError }) { className={styles.errorIcon} /> {codeError.message === bookingWidgetErrors.BOOKING_CODE_ONLY_ENGLISH ? ( - // eslint-disable-next-line formatjs/no-literal-string-in-jsx - - { - /* eslint-disable-next-line formatjs/no-literal-string-in-jsx */ - "Dieser Code ist nur auf unserer " - } - +
+ + { + /* eslint-disable-next-line formatjs/no-literal-string-in-jsx */ + "Dieser Code ist nur auf unserer englischen Website gültig" + } + + {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */} - {"englischen Website"} - - { - /* eslint-disable-next-line formatjs/no-literal-string-in-jsx */ - " gültig" - } - + {"Englischen Website"} + +
) : ( getErrorMessage(intl, codeError.message) )}