discoman/python-tdd
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

RWS card faces: thin the contour stroke for the english deck so it doesn't double the card's own border

Browse Source 
The image-mode contour stroke (4 cardinal drop-shadows) follows the PNG alpha.
Minchiate faces are transparent-cut to their irregular outline, so the stroke
cleaves to the shape; RWS faces are clean cream rectangles that carry their own
printed border, so the full 0.2rem stroke reads as a redundant uniform double-
frame. Rather than re-process 78 images, thin the stroke for the equipped
english deck via CSS only.

- _card-deck.scss: the cardinal-stroke offset is now `var(--img-stroke-w,
  0.2rem)` (default unchanged for Minchiate/Earthman); `body.deck-family-english`
  sets it to 0.08rem (a crisp edge, not a frame). Custom props inherit, so the
  body class cascades into every image card on the page.
- base.html: body gains `deck-family-<equipped-deck-family>` when authenticated
  with an equipped deck.

Aesthetic polish — may be reverted (revert = drop the body class + the
`--img-stroke-w` var + the english rule).

Code architected by Disco DeDisco <discodedisco@outlook.com>
Git commit message Co-Authored-By:
Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Disco DeDisco
2026-05-29 22:28:11 -04:00
parent c4e738ad16
commit 02d2d565a3
2 changed files with 20 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
src/static_src/scss/_card-deck.scss
View File

@@ -834,11 +834,15 @@ html:has(.sig-backdrop) {
// Mobile-safe: filter on raster images works fine cross-browser // Mobile-safe: filter on raster images works fine cross-browser
// (the [[feedback-mobile-svg-glow]] dead-end was specifically // (the [[feedback-mobile-svg-glow]] dead-end was specifically
// SVG glow, not raster drop-shadow). // SVG glow, not raster drop-shadow).
// `--img-stroke-w` is the cardinal-stroke offset (default 0.2rem).
// Framed rectangular decks (RWS) thin it via `body.deck-family-english`
// below so the stroke doesn't double the card's own printed border —
// 2026-05-29 polish, may be reverted.
filter: filter:
drop-shadow( 0.2rem 0 0 var(--img-stroke-color)) drop-shadow( var(--img-stroke-w, 0.2rem) 0 0 var(--img-stroke-color))
drop-shadow(-0.2rem 0 0 var(--img-stroke-color)) drop-shadow( calc(-1 * var(--img-stroke-w, 0.2rem)) 0 0 var(--img-stroke-color))
drop-shadow( 0 0.2rem 0 var(--img-stroke-color)) drop-shadow( 0 var(--img-stroke-w, 0.2rem) 0 var(--img-stroke-color))
drop-shadow( 0 -0.2rem 0 var(--img-stroke-color)) drop-shadow( 0 calc(-1 * var(--img-stroke-w, 0.2rem)) 0 var(--img-stroke-color))
drop-shadow( 1px 1px 2px rgba(0, 0, 0, 1)); drop-shadow( 1px 1px 2px rgba(0, 0, 0, 1));
} }
.sig-stage-card-back-img { display: none; } // shown only when flipped .sig-stage-card-back-img { display: none; } // shown only when flipped
@@ -855,6 +859,17 @@ html:has(.sig-backdrop) {
} }
} }
// RWS (english family) cards are clean cream rectangles that carry their own
// printed border, so the full 0.2rem contour stroke reads as a redundant
// double-frame (unlike the irregular Minchiate cut, where it cleaves to the
// shape). Thin it to a crisp edge for the equipped english deck. Custom props
// inherit, so setting it on <body> cascades into every image card on the page.
// (Polish 2026-05-29 — may be reverted; revert = drop this rule + the
// `--img-stroke-w` var + the base.html body class.)
body.deck-family-english {
--img-stroke-w: 0.08rem;
}
// ─── My Sign picker — sizing + state-gated reveal ──────────────────────────── // ─── My Sign picker — sizing + state-gated reveal ────────────────────────────
// Two-phase layout: landing (DRY 1-chair hex w. SCAN SIGN center) → picker // Two-phase layout: landing (DRY 1-chair hex w. SCAN SIGN center) → picker
// (sig-card grid below an always-present stage frame). SAVE SIGN rides // (sig-card grid below an always-present stage frame). SAVE SIGN rides

2
src/templates/core/base.html
View File

@@ -17,7 +17,7 @@
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
</head> </head>
<body class="{{ user_palette }} {{ page_class|default:'' }}"> <body class="{{ user_palette }} {{ page_class|default:'' }}{% if request.user.is_authenticated and request.user.equipped_deck %} deck-family-{{ request.user.equipped_deck.family }}{% endif %}">
<div class="container"> <div class="container">
{% include "core/_partials/_navbar.html" %} {% include "core/_partials/_navbar.html" %}