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/NavigationMenu/index.tsx

@@ -0,0 +1,48 @@
+"use client"
+
+import { useIntl } from "react-intl"
+
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
+import Link from "@scandic-hotels/design-system/Link"
+import { Typography } from "@scandic-hotels/design-system/Typography"
+
+import { LanguageSwitcher } from "@/components/LanguageSwitcher"
+import useLang from "@/hooks/useLang"
+
+import { UserMenu } from "../UserMenu"
+
+import styles from "./navigation-menu.module.css"
+
+export function NavigationMenu({ isMobile = false }: { isMobile?: boolean }) {
+  const intl = useIntl()
+  const lang = useLang()
+
+  return (
+    <div
+      className={`styles.menuItems ${isMobile ? styles.mobileMenu : styles.desktopMenu}`}
+    >
+      <Typography
+        variant={
+          isMobile
+            ? "Body/Paragraph/mdRegular"
+            : "Body/Supporting text (caption)/smRegular"
+        }
+      >
+        <Link
+          href="#"
+          color={isMobile ? "none" : "white"}
+          className={`${styles.menuItem} ${styles.contactLink}`}
+        >
+          {isMobile ? null : (
+            <MaterialIcon icon="call" size={16} color={"CurrentColor"} />
+          )}
+          {intl.formatMessage({ defaultMessage: "Contact us" })}
+        </Link>
+      </Typography>
+
+      <LanguageSwitcher currentLanguage={lang} isMobile={isMobile} />
+
+      {!isMobile && <UserMenu isMobile={isMobile} />}
+    </div>
+  )
+}