DangerousThings/dt-design-system
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: tune card badge position to 25% of bevel-md for responsive corner clipping

Browse Source
This commit is contained in:
michael
2026-03-13 05:03:46 -07:00
parent 926a282535
commit d1e2bf1964
1 changed files with 3 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
packages/web/src/components/bevels.css
View File

@@ -580,13 +580,12 @@
/* Card-level badge slot — positioned so the card's bevel clip-path /* Card-level badge slot — positioned so the card's bevel clip-path
clips the badge's bottom-right corner at 45 degrees. clips the badge's bottom-right corner at 45 degrees.
bottom/right: 3px aligns with the inner frame border edge. Values tuned so the badge is mostly visible with just the corner clipped. */
The badge extends into the bevel zone and gets clipped. */
.card > .dt-card-badge, .card > .dt-card-badge,
.dt-bevel-card > .dt-card-badge { .dt-bevel-card > .dt-card-badge {
position: absolute; position: absolute;
bottom: 3px; bottom: calc(var(--bevel-md) * 0.25);
right: 3px; right: calc(var(--bevel-md) * 0.25);
z-index: 4; z-index: 4;
} }