From 93b430594c8a0536c699e45fab605adefb72f5f3 Mon Sep 17 00:00:00 2001
From: Malaber <git@schaedler.rocks>
Date: Wed, 19 Mar 2025 21:59:05 +0100
Subject: [PATCH] Timer always where it should be

---
 js/components/Navigation.js      |  7 ++++++-
 public/static/css/tournament.css | 12 ++++++++++++
 2 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/js/components/Navigation.js b/js/components/Navigation.js
index 7a85b95..e6cd07f 100644
--- a/js/components/Navigation.js
+++ b/js/components/Navigation.js
@@ -26,13 +26,18 @@ export class TurniereNavigation extends React.Component {
             <Navbar color="light" light expand="lg" sticky="top">
                 <NavbarBrand className={'hide-below-260-w'} href="/">turnie.re</NavbarBrand>
                 {tournament && tournament.timerEnd &&
-                    <NavbarText className="m-auto">
+                    <NavbarText className="m-auto hide-above-992-w">
                         <span className={'hide-below-340-w'}>Spielzeit: </span><Timer timerEnd={tournament.timerEnd} />
                     </NavbarText>
                 }
                 <NavbarToggler onClick={this.toggle}/>
                 <Collapse isOpen={!this.state.collapsed} navbar>
                     <NavLinks/>
+                    {tournament && tournament.timerEnd &&
+                        <NavbarText className="m-auto hide-below-992-w">
+                            <span className={'hide-below-340-w'}>Spielzeit: </span><Timer timerEnd={tournament.timerEnd} />
+                        </NavbarText>
+                    }
                     <div className="ms-auto">
                         <LoginLogoutButtons/>
                     </div>
diff --git a/public/static/css/tournament.css b/public/static/css/tournament.css
index 7428667..611367e 100644
--- a/public/static/css/tournament.css
+++ b/public/static/css/tournament.css
@@ -107,3 +107,15 @@
         display: none;
     }
 }
+
+@media (max-width: 991.98px) {
+    .hide-below-992-w {
+        display: none;
+    }
+}
+
+@media (min-width: 992px) {
+    .hide-above-992-w {
+        display: none;
+    }
+}