Pattern ComponentSport Event
Sport Card
A specialized card component designed for displaying sports betting events with odds, team information, and interactive betting buttons.
Quick Preview
15:30Today
2
Manchester United
Liverpool FC
Football / Premier League
18:00Tomorrow
2
Barcelona
Real Madrid
Football / La Liga
Basic Usage
Standard sport card with all basic information and betting odds.
15:30Today
2
Manchester United
Liverpool FC
Football / Premier League
Code Example
<SportCard
time="15:30"
date="Today"
homeTeam="Manchester United"
awayTeam="Liverpool FC"
league="Premier League"
sport="Football"
homeOdds="2.10"
drawOdds="3.40"
awayOdds="3.20"
/>
Hot Selection
Highlight popular betting options with the hot selection indicator.
18:00Tomorrow
2
Barcelona
Real Madrid
Football / La Liga
16:45Dec 20
2
Chelsea
Arsenal
Football / Premier League
Code Example
<SportCard
time="18:00"
date="Tomorrow"
homeTeam="Barcelona"
awayTeam="Real Madrid"
league="La Liga"
sport="Football"
homeOdds="1.95"
drawOdds="3.60"
awayOdds="4.20"
hotSelection="home"
/>
Different Sports
The component adapts to different sports and betting formats.
20:00Dec 15
2
Lakers
Warriors
Basketball / NBA
14:30Dec 18
2
Djokovic
Nadal
Tennis / ATP Finals
Grid Layout
Multiple sport cards in a responsive grid layout.
15:00Today
2
Bayern Munich
Dortmund
Football / Bundesliga
17:30Today
2
Juventus
AC Milan
Football / Serie A
19:45Today
2
PSG
Marseille
Football / Ligue 1