/* 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 (
    <div className={styles.root}>
      <div className={styles.top}>
        <div>
          <Image
            alt="SAS logotype"
            className={styles.sasLogo}
            src="/_static/img/sas-logotype.svg"
            height={32}
            width={90}
            sizes="100vw"
          />
          <PoweredByScandic />
        </div>
        <div className={styles.links}>
          <Typography variant="Body/Paragraph/mdRegular">
            <Link href="#" className={styles.link}>
              Privacy policy
            </Link>
          </Typography>
          <Typography variant="Body/Paragraph/mdRegular">
            <Link href="#" className={styles.link}>
              Terms of use
            </Link>
          </Typography>
          <Typography variant="Body/Paragraph/mdRegular">
            <Link href="#" className={styles.link}>
              Your privacy choices
            </Link>
          </Typography>
          <Typography variant="Body/Paragraph/mdRegular">
            <Link href="#" className={styles.link}>
              Cookie Policy
            </Link>
          </Typography>
          <Typography variant="Body/Paragraph/mdRegular">
            <Link href="#" className={styles.link}>
              More links
            </Link>
          </Typography>
        </div>
      </div>
      <div className={styles.bottom}>
        <Typography variant="Body/Supporting text (caption)/smRegular">
          <p>© 1999 Something something.</p>
        </Typography>
        <Typography variant="Body/Supporting text (caption)/smRegular">
          <p>
            [Place holder text], LP and SAS are not responsible for content on
            external Web sites.
          </p>
        </Typography>
      </div>
    </div>
  )
}