Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen der Seite angezeigt.

--- tools:akkordtrainer2 [07/11/2025 12:39] – angelegt Eric Weber
+++ tools:akkordtrainer2 [07/11/2025 17:49] (aktuell) – Eric Weber
@@ Zeile 43: / Zeile 43: @@
         button {
             padding: 10px 20px;
-            border: none;
+            border: 2px solid #333;
             border-radius: 5px;
             cursor: pointer;
             font-size: 14px;
-            transition: background-color 0.3s;
+            transition: all 0.3s;
+            font-weight: 600;
         }
         .btn-primary {
             background-color: #007bff;
-            color: white;
+            color: black;
+            border-color: #007bff;
         }
         .btn-primary:hover {
             background-color: #0056b3;
+            border-color: #0056b3;
         }
         .btn-secondary {
             background-color: #6c757d;
-            color: white;
+            color: black;
+            border-color: #6c757d;
         }
         .btn-secondary:hover {
             background-color: #545b62;
+            border-color: #545b62;
         }
         .btn-success {
             background-color: #28a745;
-            color: white;
+            color: black;
+            border-color: #28a745;
         }
         .btn-success:hover {
             background-color: #218838;
+            border-color: #218838;
         }
         .radio-group {
@@ Zeile 158: / Zeile 165: @@
         .play-sound-btn {
             background-color: #17a2b8;
-            color: white;
+            color: black;
             padding: 15px 30px;
             font-size: 18px;
             margin: 20px 0;
+            border: 2px solid #17a2b8;
         }
         .play-sound-btn:hover {
             background-color: #138496;
+            border-color: #138496;
         }
         .error-message {
@@ Zeile 186: / Zeile 195: @@
     <div class="chord-trainer">
         <div id="settings" class="settings-container">
-            <h2>Akkord-Trainer - Einstellungen</h2>
+            <h1>Akkord-Trainer 2</h1>
+            <h2>Jetzt mit echten Hörbeispielen</h2>
-            <div class="warning-box">
-                <strong>⚠️ Audio-Problem erkannt:</strong> Die Audio-Dateien können in dieser Umgebung nicht abgespielt werden.
-                Dies ist ein bekanntes Problem mit externen Audio-Quellen in Claude Artifacts.
-                <br><br>
-                <strong>Lösung:</strong> Bitte kopiere den HTML-Code und speichere ihn als .html-Datei auf deinem Computer.
-                Dann öffne die Datei in deinem Browser - dort sollte der Audio-Player funktionieren.
-            </div>
             <div class="section">
                 <h3>Dreiklänge</h3>
@@ Zeile 284: / Zeile 287: @@
                 <div class="radio-group">
                     <div class="radio-item">
-                        <input type="radio" id="simultaneous" name="playMode" value="simultaneous" checked>
+                        <input type="radio" id="successive" name="playMode" value="successive" checked>
-                        <label for="simultaneous">Simultan (gleichzeitig)</label>
+                        <label for="successive">Sukzessiv (nacheinander aufsteigend)</label>
                     </div>
                     <div class="radio-item">
-                        <input type="radio" id="successive" name="playMode" value="successive">
+                        <input type="radio" id="simultaneous" name="playMode" value="simultaneous">
-                        <label for="successive">Sukzessiv (nacheinander aufsteigend)</label>
+                        <label for="simultaneous">Simultan (gleichzeitig)</label>
                     </div>
                 </div>
@@ Zeile 554: / Zeile 557: @@
             document.getElementById('nextBtn').style.display = 'none';
-            playChord(currentChordNotes, quizSettings.playMode === 'simultaneous');
+            playChord(currentChordNotes, quizSettings.playMode === 'successive');
         }