builtbykev/vyndr
1
0
Fork 0
Code Issues Pull Requests Actions 6 Packages Projects Releases Wiki Activity

M1b grade-reveal (screen 02): Rev 3 team chip + Design mobile hero (74px)

Browse Source 
GradeResultCard already carried Design's §7 grade-reveal structure (hero +
identity + 3-col grid + intel box) — the screen was built to the same contract
Design's mobile follows. Applied the Rev 3 gaps: team context now a TeamChip
(real logo/monogram), and the mobile grade hero → 74px (Design's exact mobile
size; M1a had 80). Desktop hero unchanged (116px).

Built to Design's mobile spec, VISUALLY UNVERIFIED at 390px.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Kev
2026-07-16 21:32:58 -04:00
parent f24f9412f1
commit baf977f3fe
2 changed files with 3 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/app/globals.css
+1 -1
View File
@@ -1316,7 +1316,7 @@ html[data-font="readable"] .wm::after { opacity: 0.45 !important; }
/* Grade hero zone: full-width, slightly smaller letter on phones. */ /* Grade hero zone: full-width, slightly smaller letter on phones. */
@media (max-width: 640px) { @media (max-width: 640px) {
.grade-hero { font-size: 80px !important; } .grade-hero { font-size: 74px !important; } /* Design mobile grade-reveal hero */
/* Session 43 — player-profile hero name was clipping (e.g. "Wembanyam") /* Session 43 — player-profile hero name was clipping (e.g. "Wembanyam")
at 390px. Shrink + wrap instead of overflowing the flex row. */ at 390px. Shrink + wrap instead of overflowing the flex row. */
.player-hero-name { font-size: 24px !important; overflow-wrap: anywhere; } .player-hero-name { font-size: 24px !important; overflow-wrap: anywhere; }
web/src/components/vyndr/GradeResultCard.tsx
+2 -1
View File
@@ -1,6 +1,7 @@
'use client'; 'use client';
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import TeamChip from '@/components/vyndr/TeamChip';
import SportBadge from '@/components/vyndr/SportBadge'; import SportBadge from '@/components/vyndr/SportBadge';
import SectionHead from '@/components/vyndr/SectionHead'; import SectionHead from '@/components/vyndr/SectionHead';
import VBtn from '@/components/vyndr/VBtn'; import VBtn from '@/components/vyndr/VBtn';
@@ -123,7 +124,7 @@ export default function GradeResultCard({
</div> </div>
<div style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-end', gap: 6 }}> <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-end', gap: 6 }}>
<SportBadge sport={d.sport} /> <SportBadge sport={d.sport} />
{d.team && <span className="mono" style={{ fontSize: 12, color: 'var(--text-1)', letterSpacing: '0.06em' }}>{d.team}</span>} {d.team && <TeamChip team={d.team} sport={d.sport} size={13} style={{ fontSize: 12, letterSpacing: '0.06em' }} />}
</div> </div>
</div> </div>