/* global React */
function NxFooter({ lang }) {
  const t = window.NX_COPY[lang].footer;
  return (
    <footer className="nx-footer">
      <div className="nx-container nx-container--wide">
        <div className="nx-footer__inner">
          <div className="nx-footer__brand">
            <div className="nx-footer__tagline">{t.tagline}</div>
            <div className="nx-footer__addr">
              <strong style={{ color: "#fff", display: "block", marginBottom: 4 }}>{t.companyLine1}</strong>
              <span style={{ display: "block", marginTop: 10 }}>
                {t.addressLines.map((l, i) => <span key={i} style={{ display: "block" }}>{l}</span>)}
              </span>
              <span style={{ display: "block", marginTop: 10 }}>
                {t.meta.map((l, i) => <span key={i} style={{ display: "block" }}>{l}</span>)}
              </span>
            </div>
          </div>
          <div className="nx-footer__cols">
            {t.cols.map((c) => (
              <div key={c.h}>
                <div className="nx-footer__h">{c.h}</div>
                {c.links.map((l) => <a key={l} href="#">{l}</a>)}
              </div>
            ))}
          </div>
        </div>
        <div className="nx-footer__legal">
          <span>{t.legal}</span>
          <span>
            <a href="mailto:contact@nexentia.ltd" style={{ color: "inherit" }}>contact@nexentia.ltd</a> · <a href="tel:+35796916733" style={{ color: "inherit" }}>+357 96 916 733</a> · <a href="https://www.linkedin.com/in/marcel-neumann-1a759894/" target="_blank" rel="noopener" style={{ color: "inherit" }}>LinkedIn</a>
          </span>
        </div>
      </div>
    </footer>
  );
}
window.NxFooter = NxFooter;