chrisp/brackt
1
1
Fork 0
Code Issues 42 Pull requests Projects Releases Packages Wiki Activity Actions

feat: show live draft alert banner on league page (#42)

Browse source 
Adds a pulsing yellow alert banner between the league header and content
sections when the season status is "draft", with a link to the draft room.

Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Chris Parsons 2026-02-27 23:00:42 -08:00 • committed by GitHub
parent 6dfe56e178
commit 9dc7e860cb
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 20 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
app/routes/leagues/$leagueId.tsx
View file

@ -98,6 +98,26 @@ export default function LeagueHome({ loaderData }: Route.ComponentProps) {
)}
</div>
{season?.status === "draft" && (
<div className="mb-6 flex items-center justify-between gap-4 rounded-lg border border-yellow-500/50 bg-yellow-500/10 px-4 py-3 text-yellow-700 dark:text-yellow-400">
<div className="flex items-center gap-2">
<span className="relative flex h-2.5 w-2.5 shrink-0">
<span className="absolute inline-flex h-full w-full animate-ping rounded-full bg-yellow-500 opacity-75" />
<span className="relative inline-flex h-2.5 w-2.5 rounded-full bg-yellow-500" />
</span>
<span className="font-medium">Draft is live!</span>
<span className="hidden text-sm sm:inline">
Your league draft is currently in progress.
</span>
</div>
<Button asChild size="sm" variant="outline" className="shrink-0 border-yellow-500/60 text-yellow-700 hover:bg-yellow-500/20 dark:text-yellow-400">
<Link to={`/leagues/${league.id}/draft/${season.id}`}>
Enter Draft Room
</Link>
</Button>
</div>
)}
<div className="grid gap-6 md:grid-cols-3">
{/* Left Column - 2/3 width on desktop */}
<div className="md:col-span-2 space-y-6">