117 lines
5.9 KiB
HTML
117 lines
5.9 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta
|
|
name="viewport"
|
|
content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover"
|
|
/>
|
|
<title>Weekly Star</title>
|
|
<link rel="stylesheet" href="./style.css?v=20260609" />
|
|
</head>
|
|
<body>
|
|
<div class="app-viewport" id="appViewport">
|
|
<main class="page" id="page" data-tab="history">
|
|
<div class="stage-wrap" id="stageWrap">
|
|
<section class="stage" aria-label="Weekly Star activity">
|
|
<img class="bg-stars" src="./assets/bg-stars.png" alt="" />
|
|
<img class="hero-bg" src="./assets/hero-bg.png" alt="" />
|
|
|
|
<div class="date-plate">
|
|
<img class="date-plate-img" src="./assets/title-bar.png" alt="" />
|
|
<div class="date-text">
|
|
2025-12-28 00:00-2026-1-3 23:59(utc+3)
|
|
</div>
|
|
</div>
|
|
|
|
<p class="note">
|
|
Note: Send the following three gifts to participate in the<br />
|
|
ranking. Users who rank in the top 3 of the leaderboard<br />
|
|
will receive rewards.
|
|
</p>
|
|
|
|
<div class="gift-strip" aria-label="Activity gifts">
|
|
<div class="gift-card" style="--x: 61px">
|
|
<img class="gift-frame" src="./assets/gift-card.png" alt="" />
|
|
<img class="gift-glow" src="./assets/gift-glow.png" alt="" />
|
|
<img class="gift-img" src="./assets/gift-ball.png" alt="Gift" />
|
|
</div>
|
|
<div class="gift-card" style="--x: 411px">
|
|
<img class="gift-frame" src="./assets/gift-card.png" alt="" />
|
|
<img class="gift-glow" src="./assets/gift-glow.png" alt="" />
|
|
<img class="gift-img" src="./assets/gift-ball.png" alt="Gift" />
|
|
</div>
|
|
<div class="gift-card" style="--x: 761px">
|
|
<img class="gift-frame" src="./assets/gift-card.png" alt="" />
|
|
<img class="gift-glow" src="./assets/gift-glow.png" alt="" />
|
|
<img class="gift-img" src="./assets/gift-ball.png" alt="Gift" />
|
|
</div>
|
|
</div>
|
|
|
|
<nav class="tabs" aria-label="Weekly Star tabs">
|
|
<button class="tab" type="button" data-tab-target="history">
|
|
<img class="tab-img active-img" src="./assets/tab-active.png" alt="" />
|
|
<img class="tab-img inactive-img" src="./assets/tab-inactive.png" alt="" />
|
|
<span>Previous Top 3 Records</span>
|
|
</button>
|
|
<button class="tab" type="button" data-tab-target="weekly">
|
|
<img class="tab-img active-img" src="./assets/tab-active.png" alt="" />
|
|
<img class="tab-img inactive-img" src="./assets/tab-inactive.png" alt="" />
|
|
<span>This Week's<br />rank list</span>
|
|
</button>
|
|
<button class="tab" type="button" data-tab-target="rewards">
|
|
<img
|
|
class="tab-img active-img"
|
|
src="./assets/reward-tab-active.png"
|
|
alt=""
|
|
/>
|
|
<img
|
|
class="tab-img inactive-img"
|
|
src="./assets/reward-tab-inactive.png"
|
|
alt=""
|
|
/>
|
|
<span>Reward Description</span>
|
|
</button>
|
|
</nav>
|
|
|
|
<section
|
|
class="tab-panel history-panel"
|
|
data-panel="history"
|
|
aria-label="Previous Top 3 Records"
|
|
>
|
|
<h1 class="history-date">2025/12/07-2025/12/14</h1>
|
|
<div class="rank-list" id="historyList"></div>
|
|
</section>
|
|
|
|
<section
|
|
class="tab-panel weekly-panel"
|
|
data-panel="weekly"
|
|
aria-label="This Week's rank list"
|
|
hidden
|
|
>
|
|
<div class="rank-list" id="weeklyList"></div>
|
|
</section>
|
|
|
|
<section
|
|
class="tab-panel rewards-panel"
|
|
data-panel="rewards"
|
|
aria-label="Reward Description"
|
|
hidden
|
|
>
|
|
<img
|
|
class="reward-frame-bg"
|
|
src="./assets/reward-frame-bg.png"
|
|
alt=""
|
|
/>
|
|
<div class="reward-groups" id="rewardGroups"></div>
|
|
</section>
|
|
</section>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
<script src="../../common/api.js?v=20260606"></script>
|
|
<script src="../../common/params.js?v=20260606"></script>
|
|
<script src="./script.js?v=20260609"></script>
|
|
</body>
|
|
</html>
|