fix(BOOK-711): Added isFloating prop to decide when the booking widget should have a border radius

Approved-by: Bianca Widstam

packages/booking-flow/lib/components/BookingWidget/MobileToggleButton/button.module.css

@@ -14,7 +14,10 @@
   /* To avoid this "flash" the styling is set to transparent) */
   /* It is a non-standard css proprty, so shouldn't have too much of an effect on accessibility. */
   -webkit-tap-highlight-color: transparent;
-  border-radius: var(--Corner-Radius-md);
+
+  &.floating {
+    border-radius: var(--Corner-Radius-md);
+  }
 }
 
 .complete {

packages/booking-flow/lib/components/BookingWidget/MobileToggleButton/index.tsx

@@ -20,9 +20,11 @@ import type { BookingWidgetSchema } from "../Client"
 
 type BookingWidgetToggleButtonProps = {
   openMobileSearch: () => void
+  isFloating: boolean
 }
 export default function MobileToggleButton({
   openMobileSearch,
+  isFloating,
 }: BookingWidgetToggleButtonProps) {
   const intl = useIntl()
   const lang = useLang()
@@ -99,7 +101,8 @@ export default function MobileToggleButton({
     <Button
       className={cx(
         styles.mobileToggleButton,
-        locationAndDateIsSet ? styles.complete : styles.partial
+        locationAndDateIsSet ? styles.complete : styles.partial,
+        { [styles.floating]: isFloating }
       )}
       onPress={openMobileSearch}
     >