Merged in feat/SW-3542-update-color-variables-to- (pull request #2970)

feat(SW-3542): Updated the color variables for MVP

Approved-by: Joakim Jäderberg

packages/booking-flow/lib/components/BookingWidget/BookingWidgetForm/FormContent/index.tsx

@@ -7,8 +7,8 @@ import { useIntl } from "react-intl"
 
 import { hotelreservation } from "@scandic-hotels/common/constants/routes/hotelReservation"
 import { dt } from "@scandic-hotels/common/dt"
+import { Button } from "@scandic-hotels/design-system/Button"
 import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
-import { OldDSButton as Button } from "@scandic-hotels/design-system/OldDSButton"
 import SkeletonShimmer from "@scandic-hotels/design-system/SkeletonShimmer"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 import { SEARCH_TYPE_REDEMPTION } from "@scandic-hotels/trpc/constants/booking"
@@ -99,13 +99,7 @@ export default function FormContent({
         </div>
       </div>
       <div className={cx(styles.buttonContainer, styles.showOnTablet)}>
-        <Button
-          className={styles.button}
-          form={formId}
-          intent="primary"
-          theme="base"
-          type="submit"
-        >
+        <Button className={styles.button} form={formId} type="submit">
           <span className={styles.icon}>
             <MaterialIcon icon="search" color="Icon/Inverted" size={28} />
           </span>
@@ -130,10 +124,10 @@ export default function FormContent({
         <Button
           className={styles.button}
           form={formId}
-          intent="primary"
-          theme="base"
+          variant={"Primary"}
+          size={"Medium"}
           type="submit"
-          disabled={isSearching}
+          isDisabled={isSearching}
         >
           <Typography
             variant="Body/Supporting text (caption)/smBold"
@@ -195,13 +189,7 @@ export function BookingWidgetFormContentSkeleton() {
         </div>
       </div>
       <div className={cx(styles.buttonContainer, styles.showOnTablet)}>
-        <Button
-          className={styles.button}
-          intent="primary"
-          theme="base"
-          type="submit"
-          disabled
-        >
+        <Button className={styles.button} type="submit" isDisabled>
           <span className={styles.icon}>
             <MaterialIcon icon="search" color="Icon/Inverted" size={28} />
           </span>
@@ -213,10 +201,10 @@ export function BookingWidgetFormContentSkeleton() {
       <div className={cx(styles.buttonContainer, styles.hideOnTablet)}>
         <Button
           className={styles.button}
-          intent="primary"
-          theme="base"
+          variant={"Primary"}
+          size={"Medium"}
           type="submit"
-          disabled
+          isDisabled
         >
           <Typography
             variant="Body/Supporting text (caption)/smBold"

packages/booking-flow/lib/components/BookingWidget/GuestsRoomsPicker/Form.tsx

@@ -10,6 +10,7 @@ import { Tooltip } from "@scandic-hotels/design-system/Tooltip"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 import { SEARCH_TYPE_REDEMPTION } from "@scandic-hotels/trpc/constants/booking"
 
+import { useBookingFlowConfig } from "../../../bookingFlowConfig/bookingFlowConfigContext"
 import { GuestsRoom } from "./GuestsRoom"
 
 import styles from "./guests-rooms-picker.module.css"
@@ -29,6 +30,7 @@ export default function GuestsRoomsPickerDialog({
   onClose,
 }: GuestsRoomsPickerDialogProps) {
   const intl = useIntl()
+  const config = useBookingFlowConfig()
   const { getFieldState, trigger, setValue, getValues } =
     useFormContext<BookingWidgetSchema>()
   const roomsValue = useWatch<BookingWidgetSchema, "rooms">({ name: "rooms" })
@@ -40,10 +42,15 @@ export default function GuestsRoomsPickerDialog({
   })
   // Disable add room if booking code is either voucher or corporate cheque, or reward night is enabled
   const addRoomDisabledTextForSpecialRate = getValues(SEARCH_TYPE_REDEMPTION)
-    ? intl.formatMessage({
-        defaultMessage:
-          "Multi-room booking is not available with reward night.",
-      })
+    ? config.variant === "partner-sas"
+      ? intl.formatMessage({
+          defaultMessage:
+            "Multi-room booking is not available with EuroBonus points.",
+        })
+      : intl.formatMessage({
+          defaultMessage:
+            "Multi-room booking is not available with reward night.",
+        })
     : getValues("bookingCode.value")?.toLowerCase().startsWith("vo") &&
       intl.formatMessage({
         defaultMessage:

packages/booking-flow/lib/components/BookingWidget/GuestsRoomsPicker/guests-rooms-picker.module.css

@@ -90,7 +90,6 @@
 }
 
 .roomActionsButton {
-  margin-left: auto;
   color: var(--Base-Text-Accent);
 }