fix: address PR #179 review — consolidate CSS, extract inline styles, add tests

- Consolidate T3 duplicate #header rule into single block with overflow/position
- Add explicit T2 #resultHeader border-bottom-width (4px) for clarity
- Move diamond quad filled box-shadow from inline styles to .diamond-quad.filled CSS rule
- Add TestResolveTier: 6 parametrized tests covering tier roundtrip, base card, unknown variant

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Cal Corum 2026-04-04 00:43:27 -05:00
parent b32e19a4ac
commit 830e703e76
3 changed files with 44 additions and 5 deletions

View File

@ -16,10 +16,10 @@
{%- set dc = diamond_colors[refractor_tier] -%}
{%- set filled_bg = 'linear-gradient(135deg, ' ~ dc.highlight ~ ' 0%, ' ~ dc.color ~ ' 50%, ' ~ dc.color ~ ' 100%)' -%}
<div class="tier-diamond{% if refractor_tier == 4 %} diamond-glow{% endif %}">
<div class="diamond-quad{% if refractor_tier >= 2 %} filled{% endif %}" {% if refractor_tier >= 2 %}style="background: {{ filled_bg }}; box-shadow: inset 0 1px 2px rgba(255,255,255,0.45), inset 0 -1px 2px rgba(0,0,0,0.35), inset 1px 0 2px rgba(255,255,255,0.15);"{% endif %}></div>
<div class="diamond-quad{% if refractor_tier >= 1 %} filled{% endif %}" {% if refractor_tier >= 1 %}style="background: {{ filled_bg }}; box-shadow: inset 0 1px 2px rgba(255,255,255,0.45), inset 0 -1px 2px rgba(0,0,0,0.35), inset 1px 0 2px rgba(255,255,255,0.15);"{% endif %}></div>
<div class="diamond-quad{% if refractor_tier >= 3 %} filled{% endif %}" {% if refractor_tier >= 3 %}style="background: {{ filled_bg }}; box-shadow: inset 0 1px 2px rgba(255,255,255,0.45), inset 0 -1px 2px rgba(0,0,0,0.35), inset 1px 0 2px rgba(255,255,255,0.15);"{% endif %}></div>
<div class="diamond-quad{% if refractor_tier >= 4 %} filled{% endif %}" {% if refractor_tier >= 4 %}style="background: {{ filled_bg }}; box-shadow: inset 0 1px 2px rgba(255,255,255,0.45), inset 0 -1px 2px rgba(0,0,0,0.35), inset 1px 0 2px rgba(255,255,255,0.15);"{% endif %}></div>
<div class="diamond-quad{% if refractor_tier >= 2 %} filled{% endif %}" {% if refractor_tier >= 2 %}style="background: {{ filled_bg }};"{% endif %}></div>
<div class="diamond-quad{% if refractor_tier >= 1 %} filled{% endif %}" {% if refractor_tier >= 1 %}style="background: {{ filled_bg }};"{% endif %}></div>
<div class="diamond-quad{% if refractor_tier >= 3 %} filled{% endif %}" {% if refractor_tier >= 3 %}style="background: {{ filled_bg }};"{% endif %}></div>
<div class="diamond-quad{% if refractor_tier >= 4 %} filled{% endif %}" {% if refractor_tier >= 4 %}style="background: {{ filled_bg }};"{% endif %}></div>
</div>
{% if refractor_tier == 4 %}
<div class="corner-accent tl" style="width: 35px; height: 35px; border-top: 3px solid #c9a94e; border-left: 3px solid #c9a94e;"></div>

View File

@ -27,6 +27,12 @@
background: rgba(0,0,0,0.3);
}
.diamond-quad.filled {
box-shadow: inset 0 1px 2px rgba(255,255,255,0.45),
inset 0 -1px 2px rgba(0,0,0,0.35),
inset 1px 0 2px rgba(255,255,255,0.15);
}
.corner-accent {
position: absolute;
z-index: 6;
@ -73,6 +79,9 @@
border-bottom-color: #7a9cc4;
border-bottom-width: 4px;
}
#resultHeader.border-bot {
border-bottom-width: 4px;
}
#resultHeader .border-right-thick {
border-right-width: 6px;
}
@ -97,6 +106,8 @@
/* T3 — Gold Refractor */
#header {
background: linear-gradient(135deg, rgba(195,155,35,0.26) 0%, rgba(235,200,70,0.2) 50%, rgba(195,155,35,0.26) 100%), #ffffff;
overflow: hidden;
position: relative;
}
#fullCard {
box-shadow: inset 0 0 16px 4px rgba(200,165,48,0.22);
@ -123,7 +134,6 @@
}
/* T3 shimmer animation — paused for static PNG capture */
#header { overflow: hidden; position: relative; }
@keyframes t3-shimmer {
0% { transform: translateX(-130%); }
100% { transform: translateX(230%); }

View File

@ -19,6 +19,7 @@ from app.services.refractor_boost import (
PITCHER_PRIORITY,
PITCHER_XCHECK_COLUMNS,
)
from app.routers_v2.players import resolve_refractor_tier
# ---------------------------------------------------------------------------
@ -911,6 +912,34 @@ class TestVariantHash:
)
# ---------------------------------------------------------------------------
# Tier resolution (from variant hash)
# ---------------------------------------------------------------------------
class TestResolveTier:
"""Verify resolve_refractor_tier correctly reverse-maps variant hashes to
tier numbers using compute_variant_hash as the source of truth.
"""
@pytest.mark.parametrize("tier", [1, 2, 3, 4])
def test_known_tier_roundtrips(self, tier):
"""resolve_refractor_tier returns the correct tier for a variant hash
produced by compute_variant_hash.
"""
player_id = 42
variant = compute_variant_hash(player_id, tier)
assert resolve_refractor_tier(player_id, variant) == tier
def test_base_card_returns_zero(self):
"""variant=0 (base card) always returns tier 0."""
assert resolve_refractor_tier(999, 0) == 0
def test_unknown_variant_returns_zero(self):
"""An unrecognized variant hash falls back to tier 0."""
assert resolve_refractor_tier(1, 99999999) == 0
# ---------------------------------------------------------------------------
# Batter display stats
# ---------------------------------------------------------------------------