Code tidy

app/[lang]/components/Navbar.tsx

@@ -6,6 +6,12 @@ import Hamburger from "./Hamburger";
 export default function Navbar() {
   const t = useTranslations("Nav");
 
+  const links = [
+    { title: t("tournaments"), route: "/tournois" },
+    { title: t("about"), route: "/qui-sommes-nous" },
+    { title: t("contact"), route: "/contactez-nous" },
+  ];
+
   return (
     <nav
       className="relative mt-0 h-16 w-full overflow-x-clip border-b-[1px] bg-white px-5 dark:border-gray-700 dark:bg-gray-800"
@@ -29,30 +35,16 @@ export default function Navbar() {
           data-test="desktop-menu"
         >
           <ul className="list-reset flex h-full flex-1 items-center justify-around text-gray-900 no-underline dark:text-white md:flex-none">
-            <li className="mr-10 h-full">
-              <Link
-                className="inline-flex h-full items-center border-b-4 border-t-4 border-transparent transition-all duration-300 ease-in-out hover:border-b-teal-600"
-                href="/tournois"
-              >
-                {t("tournaments")}
-              </Link>
-            </li>
-            <li className="mr-10 h-full">
-              <Link
-                className="inline-flex h-full items-center border-b-4 border-t-4 border-transparent transition-all duration-300 ease-in-out hover:border-b-teal-600"
-                href="/qui-sommes-nous"
-              >
-                {t("about")}
-              </Link>
-            </li>
-            <li className="mr-10 h-full">
-              <Link
-                className="inline-flex h-full items-center border-b-4 border-t-4 border-transparent transition-all duration-300 ease-in-out hover:border-b-teal-600"
-                href="/contactez-nous"
-              >
-                {t("contact")}
-              </Link>
-            </li>
+            {links.map(({ title, route }) => (
+              <li key={route} className="mr-10 h-full">
+                <Link
+                  className="inline-flex h-full items-center border-b-4 border-t-4 border-transparent transition-all duration-300 ease-in-out hover:border-b-teal-600"
+                  href={route}
+                >
+                  {title}
+                </Link>
+              </li>
+            ))}
           </ul>
         </div>
       </div>

app/[lang]/components/TestableLayout.tsx

@@ -1,7 +1,8 @@
 import { NextIntlClientProvider, AbstractIntlMessages } from "next-intl";
 import { ReactNode } from "react";
 
-import "@/app/globals.css";
+import "@/css/globals.css";
+
 import Navbar from "./Navbar";
 import Footer from "./Footer";
 

app/[lang]/layout.tsx

@@ -5,7 +5,8 @@ import { getTranslator } from "next-intl/server";
 import { notFound } from "next/navigation";
 import { ReactNode } from "react";
 
-import "@/app/globals.css";
+import "@/css/globals.css";
+
 import Providers from "./providers";
 import TestableLayout from "./components/TestableLayout";
 

app/globals.css

@@ -1,44 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-:root {
-  --foreground-rgb: 0, 0, 0;
-  --background-start-rgb: 214, 219, 220;
-  --background-end-rgb: 255, 255, 255;
-}
-
-@media (prefers-color-scheme: light) {
-  :root {
-    --foreground-rgb: 255, 255, 255;
-    --background-start-rgb: 0, 0, 0;
-    --background-end-rgb: 0, 0, 0;
-  }
-}
-
-body {
-  color: rgb(var(--foreground-rgb));
-  background: linear-gradient(
-      to bottom,
-      transparent,
-      rgb(var(--background-end-rgb))
-    )
-    rgb(var(--background-start-rgb));
-}
-
-input[type="search"]::-ms-clear {
-  display: none;
-  width: 0;
-  height: 0;
-}
-input[type="search"]::-ms-reveal {
-  display: none;
-  width: 0;
-  height: 0;
-}
-input[type="search"]::-webkit-search-decoration,
-input[type="search"]::-webkit-search-cancel-button,
-input[type="search"]::-webkit-search-results-button,
-input[type="search"]::-webkit-search-results-decoration {
-  display: none;
-}