ilia/levkin.ca
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Restore original sticky stack (cfca7aa): no scroll-sections, 52vh cards.

Browse Source 
Reverts scroll-section/pull/is-stuck experiments that broke cover behavior.
Each card: sticky + stepped top + z-index; next card slides over previous.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
ilia
2026-05-21 09:40:52 -04:00
co-authored by Cursor
parent f65e8c7018
commit 09b0f498ba
11 changed files with 257 additions and 235 deletions
Download Patch File Download Diff File Expand all files Collapse all files
shared/stack-scroll.js
+11 -11
View File
@@ -1,7 +1,7 @@
/** Scroll depth + jump-to-layer for stack variants */
/** Scroll depth + jump — panels are [data-layer] sticky cards */
export function initStackScroll(options = {}) {
const {
sectionSelector = '.scroll-section',
sectionSelector = '.layer[data-layer], .folder[data-layer], .frame[data-layer], .unit[data-layer]',
depthEl = document.getElementById('depth'),
depthPrefix = 'L',
tabSelector = '[data-goto], .jump',
@@ -10,30 +10,30 @@ export function initStackScroll(options = {}) {
const sections = document.querySelectorAll(sectionSelector);
if (!sections.length) return;
const mid = () => window.innerHeight * 0.42;
const mid = () => window.innerHeight * 0.45;
function updateDepth() {
let active = 0;
sections.forEach((sec) => {
const r = sec.getBoundingClientRect();
if (r.top <= mid() && r.bottom > mid()) active = Number(sec.dataset.layer);
sections.forEach((el) => {
const r = el.getBoundingClientRect();
if (r.top <= mid() && r.bottom > mid()) active = Number(el.dataset.layer);
});
if (depthEl) depthEl.textContent = `${depthPrefix}${active}`;
document.querySelectorAll('.stack-ruler button, .stack-ruler [data-goto], .tab-rail button, .tab[data-goto]').forEach((el) => {
const n = el.dataset.layer ?? el.dataset.goto;
document.querySelectorAll('.stack-ruler button, .stack-ruler [data-goto], .tab-rail button, .tab[data-goto]').forEach((tab) => {
const n = tab.dataset.layer ?? tab.dataset.goto;
if (n === undefined) return;
el.classList.toggle('active', Number(n) === active);
tab.classList.toggle('active', Number(n) === active);
});
}
document.querySelectorAll(tabSelector).forEach((tab) => {
tab.addEventListener('click', (e) => {
e.preventDefault();
const layer = tab.dataset.goto;
const layer = tab.dataset.goto ?? tab.dataset.layer;
const target = document.querySelector(`${sectionSelector}[data-layer="${layer}"]`);
if (!target) return;
const y = target.getBoundingClientRect().top + window.scrollY - 48;
const y = target.getBoundingClientRect().top + window.scrollY - 56;
window.scrollTo({ top: Math.max(0, y), behavior: 'smooth' });
});
});