Skip to content

Instantly share code, notes, and snippets.

@royboy789

royboy789/widget.html

Last active August 15, 2025 04:02
Show Gist options
  • Save royboy789/a4132b79e6c43bc896bbf08ed67a4d99 to your computer and use it in GitHub Desktop.
Save royboy789/a4132b79e6c43bc896bbf08ed67a4d99 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
widget.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SGP Widget - BetMGM</title>
<link rel="stylesheet" href="css/widget.css">
</head>
<body style="margin: 0; padding: 40px; background: #f0f0f0; font-family: 'Inter', sans-serif;">
<!-- Light Mode Example -->
<div class="sgp-widget">
<div class="sgp-widget__header">
<div class="sgp-widget__brand">
<span class="sgp-widget__sgp-badge">SGP</span>
<span class="sgp-widget__title">Same Game Parlay</span>
</div>
<div class="sgp-widget__odds">
<span>Odds by</span>
<img src="images/betmgm-icon-dark.svg"/>
<span>BetMGM</span>
</div>
</div>
<div class="sgp-widget__event">
<div class="sgp-widget__event-title">
<img src="https://ui-avatars.com/api/?name=OKC&background=007ac1&color=ffffff&size=20&rounded=true&bold=true"
alt="Thunder" class="sgp-widget__team-icon" />
<strong>Thunder @ Pacers</strong>
<img src="https://ui-avatars.com/api/?name=IND&background=ffc62f&color=002d62&size=20&rounded=true&bold=true"
alt="Pacers" class="sgp-widget__team-icon" />
</div>
<div class="sgp-widget__event-time">7/2/25 • 1:00PM</div>
</div>
<ul class="sgp-widget__legs">
<li>
<img src="https://ui-avatars.com/api/?name=SGA&background=007ac1&color=ffffff&size=20&rounded=true&bold=true"
alt="Shai Gilgeous-Alexander" class="sgp-widget__player-icon" />
<span>Shai Gilgeous-Alexander: 25+ Points</span>
</li>
<li>
<img src="https://ui-avatars.com/api/?name=JW&background=007ac1&color=ffffff&size=20&rounded=true&bold=true"
alt="Jalen Williams" class="sgp-widget__player-icon" />
<span>Jalen Williams: 20+ Points</span>
</li>
<li>
<img src="https://ui-avatars.com/api/?name=PS&background=ffc62f&color=002d62&size=20&rounded=true&bold=true"
alt="Pascal Siakam" class="sgp-widget__player-icon" />
<span>Pascal Siakam: 15+ Points</span>
</li>
</ul>
<div class="sgp-widget__payout">
$10.00 pays out $798.60 +7886
</div>
<div class="sgp-widget__disclaimer">
Need help? Call 1-800-GAMBLER
</div>
</div>
<!-- Dark Mode Example -->
<div class="sgp-widget sgp-widget--dark" style="margin-top: 40px;">
<div class="sgp-widget__header">
<div class="sgp-widget__brand">
<span class="sgp-widget__sgp-badge">SGP</span>
<span class="sgp-widget__title">Same Game Parlay</span>
</div>
<div class="sgp-widget__odds">
<span>Odds by</span>
<img src="images/betmgm-icon.svg"/>
<span>BetMGM</span>
</div>
</div>
<div class="sgp-widget__event">
<div class="sgp-widget__event-title">
<img src="https://ui-avatars.com/api/?name=OKC&background=007ac1&color=ffffff&size=20&rounded=true&bold=true"
alt="Thunder" class="sgp-widget__team-icon" />
<strong>Thunder @ Pacers</strong>
<img src="https://ui-avatars.com/api/?name=IND&background=ffc62f&color=002d62&size=20&rounded=true&bold=true"
alt="Pacers" class="sgp-widget__team-icon" />
</div>
<div class="sgp-widget__event-time">7/2/25 • 1:00PM</div>
</div>
<ul class="sgp-widget__legs">
<li>
<img src="https://ui-avatars.com/api/?name=SGA&background=007ac1&color=ffffff&size=20&rounded=true&bold=true"
alt="Shai Gilgeous-Alexander" class="sgp-widget__player-icon" />
<span>Shai Gilgeous-Alexander: 25+ Points</span>
</li>
<li>
<img src="https://ui-avatars.com/api/?name=JW&background=007ac1&color=ffffff&size=20&rounded=true&bold=true"
alt="Jalen Williams" class="sgp-widget__player-icon" />
<span>Jalen Williams: 20+ Points</span>
</li>
<li>
<img src="https://ui-avatars.com/api/?name=PS&background=ffc62f&color=002d62&size=20&rounded=true&bold=true"
alt="Pascal Siakam" class="sgp-widget__player-icon" />
<span>Pascal Siakam: 15+ Points</span>
</li>
</ul>
<div class="sgp-widget__payout">
$10.00 pays out $798.60 +7886
</div>
<div class="sgp-widget__disclaimer">
Need help? Call 1-800-GAMBLER
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment