feat(WEB-38, WEB-9, WEB-19): add static page for sponsoring, add Header and add Footer

components/Current/LangPopup/index.tsx

@@ -0,0 +1,93 @@
+import { localeToLang } from "@/constants/locales";
+import { type Lang, langEnum } from "@/types/lang";
+import { headers } from "next/headers";
+
+export default function LangPopup({ lang }: { lang: Lang }) {
+  const headersList = headers();
+  const preferedLang = headersList.get("Accept-Language") ?? "";
+
+  const possibleLocales = Object.keys(localeToLang);
+
+  if (!possibleLocales.includes(preferedLang)) {
+    return null;
+  }
+
+  //@ts-ignore
+  const langOfChoice: Lang = localeToLang[preferedLang];
+
+  if (langOfChoice === lang) {
+    return null;
+  }
+
+  let language = "";
+  let viewIn = "";
+
+  switch (langOfChoice) {
+    case langEnum.de:
+      language = "Deutsch";
+      viewIn = "Ansicht in";
+      break;
+    case langEnum.da:
+      language = "Dansk";
+      viewIn = "Se in";
+      break;
+    case langEnum.fi:
+      language = "Suomi";
+      viewIn = "Katso in";
+      break;
+    case langEnum.no:
+      language = "Norsk";
+      viewIn = "Se in";
+      break;
+    case langEnum.sv:
+      language = "Svenska";
+      viewIn = "Visa in";
+      break;
+  }
+
+  return (
+    <div className="lang-popup hidden" id="lang-popup">
+      <a
+        href="#"
+        className="lang-popup__close"
+        title="Close language change popup"
+      >
+        <svg
+          xmlns="http://www.w3.org/2000/svg"
+          xmlnsXlink="http://www.w3.org/1999/xlink"
+          width="16px"
+          height="16px"
+          viewBox="0 0 16 16"
+          version="1.1"
+          style={{
+            stroke: "#757575",
+            width: "14px",
+            height: "14px",
+            display: "block",
+            strokeWidth: "2px",
+          }}
+        >
+          <title>Close</title>
+          <g id="web-close" fill-rule="evenodd">
+            <line x1="0" y1="0" x2="100%" y2="100%" />
+            <line x1="0" y1="100%" x2="100%" y2="0" />
+          </g>
+        </svg>
+      </a>
+      <div className="lang-popup__body">
+        <p className="lang-popup__msg">
+          You are viewing our website in English, would you like to change to{" "}
+          {language}?
+        </p>
+      </div>
+      <div className="lang-popup__footer">
+        <a href="" className="lang-popup__cta btn btn--primary">
+          {viewIn} {language}
+        </a>
+        <a href="#" className="lang-popup__cancel btn btn--link">
+          No thanks
+        </a>
+      </div>
+    </div>
+  );
+}