v1 #1
@@ -11,8 +11,8 @@ html {
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: "Arial", sans-serif;
|
||||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||
font-family: "Segoe UI", Arial, sans-serif;
|
||||
background: linear-gradient(135deg, #49bae4 0%, #223c83 100%);
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
display: flex;
|
||||
@@ -97,7 +97,7 @@ body {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
background: #e74c3c;
|
||||
background: #f50f0f;
|
||||
transition: all 0.3s ease;
|
||||
position: relative;
|
||||
}
|
||||
@@ -115,8 +115,8 @@ body {
|
||||
}
|
||||
|
||||
.heartbeat-indicator.active {
|
||||
background: #2ecc71;
|
||||
box-shadow: 0 0 10px rgba(46, 204, 113, 0.5);
|
||||
background: #00ff15;
|
||||
box-shadow: 0 0 10px rgba(73, 186, 228, 0.5);
|
||||
}
|
||||
|
||||
/* Batterie-Banner Styling */
|
||||
@@ -125,7 +125,7 @@ body {
|
||||
top: -100px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);
|
||||
background: linear-gradient(135deg, #f59d0f 0%, #e67e22 100%);
|
||||
color: white;
|
||||
padding: 15px 20px;
|
||||
text-align: center;
|
||||
@@ -261,6 +261,9 @@ body {
|
||||
font-size: clamp(1.8rem, 4vw, 2.5rem);
|
||||
margin-bottom: 0.5vh;
|
||||
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
font-family: "Segoe UI", Arial, sans-serif;
|
||||
}
|
||||
|
||||
.header p {
|
||||
@@ -306,6 +309,9 @@ body {
|
||||
font-size: clamp(1.2rem, 2.5vw, 1.8rem);
|
||||
margin-bottom: clamp(10px, 1vh, 15px);
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
font-family: "Segoe UI", Arial, sans-serif;
|
||||
}
|
||||
|
||||
.swimmer-name {
|
||||
@@ -356,25 +362,25 @@ body {
|
||||
}
|
||||
|
||||
.status.finished {
|
||||
background-color: rgba(52, 152, 219, 0.3);
|
||||
border: 2px solid #3498db;
|
||||
background-color: rgba(73, 186, 228, 0.3);
|
||||
border: 2px solid #49bae4;
|
||||
}
|
||||
|
||||
.status.ready {
|
||||
background-color: rgba(46, 204, 113, 0.3);
|
||||
border: 2px solid #2ecc71;
|
||||
background-color: rgba(34, 60, 131, 0.3);
|
||||
border: 2px solid #223c83;
|
||||
animation: pulse 1s infinite;
|
||||
}
|
||||
|
||||
.status.armed {
|
||||
background-color: rgb(197, 194, 0);
|
||||
border: 2px solid #fbff00;
|
||||
background-color: rgba(245, 157, 15, 0.3);
|
||||
border: 2px solid #f59d0f;
|
||||
animation: pulse 1s infinite;
|
||||
}
|
||||
|
||||
.status.running {
|
||||
background-color: rgba(231, 76, 60, 0.3);
|
||||
border: 2px solid #e74c3c;
|
||||
background-color: rgba(245, 157, 15, 0.3);
|
||||
border: 2px solid #f59d0f;
|
||||
}
|
||||
|
||||
@keyframes pulse {
|
||||
@@ -390,8 +396,8 @@ body {
|
||||
}
|
||||
|
||||
.status.standby {
|
||||
background-color: rgba(255, 193, 7, 0.3);
|
||||
border: 2px solid #ffc107;
|
||||
background-color: rgba(220, 242, 250, 0.3);
|
||||
border: 2px solid #DCF2FA;
|
||||
animation: standbyBlink 2s infinite;
|
||||
}
|
||||
|
||||
@@ -433,6 +439,9 @@ body {
|
||||
.best-times h3 {
|
||||
font-size: clamp(0.9rem, 1.8vw, 1.1rem);
|
||||
margin-bottom: clamp(5px, 0.5vh, 8px);
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
font-family: "Segoe UI", Arial, sans-serif;
|
||||
}
|
||||
|
||||
.best-time-row {
|
||||
@@ -447,8 +456,8 @@ body {
|
||||
}
|
||||
|
||||
.learning-mode {
|
||||
background: rgba(255, 193, 7, 0.2);
|
||||
border: 2px solid #ffc107;
|
||||
background: rgba(245, 157, 15, 0.2);
|
||||
border: 2px solid #f59d0f;
|
||||
border-radius: 15px;
|
||||
padding: clamp(15px, 2vh, 20px);
|
||||
margin: 2vh 0;
|
||||
@@ -463,9 +472,12 @@ body {
|
||||
}
|
||||
|
||||
.learning-mode h3 {
|
||||
color: #ffc107;
|
||||
color: #f59d0f;
|
||||
margin-bottom: 10px;
|
||||
font-size: clamp(1rem, 2vw, 1.3rem);
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
font-family: "Segoe UI", Arial, sans-serif;
|
||||
}
|
||||
|
||||
.learning-mode p {
|
||||
|
||||
@@ -15,7 +15,7 @@
|
||||
<div>
|
||||
<div class="banner-text">⚠️ Niedrige Batterie erkannt!</div>
|
||||
<div class="banner-devices" id="battery-devices">
|
||||
Geräte mit niedriger Batterie: <span id="low-battery-list"></span>
|
||||
Deine Geräte mit niedriger Batterie: <span id="low-battery-list"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -42,13 +42,13 @@
|
||||
|
||||
<div class="header">
|
||||
<h1>🏊♀️ NinjaCross Timer</h1>
|
||||
<p>Professioneller Zeitmesser für Ninjacross Wettkämpfe</p>
|
||||
<p>Dein professioneller Zeitmesser für Ninjacross Wettkämpfe</p>
|
||||
</div>
|
||||
|
||||
<div id="learning-display" class="learning-mode" style="display: none">
|
||||
<h3>📚 Lernmodus aktiv</h3>
|
||||
<p>
|
||||
Bitte drücken Sie den Button für: <span id="learning-button"></span>
|
||||
Drücke jetzt den Button für: <span id="learning-button"></span>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@@ -58,7 +58,7 @@
|
||||
<h2>🏊♀️ Bahn 1</h2>
|
||||
<div id="time1" class="time-display">00.00</div>
|
||||
<div id="status1" class="status standby">
|
||||
Standby: Bitte beide 1x betätigen
|
||||
Standby: Drücke beide Buttons einmal
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -67,13 +67,13 @@
|
||||
<h2>🏊♂️ Bahn 2</h2>
|
||||
<div id="time2" class="time-display">00.00</div>
|
||||
<div id="status2" class="status standby">
|
||||
Standby: Bitte beide 1x betätigen
|
||||
Standby: Drücke beide Buttons einmal
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="best-times">
|
||||
<h3>🏆 Beste Zeiten des Tages</h3>
|
||||
<h3>🏆 Deine Bestzeiten heute</h3>
|
||||
<div class="best-time-row">
|
||||
<span>Bahn 1:</span>
|
||||
<span id="best1">--.-</span>
|
||||
@@ -324,13 +324,13 @@
|
||||
function getButtonDisplayName(button) {
|
||||
switch (button) {
|
||||
case "start1":
|
||||
return "Start Bahn 1";
|
||||
return "Start Button Bahn 1";
|
||||
case "stop1":
|
||||
return "Stop Bahn 1";
|
||||
return "Stop Button Bahn 1";
|
||||
case "start2":
|
||||
return "Start Bahn 2";
|
||||
return "Start Button Bahn 2";
|
||||
case "stop2":
|
||||
return "Stop Bahn 2";
|
||||
return "Stop Button Bahn 2";
|
||||
default:
|
||||
return button;
|
||||
}
|
||||
@@ -365,25 +365,25 @@
|
||||
|
||||
if (!lane1Connected) {
|
||||
s1.className = "status standby";
|
||||
s1.textContent = "Standby: Bitte beide Buttons 1x betätigen";
|
||||
s1.textContent = "Standby: Drücke beide Buttons einmal";
|
||||
} else {
|
||||
s1.className = `status ${status1}`;
|
||||
|
||||
switch (status1) {
|
||||
case "ready":
|
||||
s1.textContent = "Bereit";
|
||||
s1.textContent = "Bereit für den Start!";
|
||||
break;
|
||||
case "running":
|
||||
s1.textContent = "Läuft...";
|
||||
s1.textContent = "Läuft - Du schaffst das!";
|
||||
break;
|
||||
case "finished":
|
||||
s1.textContent = "Beendet";
|
||||
s1.textContent = "Geschafft!";
|
||||
break;
|
||||
case "armed":
|
||||
s1.textContent = "Armiert";
|
||||
s1.textContent = "Bereit zum Start!";
|
||||
break;
|
||||
default:
|
||||
s1.textContent = "Unbekannter Status";
|
||||
s1.textContent = "Status unbekannt";
|
||||
}
|
||||
}
|
||||
|
||||
@@ -391,25 +391,25 @@
|
||||
|
||||
if (!lane2Connected) {
|
||||
s2.className = "status standby";
|
||||
s2.textContent = "Standby: Bitte beide Buttons 1x betätigen";
|
||||
s2.textContent = "Standby: Drücke beide Buttons einmal";
|
||||
} else {
|
||||
s2.className = `status ${status2}`;
|
||||
|
||||
switch (status2) {
|
||||
case "ready":
|
||||
s2.textContent = "Bereit";
|
||||
s2.textContent = "Bereit für den Start!";
|
||||
break;
|
||||
case "running":
|
||||
s2.textContent = "Läuft...";
|
||||
s2.textContent = "Läuft - Du schaffst das!";
|
||||
break;
|
||||
case "finished":
|
||||
s2.textContent = "Beendet";
|
||||
s2.textContent = "Geschafft!";
|
||||
break;
|
||||
case "armed":
|
||||
s2.textContent = "Armiert"; // Neuer Status für armiert
|
||||
s2.textContent = "Bereit zum Start!";
|
||||
break;
|
||||
default:
|
||||
s2.textContent = "Unbekannter Status";
|
||||
s2.textContent = "Status unbekannt";
|
||||
}
|
||||
}
|
||||
|
||||
@@ -463,7 +463,7 @@
|
||||
updateDisplay();
|
||||
})
|
||||
.catch((error) =>
|
||||
console.error("Fehler beim Laden der Daten:", error)
|
||||
console.error("Fehler beim Laden deiner Daten:", error)
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user