archipelagoandClaude Fable 5
53753687a5
Demo images / Build & push demo images (push) Successful in 4m1s
Replaces the bespoke doc-page chrome with the app's real components: DashboardSidebar shell (256px, rgba(0,0,0,.25) + 18px blur, staggered nav-item entrance), the AnimatedLogo neode mark with its 20 staggered squares, sidebar-nav-item + nav-tab-active for section state, and the Settings wallpaper behind it all. Every bespoke container (.card/.card-sm/.step/.score-card/.callout-*/ .diagram) is gone — .glass-card from style.css is now the only box on the page, with layout-only grids inside it. Scroll-spy lives in nav.js rather than inline, since the node's CSP is script-src 'self'. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
30 lines
1.1 KiB
JavaScript
30 lines
1.1 KiB
JavaScript
// Scroll-spy for the sidebar, mirroring the dashboard's nav-tab-active state.
|
|
// External file (not inline) because the node's CSP is script-src 'self'.
|
|
(function () {
|
|
var links = Array.prototype.slice.call(
|
|
document.querySelectorAll('.sidebar-nav .sidebar-nav-item[href^="#"]')
|
|
)
|
|
if (!links.length || !('IntersectionObserver' in window)) return
|
|
|
|
var sections = links
|
|
.map(function (a) { return document.getElementById(a.getAttribute('href').slice(1)) })
|
|
.filter(Boolean)
|
|
|
|
function activate(id) {
|
|
links.forEach(function (a) {
|
|
a.classList.toggle('nav-tab-active', a.getAttribute('href') === '#' + id)
|
|
})
|
|
}
|
|
|
|
var visible = {}
|
|
var observer = new IntersectionObserver(function (entries) {
|
|
entries.forEach(function (e) { visible[e.target.id] = e.isIntersecting })
|
|
// Topmost section currently on screen wins, so the highlight tracks reading position.
|
|
for (var i = 0; i < sections.length; i++) {
|
|
if (visible[sections[i].id]) { activate(sections[i].id); return }
|
|
}
|
|
}, { rootMargin: '-10% 0px -70% 0px', threshold: 0 })
|
|
|
|
sections.forEach(function (s) { observer.observe(s) })
|
|
})()
|