diff --git a/apps/partner-sas/app/[lang]/layout.tsx b/apps/partner-sas/app/[lang]/layout.tsx
index 3a7637130..4665bde81 100644
--- a/apps/partner-sas/app/[lang]/layout.tsx
+++ b/apps/partner-sas/app/[lang]/layout.tsx
@@ -14,6 +14,8 @@ import { getMessages } from "@/i18n"
import ClientIntlProvider from "@/i18n/Provider"
import { setLang } from "@/i18n/serverContext"
+import { Footer } from "../components/Footer/Footer"
+import { Header } from "../components/Header/Header"
import {
trackAccordionItemOpen,
trackBookingSearchClick,
@@ -24,8 +26,8 @@ import {
import type { Metadata } from "next"
export const metadata: Metadata = {
- title: "Create Next App",
- description: "Generated by create next app",
+ title: "SAS by Scandic Hotels",
+ description: "This text should be updated.",
}
type LangParams = {
@@ -74,21 +76,10 @@ export default async function RootLayout(props: RootLayoutProps) {
trackGenericEvent,
}}
>
-
- {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
- SAS
-
+
{props.bookingwidget}
{children}
+
diff --git a/apps/partner-sas/app/components/Footer/Footer.tsx b/apps/partner-sas/app/components/Footer/Footer.tsx
new file mode 100644
index 000000000..087b5af2e
--- /dev/null
+++ b/apps/partner-sas/app/components/Footer/Footer.tsx
@@ -0,0 +1,67 @@
+/* eslint-disable formatjs/no-literal-string-in-jsx */
+import Link from "next/link"
+
+import Image from "@scandic-hotels/design-system/Image"
+import { Typography } from "@scandic-hotels/design-system/Typography"
+
+import { PoweredByScandic } from "../PoweredByScandic/PoweredByScandic"
+
+import styles from "./footer.module.css"
+
+export function Footer() {
+ return (
+
+
+
+
+
+
+ Privacy policy
+
+
+
+
+ Terms of use
+
+
+
+
+ Your privacy choices
+
+
+
+
+ Cookie Policy
+
+
+
+
+ More links
+
+
+
+
+
+
+ © 1999 Something something.
+
+
+
+ [Place holder text], LP and SAS are not responsible for content on
+ external Web sites.
+
+
+
+
+ )
+}
diff --git a/apps/partner-sas/app/components/Footer/footer.module.css b/apps/partner-sas/app/components/Footer/footer.module.css
new file mode 100644
index 000000000..db26af1d9
--- /dev/null
+++ b/apps/partner-sas/app/components/Footer/footer.module.css
@@ -0,0 +1,49 @@
+.root {
+ background-color: var(--Base-Surface-Primary-light-Normal);
+ height: 100px;
+}
+
+.sasLogo {
+ height: auto;
+ width: 90px;
+}
+
+.top {
+ padding: 40px 16px 32px;
+ display: flex;
+ flex-direction: column;
+ gap: 24px;
+
+ @media screen and (min-width: 768px) {
+ padding: 40px;
+ }
+}
+
+.bottom {
+ background-color: var(--TEMP-sas-default);
+ color: white;
+ padding: 32px 16px 40px;
+
+ @media screen and (min-width: 768px) {
+ padding: 32px 40px 40px;
+ }
+}
+
+.links {
+ display: flex;
+ flex-direction: column;
+ gap: 8px;
+
+ @media screen and (min-width: 768px) {
+ flex-direction: row;
+ }
+}
+
+.link {
+ text-decoration: none;
+ color: var(--TEMP-sas-40);
+
+ &:hover {
+ text-decoration: underline;
+ }
+}
diff --git a/apps/partner-sas/app/components/Header/Header.tsx b/apps/partner-sas/app/components/Header/Header.tsx
new file mode 100644
index 000000000..6afd16e71
--- /dev/null
+++ b/apps/partner-sas/app/components/Header/Header.tsx
@@ -0,0 +1,25 @@
+import Image from "@scandic-hotels/design-system/Image"
+
+import { PoweredByScandic } from "../PoweredByScandic/PoweredByScandic"
+
+import styles from "./header.module.css"
+
+export function Header() {
+ return (
+ <>
+
+
+ >
+ )
+}
diff --git a/apps/partner-sas/app/components/Header/header.module.css b/apps/partner-sas/app/components/Header/header.module.css
new file mode 100644
index 000000000..ca08e5c22
--- /dev/null
+++ b/apps/partner-sas/app/components/Header/header.module.css
@@ -0,0 +1,25 @@
+.header {
+ background-color: var(--TEMP-sas-default);
+ color: white;
+ display: flex;
+ align-items: center;
+ padding: 16px;
+
+ @media screen and (min-width: 768px) {
+ padding: 20px 40px;
+ }
+}
+
+.logo {
+ height: auto;
+ width: 90px;
+}
+
+.poweredBy {
+ padding: 6px 16px;
+ background-color: var(--Base-Surface-Primary-light-Normal);
+
+ @media screen and (min-width: 768px) {
+ padding: 8px 40px;
+ }
+}
diff --git a/apps/partner-sas/app/components/PoweredByScandic/PoweredByScandic.tsx b/apps/partner-sas/app/components/PoweredByScandic/PoweredByScandic.tsx
new file mode 100644
index 000000000..077901121
--- /dev/null
+++ b/apps/partner-sas/app/components/PoweredByScandic/PoweredByScandic.tsx
@@ -0,0 +1,25 @@
+import Image from "@scandic-hotels/design-system/Image"
+import { Typography } from "@scandic-hotels/design-system/Typography"
+
+import styles from "./poweredByScandic.module.css"
+
+export function PoweredByScandic() {
+ return (
+
+
+ {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
+ Powered by
+
+
+
+
+
+ )
+}
diff --git a/apps/partner-sas/app/components/PoweredByScandic/poweredByScandic.module.css b/apps/partner-sas/app/components/PoweredByScandic/poweredByScandic.module.css
new file mode 100644
index 000000000..4fd25d410
--- /dev/null
+++ b/apps/partner-sas/app/components/PoweredByScandic/poweredByScandic.module.css
@@ -0,0 +1,13 @@
+.root {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ color: var(--TEMP-sas-20);
+}
+
+.logo {
+ max-height: 14px;
+ max-width: 65px;
+ height: auto;
+ width: 100%;
+}
diff --git a/apps/partner-sas/globals.css b/apps/partner-sas/globals.css
index dd827f06d..554110c00 100644
--- a/apps/partner-sas/globals.css
+++ b/apps/partner-sas/globals.css
@@ -38,6 +38,10 @@
--modal-box-shadow: 0px 4px 24px 0px rgba(38, 32, 30, 0.08);
--popup-box-shadow: 0 0 14px 6px rgba(0, 0, 0, 0.1);
+ --TEMP-sas-default: #000099;
+ --TEMP-sas-20: #00175c;
+ --TEMP-sas-40: #0030c2;
+
@supports (interpolate-size: allow-keywords) {
interpolate-size: allow-keywords;
}
diff --git a/apps/partner-sas/public/_static/img/sas-logotype-white.svg b/apps/partner-sas/public/_static/img/sas-logotype-white.svg
new file mode 100644
index 000000000..a7ade3219
--- /dev/null
+++ b/apps/partner-sas/public/_static/img/sas-logotype-white.svg
@@ -0,0 +1,3 @@
+
diff --git a/apps/partner-sas/public/_static/img/sas-logotype.svg b/apps/partner-sas/public/_static/img/sas-logotype.svg
new file mode 100644
index 000000000..326b5559e
--- /dev/null
+++ b/apps/partner-sas/public/_static/img/sas-logotype.svg
@@ -0,0 +1,3 @@
+
diff --git a/apps/partner-sas/public/_static/img/scandic-logotype.svg b/apps/partner-sas/public/_static/img/scandic-logotype.svg
new file mode 100644
index 000000000..e19f2974a
--- /dev/null
+++ b/apps/partner-sas/public/_static/img/scandic-logotype.svg
@@ -0,0 +1,26 @@
+
+
+
+