You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

94 lines
2.6 KiB

  1. import Link from "next/link";
  2. import { useTranslation } from "next-i18next";
  3. import Paypal from "../banner/Paypal";
  4. import { useBbox } from "./useBbox";
  5. const Footer = () => {
  6. const linkStyle = { whiteSpace: "nowrap" };
  7. const { t } = useTranslation();
  8. const [bboxLink1, link1] = useBbox();
  9. const [bboxLink2, link2] = useBbox();
  10. const [bboxLink3, link3] = useBbox();
  11. const [bboxLink4, link4] = useBbox();
  12. const [bboxLink5, link5] = useBbox();
  13. const [bboxLink6, link6] = useBbox();
  14. const [bboxLink7, link7] = useBbox();
  15. return (
  16. <footer className="text-center">
  17. <div>
  18. <ul className="tacky">
  19. <li
  20. ref={link1}
  21. className={bboxLink1.top === bboxLink2.top ? "" : "no-tack"}
  22. >
  23. <Link href="/" style={linkStyle}>
  24. {t("Homepage")}
  25. </Link>
  26. </li>
  27. <li
  28. ref={link2}
  29. className={bboxLink2.top === bboxLink3.top ? "" : "no-tack"}
  30. >
  31. <Link href="/faq" style={linkStyle}>
  32. {t("FAQ")}
  33. </Link>
  34. </li>
  35. <li
  36. ref={link3}
  37. className={bboxLink3.top === bboxLink4.top ? "" : "no-tack"}
  38. >
  39. <a href="mailto:app@mieuxvoter.fr?subject=[HELP]" style={linkStyle}>
  40. {t("resource.help")}
  41. </a>
  42. </li>
  43. <li
  44. ref={link4}
  45. className={bboxLink4.top === bboxLink5.top ? "" : "no-tack"}
  46. >
  47. <a
  48. href="https://mieuxvoter.fr/"
  49. target="_blank"
  50. rel="noopener noreferrer"
  51. style={linkStyle}
  52. >
  53. {t("Who are we?")}
  54. </a>
  55. </li>
  56. <li
  57. ref={link5}
  58. className={bboxLink5.top === bboxLink6.top ? "" : "no-tack"}
  59. >
  60. <Link href="/privacy-policy" style={linkStyle}>
  61. {t("Privacy policy")}
  62. </Link>
  63. </li>
  64. <li
  65. ref={link6}
  66. className={bboxLink6.top === bboxLink7.top ? "" : "no-tack"}
  67. >
  68. <Link href="/legal-notices" style={linkStyle}>
  69. {t("resource.legalNotices")}
  70. </Link>
  71. </li>
  72. <li ref={link7}>
  73. {" "}
  74. <a
  75. href="https://github.com/MieuxVoter"
  76. target="_blank"
  77. rel="noopener noreferrer"
  78. style={linkStyle}
  79. >
  80. {t("Source code")}
  81. </a>
  82. </li>
  83. </ul>
  84. </div>
  85. <div className="mt-3">
  86. <Paypal btnColor="btn-primary" />
  87. </div>
  88. </footer>
  89. );
  90. };
  91. export default Footer;