Moved the add manually box from the main page to the settings page

templates/settings.html

@@ -331,6 +331,21 @@
             </div>
         </div>
 
+        <div class="card">
+            <h2>Load a Course Manually</h2>
+            <div class="setting-row" style="flex-direction: column; align-items: stretch; gap: 8px;">
+                <label for="manual-course-path">Course directory path
+                    <span class="setting-desc">For a course outside your library folder, or if it isn't showing up in the browser for some reason.</span>
+                </label>
+                <div style="display: flex; gap: 10px;">
+                    <input type="text" id="manual-course-path" class="hex-input" style="flex: 1; width: auto; font-family: var(--font-family);"
+                           placeholder="e.g., /app/courses/My Course">
+                    <button class="btn" onclick="loadCourseFromPath()">Load Course</button>
+                </div>
+                <span id="manual-course-status" style="font-size: 0.85em; min-height: 1.2em;"></span>
+            </div>
+        </div>
+
         <div class="card">
             <h2>Video Player</h2>
             <div class="setting-row">
@@ -441,6 +456,46 @@
             });
         }
 
+        function loadCourseFromPath() {
+            const input = document.getElementById('manual-course-path');
+            const status = document.getElementById('manual-course-status');
+            const coursePath = input.value.trim();
+
+            if (!coursePath) {
+                status.style.color = '#ff6b6b';
+                status.textContent = 'Please enter a course path.';
+                return;
+            }
+
+            status.style.color = 'var(--text-muted)';
+            status.textContent = 'Loading course...';
+
+            fetch('/load_course', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ course_path: coursePath })
+            })
+            .then(r => r.json())
+            .then(data => {
+                if (data.success) {
+                    status.style.color = '#28a745';
+                    status.textContent = `✓ Loaded "${data.course_name}" — redirecting...`;
+                    setTimeout(() => { window.location.href = '/'; }, 1000);
+                } else {
+                    status.style.color = '#ff6b6b';
+                    status.textContent = data.error || 'Could not load course';
+                }
+            })
+            .catch(() => {
+                status.style.color = '#ff6b6b';
+                status.textContent = 'Could not reach the server';
+            });
+        }
+
+        document.getElementById('manual-course-path').addEventListener('keypress', (e) => {
+            if (e.key === 'Enter') loadCourseFromPath();
+        });
+
         function resetVideoSize() {
             fetch('/api/settings', {
                 method: 'POST',