From 0a1f3143d74bf94d8f0e7ac3161ad2b0504450b5 Mon Sep 17 00:00:00 2001
From: Dicken <webmaster@sermerpartydorf.de>
Date: Sun, 26 Jul 2026 13:23:44 +0200
Subject: [PATCH] round57: Scroll-to-top-Button hoeher positioniert,
 Laufzeit-Anzeige in Einstellungen lesbar formatiert

---
 .../src/components/ScrollToTopButton.tsx      |  2 +-
 .../src/routes/admin/SettingsPage.tsx         | 23 ++++++++++++++++++-
 2 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/apps/frontend/src/components/ScrollToTopButton.tsx b/apps/frontend/src/components/ScrollToTopButton.tsx
index ce3740b..4bc08c2 100644
--- a/apps/frontend/src/components/ScrollToTopButton.tsx
+++ b/apps/frontend/src/components/ScrollToTopButton.tsx
@@ -26,7 +26,7 @@ export function ScrollToTopButton() {
       onClick={() => window.scrollTo({ top: 0, behavior: "smooth" })}
       title="Nach oben scrollen"
       aria-label="Nach oben scrollen"
-      className="fixed bottom-5 right-5 z-30 flex h-11 w-11 items-center justify-center rounded-full
+      className="fixed bottom-20 right-5 z-30 flex h-11 w-11 items-center justify-center rounded-full
         border border-black/10 bg-white/90 text-lg text-black/70 shadow-lg backdrop-blur-md
         transition-opacity hover:bg-white dark:border-white/10 dark:bg-neutral-900/90
         dark:text-white/70 dark:hover:bg-neutral-900"
diff --git a/apps/frontend/src/routes/admin/SettingsPage.tsx b/apps/frontend/src/routes/admin/SettingsPage.tsx
index 0c9f42b..1d9706b 100644
--- a/apps/frontend/src/routes/admin/SettingsPage.tsx
+++ b/apps/frontend/src/routes/admin/SettingsPage.tsx
@@ -8,6 +8,27 @@ import { useTheme } from "../../hooks/useTheme.js";
 import { useSettings } from "../../hooks/useSettings.js";
 import { AdminPageHeader } from "./AdminPageHeader.js";
 
+/**
+ * Formatiert eine Sekundenzahl als "Xd Yh Zm Ws" (nur die tatsächlich
+ * relevanten Einheiten, z. B. "3h 12m 5s" ohne führende "0d") - vorher stand
+ * hier die rohe Sekundenzahl ("uptimeSeconds"), z. B. "435822s", was bei
+ * einem Blick in die Einstellungen kaum sinnvoll einzuordnen war.
+ */
+function formatUptime(totalSeconds: number): string {
+  const days = Math.floor(totalSeconds / 86400);
+  const hours = Math.floor((totalSeconds % 86400) / 3600);
+  const minutes = Math.floor((totalSeconds % 3600) / 60);
+  const seconds = Math.floor(totalSeconds % 60);
+
+  const parts: string[] = [];
+  if (days > 0) parts.push(`${days}d`);
+  if (days > 0 || hours > 0) parts.push(`${hours}h`);
+  if (days > 0 || hours > 0 || minutes > 0) parts.push(`${minutes}m`);
+  parts.push(`${seconds}s`);
+
+  return parts.join(" ");
+}
+
 function InfoRow({ label, value }: { label: string; value: string }) {
   return (
     <div className="flex items-center justify-between border-b border-black/5 py-3 last:border-0 dark:border-white/5">
@@ -489,7 +510,7 @@ export function SettingsPage() {
             <div>
               <InfoRow label="Status" value={health.status} />
               <InfoRow label="Version" value={health.version} />
-              <InfoRow label="Läuft seit" value={`${health.uptimeSeconds}s`} />
+              <InfoRow label="Läuft seit" value={formatUptime(health.uptimeSeconds)} />
             </div>
           ) : (
             <p className="text-sm text-black/40 dark:text-white/40">Lade …</p>