From 30635a9e69b4f0ce9f7f8a63a257ac2763df03e7 Mon Sep 17 00:00:00 2001
From: Michael Czechowski <mail@dailysh.it>
Date: Fri, 16 Jan 2026 04:50:47 +0100
Subject: [PATCH] fix: footer links on all pages and scroll behavior
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Render footer lesson links in initializeModules() for all pages
- Fix scroll to top using requestAnimationFrame for proper timing
- Move dice button to left of editor tools

🤖 Generated with [Claude Code](https://claude.com/claude-code)
---
 src/app.js     | 11 +++++++++--
 src/index.html |  2 +-
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/app.js b/src/app.js
index a199904..9507962 100644
--- a/src/app.js
+++ b/src/app.js
@@ -404,6 +404,9 @@ function initializeModules() {
 		// Use the new renderModuleList function with both callbacks
 		renderModuleList(elements.moduleList, modules, selectModule, selectLesson);
 
+		// Render footer lesson links (for all pages)
+		renderFooterLessonLinks();
+
 		// Handle route (home, section, or lesson)
 		handleRoute(false);
 
@@ -2031,7 +2034,6 @@ function updateSectionColor(sectionId) {
 function showLandingPage() {
 	hideAllPages();
 	elements.landingPage?.classList.remove("hidden");
-	window.scrollTo(0, 0);
 
 	// Reset section color on landing page
 	updateSectionColor(null);
@@ -2041,6 +2043,9 @@ function showLandingPage() {
 
 	// Render footer lesson links
 	renderFooterLessonLinks();
+
+	// Scroll to top after content is rendered
+	requestAnimationFrame(() => window.scrollTo(0, 0));
 }
 
 /**
@@ -2166,7 +2171,6 @@ function showSectionPage(sectionId) {
 function showReferencePage(refId) {
 	hideAllPages();
 	elements.referencePage?.classList.remove("hidden");
-	window.scrollTo(0, 0);
 
 	// Default to CSS if no refId
 	const activeRef = refId || "css";
@@ -2194,6 +2198,9 @@ function showReferencePage(refId) {
 	} else if (elements.referenceBody) {
 		elements.referenceBody.innerHTML = `<p>Reference for "${activeRef}" coming soon...</p>`;
 	}
+
+	// Scroll to top after content is rendered
+	requestAnimationFrame(() => window.scrollTo(0, 0));
 }
 
 /**
diff --git a/src/index.html b/src/index.html
index bb8d741..aaf9b68 100644
--- a/src/index.html
+++ b/src/index.html
@@ -342,6 +342,7 @@
 								<label for="code-input" class="editor-label" data-i18n="editorLabel">CSS Editor</label>
 								<div class="editor-actions">
 									<div class="editor-tools">
+										<button id="random-template-btn" class="btn btn-icon hidden" title="Load random template"><img src="./dice.svg" alt="" /></button>
 										<button id="undo-btn" class="btn btn-icon" data-i18n-title="undoTitle" title="Undo (Ctrl+Z)">↶</button>
 										<button id="redo-btn" class="btn btn-icon" data-i18n-title="redoTitle" title="Redo (Ctrl+Shift+Z)">↷</button>
 										<button
@@ -352,7 +353,6 @@
 										>
 											⟲
 										</button>
-										<button id="random-template-btn" class="btn btn-icon hidden" title="Load random template"><img src="./dice.svg" alt="" /></button>
 									</div>
 									<button id="run-btn" class="btn btn-run"><img src="./gear.svg" alt="" /><span data-i18n="run">Run</span></button>
 								</div>