152 lines
7.5 KiB
HTML
152 lines
7.5 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" />
|
|
<title>Host Center</title>
|
|
<link rel="stylesheet" href="./style.css?v=20260428-2060" />
|
|
</head>
|
|
<body>
|
|
<div class="host-center" aria-label="Host Center" data-i18n-aria="page_label" data-loading="true" data-view="loading">
|
|
<div class="hero-bg" aria-hidden="true"></div>
|
|
|
|
<header class="status-bar" aria-hidden="true">
|
|
<span class="status-time">9:41</span>
|
|
<span class="status-icons">
|
|
<span class="cellular"><i></i><i></i><i></i><i></i></span>
|
|
<span class="wifi"><i></i><i></i><i></i></span>
|
|
<span class="battery"><i></i></span>
|
|
</span>
|
|
</header>
|
|
|
|
<nav class="title-bar">
|
|
<button class="back-button" type="button" aria-label="Back" data-i18n-aria="back">
|
|
<svg viewBox="0 0 32 32" aria-hidden="true">
|
|
<path d="M20 8 12 16l8 8" />
|
|
</svg>
|
|
</button>
|
|
<h1 data-i18n="title">Host Center</h1>
|
|
<div class="language-switcher">
|
|
<button class="language-button" type="button" aria-label="Change language" data-i18n-aria="language_button_aria" aria-expanded="false">EN</button>
|
|
<div class="language-menu" hidden>
|
|
<button type="button" data-lang="en">EN</button>
|
|
<button type="button" data-lang="ar">AR</button>
|
|
<button type="button" data-lang="tr">TR</button>
|
|
<button type="button" data-lang="id">ID</button>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<main class="content">
|
|
<section class="card profile-card">
|
|
<div class="avatar-shell">
|
|
<img class="avatar-image" id="profileAvatar" alt="" hidden />
|
|
</div>
|
|
<div class="profile-copy">
|
|
<div class="name" id="profileName"></div>
|
|
<div class="meta" id="profileUid" data-i18n="uid"></div>
|
|
<button class="agency" type="button">
|
|
<span data-i18n="agency"></span>
|
|
</button>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="card join-agency-card" id="joinAgencyCard" hidden>
|
|
<div class="join-agency-copy">
|
|
<div class="join-agency-title" data-i18n="join_agency_title">Join Agency</div>
|
|
<div class="join-agency-text" data-i18n="join_agency_text">Search for an agency ID and submit your application.</div>
|
|
</div>
|
|
<a class="join-agency-action" id="joinAgencyLink" href="../join-agency/index.html" data-i18n="join_agency_action">Join now</a>
|
|
</section>
|
|
|
|
<section class="card metrics-card host-only">
|
|
<div class="metric">
|
|
<div class="label" data-i18n-html="streaming_duration">Work Time (min)</div>
|
|
<div class="value" id="streamingDuration"></div>
|
|
</div>
|
|
<div class="vertical-line" aria-hidden="true"></div>
|
|
<div class="metric gift-metric">
|
|
<div class="label" data-i18n="target">Target</div>
|
|
<button class="gift-value" type="button" aria-live="polite" aria-label="Open daily data" data-i18n-aria="open_daily_data">
|
|
<span class="amount-text" id="currentGiftValue"></span>
|
|
<span class="chevron">›</span>
|
|
</button>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="card income-card host-only">
|
|
<div class="income-head">
|
|
<div class="income-title">
|
|
<span data-i18n="my_income">Salary</span>
|
|
<svg viewBox="0 0 20 20" aria-hidden="true">
|
|
<circle cx="10" cy="10" r="8" />
|
|
<path d="M10 9v5M10 6.3v.2" />
|
|
</svg>
|
|
</div>
|
|
<a class="cash-link" href="../withdraw-exchange/index.html" aria-label="Open withdraw and exchange page" data-i18n-aria="open_withdraw_exchange">
|
|
<span data-i18n="withdraw_exchange">Withdraw/Exchange</span>
|
|
<span class="chevron">›</span>
|
|
</a>
|
|
</div>
|
|
<a class="income-value" href="../withdraw-exchange/index.html" aria-label="Open withdraw and exchange page" data-i18n-aria="open_withdraw_exchange">
|
|
<span class="income-currency" aria-hidden="true">$</span>
|
|
<span class="amount-text" id="currentSalary"></span>
|
|
<span class="chevron">›</span>
|
|
</a>
|
|
</section>
|
|
|
|
<section class="card policy-entry-card host-only">
|
|
<a class="policy-entry-link" id="anchorPolicyLink" href="./policy.html" aria-label="Open host policy" data-i18n-aria="open_anchor_policy">
|
|
<span class="policy-entry-left">
|
|
<svg viewBox="0 0 28 28" aria-hidden="true">
|
|
<path d="M8 5h10l3 3v15H8Z" />
|
|
<path d="M18 5v5h4M11 14h7M11 18h6" />
|
|
</svg>
|
|
<span data-i18n="anchor_policy">Host Policy</span>
|
|
</span>
|
|
<span class="chevron">›</span>
|
|
</a>
|
|
</section>
|
|
</main>
|
|
|
|
<div class="daily-modal" id="dailyModal" hidden>
|
|
<div class="daily-backdrop" data-close-daily></div>
|
|
<section class="daily-sheet" role="dialog" aria-modal="true" aria-labelledby="dailyTitle">
|
|
<div class="daily-sheet-head">
|
|
<h2 id="dailyTitle" data-i18n="daily_details">Daily data</h2>
|
|
<button class="daily-close" type="button" aria-label="Close" data-i18n-aria="close" data-close-daily>×</button>
|
|
</div>
|
|
<div class="daily-summary">
|
|
<span data-i18n="target">Target</span>
|
|
<strong id="dailyCurrentGift">0</strong>
|
|
</div>
|
|
<div class="daily-list" id="dailyList"></div>
|
|
</section>
|
|
</div>
|
|
|
|
<div class="home-indicator" aria-hidden="true"></div>
|
|
<div class="loading-mask" id="loadingMask" role="status" aria-live="polite" aria-busy="true">
|
|
<div class="loading-eagle" aria-hidden="true">
|
|
<svg class="stick-eagle-svg" viewBox="0 0 220 150" focusable="false">
|
|
<ellipse class="stick-eagle-shadow" cx="110" cy="128" rx="52" ry="8"></ellipse>
|
|
<g class="stick-eagle-flight">
|
|
<path class="stick-eagle-wing stick-eagle-wing-left" d="M104 72C80 38 43 18 15 30c24 10 44 25 61 48-22-5-44 0-62 17 33 12 65 8 92-13"></path>
|
|
<path class="stick-eagle-wing stick-eagle-wing-right" d="M116 72c24-34 61-54 89-42-24 10-44 25-61 48 22-5 44 0 62 17-33 12-65 8-92-13"></path>
|
|
<path class="stick-eagle-feather stick-eagle-feather-left" d="M38 37c18 11 33 25 45 43M54 74c14 0 28-3 42-11M26 93c21 2 42-1 63-10"></path>
|
|
<path class="stick-eagle-feather stick-eagle-feather-right" d="M182 37c-18 11-33 25-45 43M166 74c-14 0-28-3-42-11M194 93c-21 2-42-1-63-10"></path>
|
|
<path class="stick-eagle-body" d="M91 67c9-21 29-21 38 0 7 21-4 39-19 39S84 88 91 67Z"></path>
|
|
<path class="stick-eagle-chest" d="M99 76c5 9 17 9 22 0"></path>
|
|
<path class="stick-eagle-tail" d="M99 101 84 120M110 106v26M121 101l15 19"></path>
|
|
<path class="stick-eagle-head" d="M101 46c7-12 25-13 34-3 8 9 5 25-9 31-12 5-27-2-29-16l-15-7 18-1"></path>
|
|
<path class="stick-eagle-beak" d="M135 51h28l-24 11"></path>
|
|
<circle class="stick-eagle-eye" cx="123" cy="48" r="2.8"></circle>
|
|
</g>
|
|
</svg>
|
|
</div>
|
|
<div class="loading-copy">loading....</div>
|
|
</div>
|
|
</div>
|
|
<script src="./script.js?v=20260428-2060" defer></script>
|
|
</body>
|
|
</html>
|