Skip to content

Commit 31ee434

Browse files
raifdmuellerclaude
andcommitted
fix: replace stacked card CSS with sub-anchor count badge
Remove pseudo-element stacking effect (overflow/z-index issues). Instead show "X Sub-Anchors" meta-badge on umbrella cards. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
1 parent c727460 commit 31ee434

2 files changed

Lines changed: 13 additions & 23 deletions

File tree

website/src/components/card-grid.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -177,6 +177,19 @@ function renderAnchorCard(anchor, categoryColor) {
177177
`
178178
: ''
179179
}
180+
181+
${
182+
isUmbrella
183+
? `
184+
<span class="meta-badge">
185+
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
186+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"></path>
187+
</svg>
188+
<span>${anchor.subAnchors.length} Sub-Anchors</span>
189+
</span>
190+
`
191+
: ''
192+
}
180193
</div>
181194
182195
<div class="anchor-card-indicator" style="background-color: ${categoryColor}"></div>

website/src/styles/main.css

Lines changed: 0 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -296,29 +296,6 @@ body {
296296
animation: fade-out 0.3s ease-out;
297297
}
298298

299-
/* Umbrella anchor stacked card effect */
300-
.anchor-card-umbrella {
301-
position: relative;
302-
}
303-
304-
.anchor-card-umbrella::before,
305-
.anchor-card-umbrella::after {
306-
content: '';
307-
position: absolute;
308-
inset: 0;
309-
border-radius: inherit;
310-
border: 1px solid var(--color-border);
311-
background: var(--color-bg);
312-
z-index: -1;
313-
}
314-
315-
.anchor-card-umbrella::before {
316-
transform: rotate(2deg) translate(4px, 4px);
317-
}
318-
319-
.anchor-card-umbrella::after {
320-
transform: rotate(-1deg) translate(-3px, 3px);
321-
}
322299

323300
/* Sub-anchor tier styling */
324301
.sub-anchor-item.tier-1 {

0 commit comments

Comments
 (0)