diff --git a/backend/routes/api.py b/backend/routes/api.py
index ab697a7..60df6a3 100644
--- a/backend/routes/api.py
+++ b/backend/routes/api.py
@@ -623,6 +623,19 @@ def get_trainings():
     except Exception as error:
         return jsonify({'message': 'Failed to fetch trainings', 'error': str(error)}), 500
 
+@api_bp.route('/trainings/<int:id>', methods=['GET'])
+def get_training(id):
+    """Get a single training by id"""
+    try:
+        training = Training.query.get(id)
+        if training:
+            return jsonify(training.to_dict())
+        else:
+            return jsonify({'message': 'Training not found'}), 404
+    
+    except Exception as error:
+        return jsonify({'message': 'Failed to fetch training', 'error': str(error)}), 500
+
 @api_bp.route('/trainings/<int:id>', methods=['DELETE'])
 def delete_training(id):
     """Delete a training by id"""
diff --git a/edit-training.html b/edit-training.html
index 3103365..c55e6da 100644
--- a/edit-training.html
+++ b/edit-training.html
@@ -640,4 +640,69 @@ document.getElementById('parameters-form').addEventListener('submit', async func
 </div>
 
 <script src="js/settings.js"></script>
+<script>
+// Handle readonly mode and load training data
+window.addEventListener('DOMContentLoaded', function() {
+    const urlParams = new URLSearchParams(window.location.search);
+    const trainingId = urlParams.get('training_id');
+    const isReadonly = urlParams.get('readonly') === 'true';
+    
+    if (isReadonly) {
+        // Update page title
+        const titleLabel = document.querySelector('#project-title-label');
+        if (titleLabel) {
+            titleLabel.textContent = 'View Training Details (Read-Only)';
+        }
+        
+        // Disable all form inputs
+        document.querySelectorAll('input, select, textarea, button[type="submit"]').forEach(el => {
+            el.disabled = true;
+            el.style.opacity = '0.6';
+            el.style.cursor = 'not-allowed';
+        });
+        
+        // Hide submit buttons
+        document.querySelectorAll('button[type="submit"]').forEach(btn => {
+            btn.style.display = 'none';
+        });
+        
+        // Re-enable navigation buttons (back, etc.)
+        document.querySelectorAll('button:not([type="submit"])').forEach(btn => {
+            if (btn.textContent.includes('Back') || btn.onclick) {
+                btn.disabled = false;
+                btn.style.opacity = '1';
+                btn.style.cursor = 'pointer';
+            }
+        });
+    }
+    
+    // Load training data if training_id is present
+    if (trainingId) {
+        fetch(`/api/trainings/${trainingId}`)
+            .then(res => res.json())
+            .then(training => {
+                // Populate form fields with training data
+                Object.keys(training).forEach(key => {
+                    const input = document.querySelector(`[name="${key}"]`);
+                    if (input) {
+                        if (input.type === 'checkbox') {
+                            input.checked = training[key];
+                        } else {
+                            input.value = training[key] || '';
+                        }
+                    }
+                });
+                
+                // Handle special fields
+                if (training.train) document.getElementById('train-slider').value = training.train;
+                if (training.valid) document.getElementById('valid-slider').value = training.valid;
+                if (training.test) document.getElementById('test-slider').value = training.test;
+                syncSplitSliders('train');
+            })
+            .catch(err => {
+                console.error('Failed to load training data:', err);
+            });
+    }
+});
+</script>
 </body></html>
\ No newline at end of file
diff --git a/overview-training.html b/overview-training.html
index 68b5326..9759331 100644
--- a/overview-training.html
+++ b/overview-training.html
@@ -44,10 +44,7 @@
     </div>
       </button>
 
-      </button>
-        <button id="setup-details" class="button">
-          Show Details
-        </button>
+
 
     <script>
       document.getElementById('seed-db-btn').addEventListener('click', function () {
@@ -156,14 +153,15 @@
           };
           btnDiv.appendChild(startBtn);
 
-          // View Log button
-          const logBtn = document.createElement('button');
-          logBtn.textContent = 'View Training Log';
-          logBtn.style = 'background:#666;color:white;border:none;border-radius:6px;padding:6px 12px;cursor:pointer;';
-          logBtn.onclick = function() {
-            showLogModal(training.id);
+          // View Training Details button
+          const detailsBtn = document.createElement('button');
+          detailsBtn.textContent = 'View Training Details';
+          detailsBtn.style = 'background:#666;color:white;border:none;border-radius:6px;padding:6px 12px;cursor:pointer;';
+          detailsBtn.onclick = function() {
+            // Navigate to edit-training page in read-only mode
+            window.location.href = `/edit-training.html?training_id=${training.id}&readonly=true`;
           };
-          btnDiv.appendChild(logBtn);
+          btnDiv.appendChild(detailsBtn);
 
           // Remove button
           const removeBtn = document.createElement('button');