Merged in feat/SW-2782-create-sas-branded-header (pull request #2878)

feat(SW-2782): Updated header as per design, added language switcher and user menu

* feat(SW-2782): Updated header as per design, added language switcher and user menu

* feat(SW-2782): Updated UI as per design

* feat(SW-2782): Optimised code with use of Popover and modal from RAC


Approved-by: Anton Gunnarsson

apps/partner-sas/components/Menu/MobileMenu/index.tsx

@@ -0,0 +1,49 @@
+"use client"
+
+import { useState } from "react"
+import { Dialog, Modal } from "react-aria-components"
+import { useIntl } from "react-intl"
+
+import { Button } from "@scandic-hotels/design-system/Button"
+
+import { UserMenu } from "../UserMenu"
+
+import styles from "./mobile-menu.module.css"
+
+export function MobileMenu({ children }: React.PropsWithChildren) {
+  const intl = useIntl()
+
+  const closeMsg = intl.formatMessage({
+    defaultMessage: "Close menu",
+  })
+  const openMsg = intl.formatMessage({
+    defaultMessage: "Open menu",
+  })
+
+  const [isOpen, setIsOpen] = useState(false)
+
+  return (
+    <div className={styles.mobileMenu}>
+      <UserMenu isMobile={true} />
+      <Button
+        variant={"Text"}
+        type="button"
+        className={`${styles.hamburger} ${isOpen ? styles.isExpanded : ""}`}
+        aria-label={isOpen ? closeMsg : openMsg}
+        onPress={() => setIsOpen(!isOpen)}
+      >
+        <span className={styles.bar} />
+      </Button>
+      <Modal className={styles.modal} isOpen={isOpen}>
+        <Dialog
+          className={styles.dialog}
+          aria-label={intl.formatMessage({
+            defaultMessage: "Menu",
+          })}
+        >
+          {children}
+        </Dialog>
+      </Modal>
+    </div>
+  )
+}