Fix stack cover: shared sticky line, z-index, show body only on stack.

All folders stick at --stack-reveal; higher layers paint over lower ones.
Bodies hidden until panel aligns on the stack line (no vertical list).

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-05-20 23:23:59 -04:00
co-authored by Cursor
parent cfe1cf3922
commit 7b54b47443
14 changed files with 715 additions and 754 deletions
+15 -22
View File
@@ -38,19 +38,25 @@ body {
.unit {
position: sticky;
top: var(--stack-reveal);
margin: 0;
border: 1px solid #2a3448;
background: #161a22;
border-radius: 2px;
box-shadow: 0 6px 0 #0a0c10, 0 12px 24px rgba(0,0,0,0.4);
z-index: 10;
}
.unit-head {
position: absolute;
left: 0;
right: 0;
bottom: calc(100% + var(--stack-step) * var(--layer, 0));
display: flex; align-items: center; gap: 0.5rem;
padding: 0.4rem 0.65rem;
background: #1a2030;
border-bottom: 1px solid #2a3448;
border: 1px solid #2a3448;
border-bottom: none;
border-radius: 2px 2px 0 0;
}
.unit-head button.jump {
@@ -76,26 +82,13 @@ body {
background: #161a22;
}
.u0 { top: calc(var(--stack-stick) + var(--stack-step) * 0); }
.u0 .unit-body { margin-top: calc(var(--stack-reveal) - var(--stack-stick) - var(--stack-tab-h)); }
.u1 { top: calc(var(--stack-stick) + var(--stack-step) * 1); }
.u1 .unit-body { margin-top: calc(var(--stack-reveal) - var(--stack-stick) - var(--stack-step) * 1 - var(--stack-tab-h)); }
.u2 { top: calc(var(--stack-stick) + var(--stack-step) * 2); }
.u2 .unit-body { margin-top: calc(var(--stack-reveal) - var(--stack-stick) - var(--stack-step) * 2 - var(--stack-tab-h)); }
.u3 { top: calc(var(--stack-stick) + var(--stack-step) * 3); }
.u3 .unit-body { margin-top: calc(var(--stack-reveal) - var(--stack-stick) - var(--stack-step) * 3 - var(--stack-tab-h)); }
.u4 { top: calc(var(--stack-stick) + var(--stack-step) * 4); }
.u4 .unit-body { margin-top: calc(var(--stack-reveal) - var(--stack-stick) - var(--stack-step) * 4 - var(--stack-tab-h)); }
.u5 { top: calc(var(--stack-stick) + var(--stack-step) * 5); }
.u5 .unit-body { margin-top: calc(var(--stack-reveal) - var(--stack-stick) - var(--stack-step) * 5 - var(--stack-tab-h)); }
.u6 { top: calc(var(--stack-stick) + var(--stack-step) * 6); }
.u6 .unit-body { margin-top: calc(var(--stack-reveal) - var(--stack-stick) - var(--stack-step) * 6 - var(--stack-tab-h)); }
.u0 { z-index: 10; --layer: 0; }
.u1 { z-index: 11; --layer: 1; }
.u2 { z-index: 12; --layer: 2; }
.u3 { z-index: 13; --layer: 3; }
.u4 { z-index: 14; --layer: 4; }
.u5 { z-index: 15; --layer: 5; }
.u6 { z-index: 16; --layer: 6; }
.unit-body strong { color: #e5e7eb; display: block; margin-bottom: 0.2rem; }
.unit-body p { color: #6b7280; font-size: 0.7rem; }