384 lines
18 KiB
HTML
384 lines
18 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>New Agency Opening Event</title>
|
|
<link rel="stylesheet" href="./style.css?v=20260616-agency-opening-tabs" />
|
|
</head>
|
|
<body>
|
|
<div class="app-viewport" id="appViewport">
|
|
<main class="page">
|
|
<div class="stage-wrap" id="stageWrap">
|
|
<section
|
|
class="stage"
|
|
aria-label="New Agency Opening Event"
|
|
data-i18n-aria="agencyOpening.pageLabel"
|
|
>
|
|
<img
|
|
class="bg-hall bg-hall-hero"
|
|
src="./assets/hall-bg.png"
|
|
alt=""
|
|
/>
|
|
<img
|
|
class="bg-hall bg-hall-top"
|
|
src="./assets/hall-bg.png"
|
|
alt=""
|
|
/>
|
|
<img
|
|
class="bg-hall bg-hall-repeat-a"
|
|
src="./assets/hall-bg.png"
|
|
alt=""
|
|
/>
|
|
<img
|
|
class="bg-hall bg-hall-repeat-b"
|
|
src="./assets/hall-bg.png"
|
|
alt=""
|
|
/>
|
|
<div class="top-fade" aria-hidden="true"></div>
|
|
|
|
<nav class="language-tabs" aria-label="Language">
|
|
<button
|
|
class="language-tab"
|
|
type="button"
|
|
data-lang-option="en"
|
|
>
|
|
<span>English</span>
|
|
</button>
|
|
<button
|
|
class="language-tab"
|
|
type="button"
|
|
data-lang-option="ar"
|
|
>
|
|
<span>Arabic</span>
|
|
</button>
|
|
<button
|
|
class="language-tab"
|
|
type="button"
|
|
data-lang-option="tr"
|
|
>
|
|
<span>Turkish</span>
|
|
</button>
|
|
<button
|
|
class="language-tab"
|
|
type="button"
|
|
data-lang-option="es"
|
|
>
|
|
<span>Spanish</span>
|
|
</button>
|
|
<button
|
|
class="language-tab"
|
|
type="button"
|
|
data-lang-option="zh"
|
|
>
|
|
<span>Chinese</span>
|
|
</button>
|
|
<button
|
|
class="language-tab"
|
|
type="button"
|
|
data-lang-option="id"
|
|
>
|
|
<span>Indonesian</span>
|
|
</button>
|
|
</nav>
|
|
|
|
<header class="hero">
|
|
<img
|
|
class="hero-title"
|
|
src="./assets/title.png"
|
|
alt=""
|
|
/>
|
|
<p
|
|
class="hero-subtitle"
|
|
data-i18n="agencyOpening.heroSubtitle"
|
|
>
|
|
Exclusive for New Agencies
|
|
</p>
|
|
<img
|
|
class="hero-shadow"
|
|
src="./assets/hero-shadow.svg"
|
|
alt=""
|
|
/>
|
|
<img
|
|
class="hero-cat"
|
|
src="./assets/cat.png"
|
|
alt=""
|
|
/>
|
|
</header>
|
|
|
|
<section
|
|
class="countdown"
|
|
aria-label="Activity countdown"
|
|
>
|
|
<article class="count-cell count-days">
|
|
<img src="./assets/countdown-cell.png" alt="" />
|
|
<strong data-count="days">04</strong>
|
|
<span data-i18n="agencyOpening.days">Days</span>
|
|
</article>
|
|
<article class="count-cell count-hours">
|
|
<img src="./assets/countdown-cell.png" alt="" />
|
|
<strong data-count="hours">04</strong>
|
|
<span data-i18n="agencyOpening.hours"
|
|
>Hours</span
|
|
>
|
|
</article>
|
|
<article class="count-cell count-minutes">
|
|
<img src="./assets/countdown-cell.png" alt="" />
|
|
<strong data-count="minutes">04</strong>
|
|
<span data-i18n="agencyOpening.minutes"
|
|
>Minutes</span
|
|
>
|
|
</article>
|
|
<article class="count-cell count-seconds">
|
|
<img src="./assets/countdown-cell.png" alt="" />
|
|
<strong data-count="seconds">04</strong>
|
|
<span data-i18n="agencyOpening.seconds"
|
|
>Seconds</span
|
|
>
|
|
</article>
|
|
</section>
|
|
|
|
<section
|
|
class="opening-section qualification-section"
|
|
aria-labelledby="qualificationTitle"
|
|
>
|
|
<div class="section-title" id="qualificationTitle">
|
|
<img src="./assets/section-title.png" alt="" />
|
|
<h2
|
|
data-i18n="agencyOpening.qualificationTitle"
|
|
>
|
|
Opening Qualification
|
|
</h2>
|
|
</div>
|
|
<div
|
|
class="ornate-panel frame-qualification"
|
|
aria-hidden="true"
|
|
>
|
|
<span
|
|
class="frame-piece frame-piece-top"
|
|
></span>
|
|
<span
|
|
class="frame-piece frame-piece-bottom"
|
|
></span>
|
|
</div>
|
|
<div class="qualification-grid">
|
|
<article
|
|
class="qualification-card"
|
|
id="agencyIdentityCard"
|
|
>
|
|
<p data-i18n="agencyOpening.agencyIdentity">
|
|
Agency Identity
|
|
</p>
|
|
<strong id="agencyIdentityText"
|
|
>Agency</strong
|
|
>
|
|
<img
|
|
class="status-icon"
|
|
src="./assets/status-check.png"
|
|
alt=""
|
|
/>
|
|
</article>
|
|
<article
|
|
class="qualification-card"
|
|
id="hostCountCard"
|
|
>
|
|
<p data-i18n="agencyOpening.hostCount">
|
|
Host Count
|
|
</p>
|
|
<strong id="hostCountText">12 > 10</strong>
|
|
<img
|
|
class="status-icon"
|
|
src="./assets/status-check.png"
|
|
alt=""
|
|
/>
|
|
</article>
|
|
<article
|
|
class="qualification-card"
|
|
id="openingStatusCard"
|
|
>
|
|
<p data-i18n="agencyOpening.openingStatus">
|
|
Opening Status
|
|
</p>
|
|
<strong id="openingStatusText"
|
|
>Not Joined</strong
|
|
>
|
|
<img
|
|
class="status-icon"
|
|
src="./assets/status-check.png"
|
|
alt=""
|
|
/>
|
|
</article>
|
|
</div>
|
|
<button
|
|
class="apply-button"
|
|
id="applyButton"
|
|
type="button"
|
|
>
|
|
<img src="./assets/apply-button.png" alt="" />
|
|
<span data-i18n="agencyOpening.apply"
|
|
>Apply Opening Event</span
|
|
>
|
|
</button>
|
|
<p
|
|
class="eligibility-text"
|
|
id="eligibilityText"
|
|
data-i18n="agencyOpening.eligible"
|
|
>
|
|
Eligible To Apply
|
|
</p>
|
|
</section>
|
|
|
|
<section
|
|
class="opening-section rewards-section"
|
|
aria-labelledby="rewardsTitle"
|
|
>
|
|
<div class="section-title" id="rewardsTitle">
|
|
<img src="./assets/section-title.png" alt="" />
|
|
<h2 data-i18n="agencyOpening.rewardsTitle">
|
|
Opening Rewards
|
|
</h2>
|
|
</div>
|
|
<div
|
|
class="ornate-panel frame-rewards"
|
|
aria-hidden="true"
|
|
>
|
|
<span
|
|
class="frame-piece frame-piece-top"
|
|
></span>
|
|
<span
|
|
class="frame-piece frame-piece-bottom"
|
|
></span>
|
|
</div>
|
|
<div class="reward-table" id="rewardTable">
|
|
<div class="reward-head">
|
|
<strong
|
|
data-i18n="agencyOpening.openingRevenue"
|
|
>Opening Revenue</strong
|
|
>
|
|
<strong
|
|
data-i18n="agencyOpening.rewardCoins"
|
|
>Reward Coins</strong
|
|
>
|
|
</div>
|
|
<div
|
|
class="table-line"
|
|
aria-hidden="true"
|
|
></div>
|
|
<div class="reward-rows" id="rewardRows"></div>
|
|
</div>
|
|
</section>
|
|
|
|
<section
|
|
class="opening-section rules-section"
|
|
aria-labelledby="rulesTitle"
|
|
>
|
|
<div class="section-title" id="rulesTitle">
|
|
<img src="./assets/section-title.png" alt="" />
|
|
<h2 data-i18n="agencyOpening.rulesTitle">
|
|
Activity Rules
|
|
</h2>
|
|
</div>
|
|
<div
|
|
class="ornate-panel frame-rules"
|
|
aria-hidden="true"
|
|
>
|
|
<span
|
|
class="frame-piece frame-piece-top"
|
|
></span>
|
|
<span
|
|
class="frame-piece frame-piece-bottom"
|
|
></span>
|
|
</div>
|
|
<ol class="rules-list" id="rulesList">
|
|
<li data-i18n="agencyOpening.rule1">
|
|
Only agency accounts can apply.
|
|
</li>
|
|
<li data-i18n="agencyOpening.rule2">
|
|
Host count must be more than 10.
|
|
</li>
|
|
<li data-i18n="agencyOpening.rule3">
|
|
Agency age must be less than 7 days.
|
|
</li>
|
|
<li data-i18n="agencyOpening.rule4">
|
|
Each agency can join only once in lifetime.
|
|
</li>
|
|
<li data-i18n="agencyOpening.rule5">
|
|
Opening Event cannot run with Agency Support
|
|
Program at the same time.
|
|
</li>
|
|
<li data-i18n="agencyOpening.rule6">
|
|
Rewards will be sent within 7 days after
|
|
review.
|
|
</li>
|
|
</ol>
|
|
</section>
|
|
|
|
<section
|
|
class="opening-section record-section"
|
|
aria-labelledby="recordTitle"
|
|
>
|
|
<div class="section-title" id="recordTitle">
|
|
<img src="./assets/section-title.png" alt="" />
|
|
<h2 data-i18n="agencyOpening.recordTitle">
|
|
Opening Record
|
|
</h2>
|
|
</div>
|
|
<div
|
|
class="ornate-panel frame-record"
|
|
aria-hidden="true"
|
|
>
|
|
<span
|
|
class="frame-piece frame-piece-top"
|
|
></span>
|
|
<span
|
|
class="frame-piece frame-piece-bottom"
|
|
></span>
|
|
</div>
|
|
<div class="record-table">
|
|
<div class="record-row">
|
|
<span data-i18n="agencyOpening.guildName"
|
|
>Guild Name:</span
|
|
>
|
|
<strong id="recordGuildName"
|
|
>Royal Family</strong
|
|
>
|
|
</div>
|
|
<div class="record-row">
|
|
<span data-i18n="agencyOpening.created"
|
|
>Created:</span
|
|
>
|
|
<strong id="recordCreated"
|
|
>2026-06-01</strong
|
|
>
|
|
</div>
|
|
<div class="record-row">
|
|
<span
|
|
data-i18n="agencyOpening.recordRevenue"
|
|
>Opening Revenue:</span
|
|
>
|
|
<strong id="recordRevenue">100K</strong>
|
|
</div>
|
|
<div class="record-row">
|
|
<span data-i18n="agencyOpening.recordReward"
|
|
>Reward:</span
|
|
>
|
|
<strong id="recordReward">500K</strong>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</section>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
<script>
|
|
window.HyAppI18nSupported = ['en', 'ar', 'tr', 'es', 'zh', 'id'];
|
|
</script>
|
|
<script src="../../common/i18n.js?v=20260612-agency-opening"></script>
|
|
<script src="../../common/api.js?v=20260612-agency-opening"></script>
|
|
<script src="./script.js?v=20260616-agency-opening-tiers"></script>
|
|
</body>
|
|
</html>
|