Vicky
a94018d5d3
web-ci / build (push) Canceled after 0s
- public/indonesia/ 下独立静态原型，不影响后台构建 - 覆盖首页、发现、详情、播放、收藏、个人中心、金币解锁等核心流程
73 lines
4.3 KiB
HTML
73 lines
4.3 KiB
HTML
<!-- Author: fruit.com.cn -->
|
|
<!-- 印尼市场短剧客户端交互设计入口。 -->
|
|
<!doctype html>
|
|
<html lang="id">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
|
<meta name="theme-color" content="#0b0c10" />
|
|
<meta name="description" content="FruitShorts — drama pendek, cerita yang dekat." />
|
|
<title>FruitShorts · Drama pendek pilihanmu</title>
|
|
<link rel="icon" href="../brand-mark.png" />
|
|
<link rel="stylesheet" href="styles.css" />
|
|
<link rel="stylesheet" href="screens.css" />
|
|
<script defer src="assets/lucide.min.js"></script>
|
|
<script defer src="data.js"></script>
|
|
<script defer src="state.js"></script>
|
|
<script defer src="views.js"></script>
|
|
<script defer src="dialogs.js"></script>
|
|
<script defer src="app.js"></script>
|
|
</head>
|
|
<body>
|
|
<a class="skip-link" href="#main">Langsung ke konten</a>
|
|
<aside class="sidebar" aria-label="Navigasi utama">
|
|
<a class="brand" href="#home" aria-label="FruitShorts Beranda">
|
|
<span class="brand-mark"><i data-lucide="play" aria-hidden="true"></i></span>
|
|
<span>Fruit<span class="brand-accent">Shorts</span></span>
|
|
</a>
|
|
<span class="nav-caption">MENU UTAMA</span>
|
|
<nav class="main-nav">
|
|
<a href="#home" data-nav="home"><i data-lucide="house"></i><span>Beranda</span></a>
|
|
<a href="#discover" data-nav="discover"><i data-lucide="compass"></i><span>Jelajahi</span></a>
|
|
<a href="#me" data-nav="me"><i data-lucide="circle-user-round"></i><span>Saya</span></a>
|
|
</nav>
|
|
<div class="sidebar-divider"></div>
|
|
<span class="nav-caption">KOLEKSI SAYA</span>
|
|
<nav class="collection-nav">
|
|
<a href="#library"><i data-lucide="bookmark"></i>Daftar saya<span id="saved-count">0</span></a>
|
|
<a href="#history"><i data-lucide="history"></i>Riwayat tontonan</a>
|
|
</nav>
|
|
<div class="sidebar-bottom">
|
|
<div class="local-note"><i data-lucide="clapperboard"></i><span>Cerita singkat.<br /><strong>Rasa yang melekat.</strong></span></div>
|
|
<button class="help-link" data-action="help"><i data-lucide="circle-help"></i>Pusat bantuan<i data-lucide="arrow-up-right"></i></button>
|
|
<span class="copyright">© 2026 FruitShorts</span>
|
|
</div>
|
|
</aside>
|
|
<div class="app-shell">
|
|
<header class="topbar">
|
|
<a class="brand mobile-brand" href="#home"><span class="brand-mark"><i data-lucide="play"></i></span><span>Fruit<span class="brand-accent">Shorts</span></span></a>
|
|
<form class="search-form" role="search">
|
|
<i data-lucide="search" aria-hidden="true"></i>
|
|
<input id="global-search" type="search" placeholder="Cari drama, temukan cerita..." aria-label="Cari drama" autocomplete="off" />
|
|
<kbd aria-hidden="true">/</kbd>
|
|
</form>
|
|
<div class="topbar-actions">
|
|
<button class="language-button" data-action="language" title="Bahasa"><i data-lucide="globe-2"></i><span>ID</span><i data-lucide="chevron-down"></i></button>
|
|
<button class="wallet-button" data-action="wallet" title="Dompet koin"><i data-lucide="coins"></i><span data-balance>120</span><span class="wallet-add">+</span></button>
|
|
<button class="icon-button notification-button" data-action="notifications" aria-label="Notifikasi" title="Notifikasi"><i data-lucide="bell"></i><span></span></button>
|
|
<a class="avatar" href="#me" aria-label="Profil saya">N</a>
|
|
</div>
|
|
</header>
|
|
<main id="main"></main>
|
|
<footer class="page-footer"><a class="brand" href="#home">Fruit<span class="brand-accent">Shorts</span></a><span>Drama pendek. Momen besar.</span><button data-action="privacy">Privasi</button><button data-action="terms">Ketentuan</button><span>Indonesia · Bahasa Indonesia</span></footer>
|
|
</div>
|
|
<nav class="bottom-nav" aria-label="Navigasi seluler">
|
|
<a href="#home" data-nav="home"><i data-lucide="house"></i><span>Beranda</span></a>
|
|
<a href="#discover" data-nav="discover"><i data-lucide="compass"></i><span>Jelajahi</span></a>
|
|
<a href="#me" data-nav="me"><i data-lucide="circle-user-round"></i><span>Saya</span></a>
|
|
</nav>
|
|
<dialog id="app-dialog" aria-labelledby="dialog-title"></dialog>
|
|
<div id="toast" class="toast" role="status" aria-live="polite"></div>
|
|
</body>
|
|
</html>
|