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