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
stack-trace/index.html
+28 -7
View File
@@ -11,13 +11,34 @@
<body>
<nav class="nav"><a href="/">← options</a><a href="/stack/">cards</a><a href="/stack-folder/">folder</a><a href="/stack-rack/">rack</a><span id="depth">#0</span></nav>
<main class="mount">
<div class="scroll-section" data-layer="0"><article class="frame f0"><button type="button" class="frame-line" data-goto="0">at Levkin.foundation (levkin.ca:0)</button><div class="frame-body"><strong>Levkin</strong><p>Canadian software practice · 15+ yrs · remote</p></div></article></div>
<div class="scroll-section" data-layer="1"><article class="frame f1"><button type="button" class="frame-line" data-goto="1">at Levkin.application (levkin.ca:1)</button><div class="frame-body"><strong>custom_software()</strong><p>TS · Python · .NET · APIs</p></div></article></div>
<div class="scroll-section" data-layer="2"><article class="frame f2"><button type="button" class="frame-line" data-goto="2">at Levkin.automation (auto.levkin.ca:2)</button><div class="frame-body"><strong>automation_pipeline()</strong><p>n8n · CI/CD · LLMs</p></div></article></div>
<div class="scroll-section" data-layer="3"><article class="frame f3"><button type="button" class="frame-line" data-goto="3">at Levkin.caseware (caseware.levkin.ca:3)</button><div class="frame-body"><strong>enterprise_module()</strong><p>CaseWare · MNP · JazzIt</p></div></article></div>
<div class="scroll-section" data-layer="4"><article class="frame f4"><button type="button" class="frame-line" data-goto="4">at Levkin.quality (iliadobkin.com:4)</button><div class="frame-body"><strong>sdet_suite()</strong><p><a href="https://iliadobkin.com">iliadobkin.com</a> — traces · Playwright</p></div></article></div>
<div class="scroll-section" data-layer="5"><article class="frame f5"><button type="button" class="frame-line" data-goto="5">at Levkin.operations (jobs.levkin.ca:5)</button><div class="frame-body"><strong>job_ops()</strong><p>internal · auth required</p></div></article></div>
<div class="scroll-section scroll-section--final" data-layer="6"><article class="frame f6"><button type="button" class="frame-line" data-goto="6">at Levkin.engage (interface:6)</button><div class="frame-body"><strong>main()</strong><p><a href="https://cal.levkin.ca/ilia/consult">book_consult()</a> · <a href="mailto:hello@levkine.ca">send_mail()</a></p></div></article></div>
<article class="frame f0" data-layer="0">
<button type="button" class="frame-line" data-goto="0">at Levkin.foundation (levkin.ca:0)</button>
<div class="frame-body"><strong>Levkin</strong><p>Canadian software practice · 15+ yrs · remote</p></div>
</article>
<article class="frame f1" data-layer="1">
<button type="button" class="frame-line" data-goto="1">at Levkin.application (levkin.ca:1)</button>
<div class="frame-body"><strong>custom_software()</strong><p>TS · Python · .NET · APIs</p></div>
</article>
<article class="frame f2" data-layer="2">
<button type="button" class="frame-line" data-goto="2">at Levkin.automation (auto.levkin.ca:2)</button>
<div class="frame-body"><strong>automation_pipeline()</strong><p>n8n · CI/CD · LLMs</p></div>
</article>
<article class="frame f3" data-layer="3">
<button type="button" class="frame-line" data-goto="3">at Levkin.caseware (caseware.levkin.ca:3)</button>
<div class="frame-body"><strong>enterprise_module()</strong><p>CaseWare · MNP · JazzIt</p></div>
</article>
<article class="frame f4" data-layer="4">
<button type="button" class="frame-line" data-goto="4">at Levkin.quality (iliadobkin.com:4)</button>
<div class="frame-body"><strong>sdet_suite()</strong><p><a href="https://iliadobkin.com">iliadobkin.com</a> — traces · Playwright</p></div>
</article>
<article class="frame f5" data-layer="5">
<button type="button" class="frame-line" data-goto="5">at Levkin.operations (jobs.levkin.ca:5)</button>
<div class="frame-body"><strong>job_ops()</strong><p>internal · auth required</p></div>
</article>
<article class="frame f6" data-layer="6">
<button type="button" class="frame-line" data-goto="6">at Levkin.engage (interface:6)</button>
<div class="frame-body"><strong>main()</strong><p><a href="https://cal.levkin.ca/ilia/consult">book_consult()</a> · <a href="mailto:hello@levkine.ca">send_mail()</a></p></div>
</article>
<div class="stop"></div>
</main>
<footer class="foot"><span>// end of stack</span><a href="https://git.levkin.ca">git.levkin.ca</a></footer>
stack-trace/trace.css
+13 -13
View File
@@ -28,7 +28,8 @@ body {
.frame {
position: sticky;
margin: 0 0.5rem;
min-height: var(--stack-card-min);
margin: 0 0.5rem 1.25rem;
border-left: 3px solid #3a3a44;
background: #141418;
box-shadow: 0 8px 0 #0a0a0c, 0 14px 28px rgba(0,0,0,0.45);
@@ -46,36 +47,35 @@ body {
width: 100%;
padding: 0.65rem 0 0.35rem 1rem;
background: #141418;
z-index: 60;
z-index: 80;
}
.frame-line:hover { color: #9fdf9f; text-decoration: underline; }
.frame-body {
padding: 0 0 2rem 1rem;
min-height: var(--stack-body-h);
padding: 0 0 1.5rem 1rem;
background: #141418;
}
.f0 { top: calc(var(--stack-stick) + var(--stack-step) * 0); z-index: 10; border-color: #c4a574; }
.f0 .frame-line { top: calc(var(--stack-stick) + var(--stack-step) * 0); }
.f0 { top: var(--stack-stick); z-index: 1; border-color: #c4a574; }
.f0 .frame-line { top: var(--stack-stick); }
.f1 { top: calc(var(--stack-stick) + var(--stack-step) * 1); z-index: 11; }
.f1 .frame-line { top: calc(var(--stack-stick) + var(--stack-step) * 1); }
.f1 { top: calc(var(--stack-stick) + var(--stack-step)); z-index: 2; }
.f1 .frame-line { top: calc(var(--stack-stick) + var(--stack-step)); }
.f2 { top: calc(var(--stack-stick) + var(--stack-step) * 2); z-index: 12; }
.f2 { top: calc(var(--stack-stick) + var(--stack-step) * 2); z-index: 3; }
.f2 .frame-line { top: calc(var(--stack-stick) + var(--stack-step) * 2); }
.f3 { top: calc(var(--stack-stick) + var(--stack-step) * 3); z-index: 13; }
.f3 { top: calc(var(--stack-stick) + var(--stack-step) * 3); z-index: 4; }
.f3 .frame-line { top: calc(var(--stack-stick) + var(--stack-step) * 3); }
.f4 { top: calc(var(--stack-stick) + var(--stack-step) * 4); z-index: 14; border-color: #6b8b9b; }
.f4 { top: calc(var(--stack-stick) + var(--stack-step) * 4); z-index: 5; border-color: #6b8b9b; }
.f4 .frame-line { top: calc(var(--stack-stick) + var(--stack-step) * 4); }
.f5 { top: calc(var(--stack-stick) + var(--stack-step) * 5); z-index: 15; }
.f5 { top: calc(var(--stack-stick) + var(--stack-step) * 5); z-index: 6; }
.f5 .frame-line { top: calc(var(--stack-stick) + var(--stack-step) * 5); }
.f6 { top: calc(var(--stack-stick) + var(--stack-step) * 6); z-index: 16; border-color: #7eb87a; }
.f6 { top: calc(var(--stack-stick) + var(--stack-step) * 6); z-index: 7; border-color: #7eb87a; margin-bottom: 4rem; }
.f6 .frame-line { top: calc(var(--stack-stick) + var(--stack-step) * 6); }
.frame-body strong { color: #e8e6e3; font-weight: 500; display: block; margin-bottom: 0.2rem; }