File: /home/bigfreeodds/public_html/wp-content/public/scores/index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Live Scores — Football</title>
<meta name="description" content="Live football scores, fixtures, lineups, standings and stats in a sleek dark neon mobile experience." />
<link rel="stylesheet" href="assets/css/style.css" />
</head>
<body data-page="home">
<div class="app">
<!-- Header -->
<header class="topbar">
<h1>LIVE SCORES</h1>
<div style="display:flex;gap:6px;align-items:center;">
<span id="refresh-status" style="font-size:10px;color:#8a8f99;letter-spacing:0.5px;margin-right:2px;">LIVE</span>
<button class="icon-btn" id="refresh-btn" aria-label="Refresh scores" title="Refresh now">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12a9 9 0 1 1-3-6.7"/><path d="M21 4v5h-5"/></svg>
</button>
<button class="icon-btn" aria-label="Notifications">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 7h13l-2 5 2 5H3z"/><path d="M21 9v6"/></svg>
<span class="dot-red"></span>
</button>
<button class="icon-btn" aria-label="Alerts">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M6 8a6 6 0 1 1 12 0c0 7 3 7 3 9H3c0-2 3-2 3-9z"/><path d="M10 21a2 2 0 0 0 4 0"/></svg>
</button>
</div>
</header>
<!-- Date strip: data-day matches MATCH.day codes -->
<div class="date-strip">
<div class="date-chip" data-day="MO"><small>MO</small><strong>17</strong></div>
<div class="date-chip" data-day="TU"><small>TU</small><strong>18</strong></div>
<div class="date-chip live" data-day="WE"><small>WE</small><strong>TODAY</strong></div>
<div class="date-chip" data-day="LIVE"><small>NOW</small><strong>LIVE</strong></div>
<div class="date-chip" data-day="TH"><small>TH</small><strong>20</strong></div>
<div class="date-chip" data-day="FR"><small>FR</small><strong>21</strong></div>
<div class="date-chip" data-day="SA"><small>SA</small><strong>22</strong></div>
<div class="date-chip" data-day="SU"><small>SU</small><strong>23</strong></div>
</div>
<!-- Hot matches with carousel arrow + dots -->
<div class="section-title">
<h2>HOT MATCHES</h2>
<button id="hot-next" class="hot-arrow" aria-label="Next">›</button>
</div>
<div class="hot-section">
<div class="hot-row" id="hot-row"></div>
<div class="hot-dots" id="hot-dots"></div>
</div>
<!-- Leagues -->
<div id="leagues-list"></div>
<!-- ALL LIVE floating toggle -->
<div class="all-live-wrap">
<button class="all-live" id="all-live">ALL LIVE <span class="switch"></span></button>
</div>
</div>
<!-- Bottom nav (shared) -->
<nav class="bottom-nav">
<a href="index.html" class="active"><span class="ic">⌂</span><span>Home</span></a>
<a href="live.html"><span class="ic">▶</span><span>Live</span></a>
<a href="favourites.html"><span class="ic">★</span><span>Favourites</span></a>
<a href="leagues.html"><span class="ic">🏆</span><span>Leagues</span></a>
<a href="profile.html"><span class="ic">◉</span><span>Profile</span></a>
</nav>
<script src="assets/js/app.js"></script>
</body>
</html>