hyapp-h5/activity/cp/index.html
2026-06-08 19:16:41 +08:00

110 lines
5.6 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>Last Weekly CP</title>
<link rel="stylesheet" href="../../common/theme.css?v=20260608-cp" />
<link rel="stylesheet" href="./style.css?v=20260608-cp" />
</head>
<body>
<div class="app-viewport" id="appViewport">
<main class="page" id="page" data-tab="plaza">
<div class="stage-wrap" id="stageWrap">
<section
class="stage"
aria-label="Last Weekly CP activity"
data-i18n-aria="cp.pageLabel"
>
<div class="language-switcher">
<button
class="language-button"
type="button"
aria-label="Change language"
aria-expanded="false"
data-language-toggle
data-current-lang
data-i18n-aria="cp.changeLanguage"
>
EN
</button>
<div class="language-menu" data-language-menu hidden>
<button type="button" data-lang-option="en">EN</button>
<button type="button" data-lang-option="ar">AR</button>
<button type="button" data-lang-option="tr">TR</button>
<button type="button" data-lang-option="es">ES</button>
<button type="button" data-lang-option="zh">ZH</button>
<button type="button" data-lang-option="id">ID</button>
</div>
</div>
<img class="hero-bg" src="./assets/hero-bg.png" alt="" aria-hidden="true" />
<section class="countdown" aria-label="Activity countdown">
<div class="time-unit">
<img src="./assets/countdown-heart.png" alt="" aria-hidden="true" />
<strong data-count="days">02</strong>
<span data-i18n="cp.days">D</span>
</div>
<div class="time-unit">
<img src="./assets/countdown-heart.png" alt="" aria-hidden="true" />
<strong data-count="hours">02</strong>
<span data-i18n="cp.hours">H</span>
</div>
<div class="time-unit">
<img src="./assets/countdown-heart.png" alt="" aria-hidden="true" />
<strong data-count="minutes">02</strong>
<span data-i18n="cp.minutes">M</span>
</div>
<div class="time-unit">
<img src="./assets/countdown-heart.png" alt="" aria-hidden="true" />
<strong data-count="seconds">02</strong>
<span data-i18n="cp.seconds">S</span>
</div>
</section>
<nav class="tabs" aria-label="CP activity tabs" data-i18n-aria="cp.tabsLabel">
<button class="tab is-active" type="button" data-tab="plaza">
<img src="./assets/tab-active.png" alt="" aria-hidden="true" />
<span data-i18n="cp.tabPlaza">CP Plaza</span>
</button>
<button class="tab" type="button" data-tab="rank">
<img src="./assets/tab-inactive.png" alt="" aria-hidden="true" />
<span data-i18n="cp.tabRank">CP Rank</span>
</button>
<button class="tab" type="button" data-tab="rewards">
<img src="./assets/tab-inactive.png" alt="" aria-hidden="true" />
<span data-i18n="cp.tabRewards">Rewards</span>
</button>
</nav>
<div class="tab-content" id="tabContent"></div>
<footer class="copyright" data-i18n="cp.copyright">
The copyright of this activity belongs to Shila
</footer>
</section>
</div>
</main>
</div>
<script>
(function () {
try {
var params = new URLSearchParams(window.location.search);
if (!params.get('lang') && !window.localStorage.getItem('cp_activity_lang_ready')) {
window.localStorage.setItem('hyapp_h5_lang', 'en');
window.localStorage.setItem('cp_activity_lang_ready', '1');
}
} catch (error) {
document.documentElement.lang = 'en';
}
})();
</script>
<script src="../../common/i18n.js?v=20260608-cp"></script>
<script src="./script.js?v=20260608-cp"></script>
</body>
</html>