screen size calc now done with useBreakpoint hook

.gitignore

@@ -1,4 +1,5 @@
 # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 
 TODO
 

.idea/.gitignore

@@ -0,0 +1,8 @@
+# Default ignored files
+/shelf/
+/workspace.xml
+# Editor-based HTTP Client requests
+/httpRequests/
+# Datasource local storage ignored files
+/dataSources/
+/dataSources.local.xml

.idea/discord.xml

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="DiscordProjectSettings">
+    <option name="show" value="ASK" />
+    <option name="description" value="" />
+  </component>
+</project>

.idea/echecsfrance.iml

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="JAVA_MODULE" version="4">
+  <component name="NewModuleRootManager" inherit-compiler-output="true">
+    <exclude-output />
+    <content url="file://$MODULE_DIR$">
+      <excludeFolder url="file://$MODULE_DIR$/.idea" />
+    </content>
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>

.idea/inspectionProfiles/Project_Default.xml

@@ -0,0 +1,6 @@
+<component name="InspectionProjectProfileManager">
+  <profile version="1.0">
+    <option name="myName" value="Project Default" />
+    <inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
+  </profile>
+</component>

.idea/misc.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectRootManager">
+    <output url="file://$PROJECT_DIR$/out" />
+  </component>
+</project>

.idea/modules.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/echecsfrance.iml" filepath="$PROJECT_DIR$/.idea/echecsfrance.iml" />
+    </modules>
+  </component>
+</project>

.idea/vcs.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>

TODO

@@ -1,18 +0,0 @@
-BUGS
-//TODO tournament page load is weird on 2nd click. On safari it pauses for a few seconds. Is it trying to load the entire page before displaying?
-//TODO Nodemailer 'from' reverts to echecsfrance@gmail.com - quick fix done with sender address in subject line
-
-----------------------------------------------------------------
-DESIGN CHANGES
-//TODO font size on mobile screen
-//TODO mobile navbar is creeping into the page by a few pixels when hidden - move it to the right a bit. It is easier to see in light mode. I cant see this on Linux
-//TODO logo for navbar and favicon
-//TODO mobile map needs improving
-
-----------------------------------------------------------------
-LOGIC
-//TODO error handling - check everything, wrap in try/catch or use library to handle, log errors
-
-MISC
-----------------------------------------------------------------
-//TODO move smaller ui components into a new folder, and make them reusable - such as using generic prop names

app/[lang]/tournois/ScrollToTopButton.tsx

@@ -5,21 +5,11 @@ import { ScrollableElement } from "@/types";
 import { FaArrowUp } from "react-icons/fa";
 import { handleScrollToTop } from "@/handlers/scrollHandlers";
 import { useEffect, useRef, useState } from "react";
+import {useBreakpoint} from "@/hooks/tailwind";
 
 const ScrollToTopButton = () => {
   const scrollToTopElementRef = useRef<ScrollableElement | null>(null);
-  const [isLgScreen, setIsLgScreen] = useState(false);
+  const isLgScreen = useBreakpoint("lg");
-
-  // calculate screen size
-  useEffect(() => {
-    const handleResize = () => {
-      setIsLgScreen(window.innerWidth >= 1024);
-    };
-    handleResize();
-
-    window.addEventListener("resize", handleResize);
-    return () => window.removeEventListener("resize", handleResize);
-  });
 
   // determine scrollable element based on screen size - window or div
   useEffect(() => {