Mike
94b6cc3be9
Includes homelab deploy tooling, image position/zoom manifest persistence, and full trading/casino stack. Co-authored-by: Cursor <cursoragent@cursor.com>
99 lines
4.0 KiB
HTML
99 lines
4.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<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" />
|
|
<meta name="theme-color" content="#0a0a0a" />
|
|
<style>html,body{background:#0a0a0a;color:#f4f1e9}</style>
|
|
<title>PlayBull — Trilogy Hub Trading & Arcade</title>
|
|
<link rel="preconnect" href="https://api.fontshare.com" crossorigin />
|
|
<link href="https://api.fontshare.com/v2/css?f[]=cabinet-grotesk@500,700,800,900&f[]=satoshi@400,500,700,900&display=swap" rel="stylesheet" />
|
|
<!-- Animation libs -->
|
|
<script defer src="https://cdn.jsdelivr.net/npm/gsap@3.12.5/dist/gsap.min.js"></script>
|
|
<script defer src="https://cdn.jsdelivr.net/npm/canvas-confetti@1.9.3/dist/confetti.browser.min.js"></script>
|
|
<link rel="stylesheet" href="/css/styles.css" />
|
|
</head>
|
|
<body>
|
|
<!-- Topbar (in iframe via ?embed=1 ausgeblendet) -->
|
|
<header class="topbar" id="pbTopbar">
|
|
<div class="brand" id="brandHome">
|
|
<span class="brand-logo">🐂</span>
|
|
<span class="brand-name">Play<span class="accent">Bull</span></span>
|
|
</div>
|
|
<div class="topbar-right">
|
|
<div class="balance-chip" id="balanceChip" hidden>
|
|
<span class="coin">🪙</span><span id="balanceValue">0</span>
|
|
</div>
|
|
<button class="btn-auth" id="authBtn">Login</button>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- Globaler Live-Feed (Ticker) -->
|
|
<div class="ticker" id="feedTicker"><div class="ticker-track" id="tickerTrack"></div></div>
|
|
|
|
<main id="app">
|
|
<!-- ===== TRADING ===== -->
|
|
<section class="view active" id="view-trading">
|
|
<div class="view-head">
|
|
<h1>Markt <span class="live-dot"></span><small>live</small></h1>
|
|
<div class="seg" id="marketFilter">
|
|
<button class="seg-btn active" data-f="all">Alle</button>
|
|
<button class="seg-btn" data-f="stock">Aktien</button>
|
|
<button class="seg-btn" data-f="crypto">Krypto</button>
|
|
</div>
|
|
</div>
|
|
<div class="asset-list" id="assetList"></div>
|
|
</section>
|
|
|
|
<!-- ===== GAMES ===== -->
|
|
<section class="view" id="view-games">
|
|
<div class="view-head"><h1>Casino 🎰</h1></div>
|
|
<div class="games-grid" id="gamesGrid"></div>
|
|
<div class="login-hint" id="gamesLoginHint" hidden>
|
|
🔒 Zum Spielen bitte <button class="link" data-open-auth>einloggen</button>.
|
|
</div>
|
|
</section>
|
|
|
|
<!-- ===== PORTFOLIO ===== -->
|
|
<section class="view" id="view-portfolio">
|
|
<div class="view-head"><h1>Portfolio 💼</h1></div>
|
|
<div id="portfolioContent"></div>
|
|
</section>
|
|
|
|
<!-- ===== SOCIAL / LEADERBOARD ===== -->
|
|
<section class="view" id="view-social">
|
|
<div class="view-head"><h1>Rangliste 🏆</h1></div>
|
|
<div id="leaderboardContent"></div>
|
|
<div class="view-head"><h2>Aktivität</h2></div>
|
|
<div id="feedList" class="feed-list"></div>
|
|
</section>
|
|
|
|
<!-- ===== SETTINGS / ADMIN ===== -->
|
|
<section class="view" id="view-settings">
|
|
<div class="view-head"><h1>Einstellungen ⚙️</h1></div>
|
|
<div id="settingsContent"></div>
|
|
</section>
|
|
</main>
|
|
|
|
<!-- Bottom Nav -->
|
|
<nav class="bottom-nav">
|
|
<button class="nav-btn active" data-view="trading"><span>📈</span>Trading</button>
|
|
<button class="nav-btn" data-view="games"><span>🎰</span>Casino</button>
|
|
<button class="nav-btn" data-view="portfolio"><span>💼</span>Depot</button>
|
|
<button class="nav-btn" data-view="social"><span>🏆</span>Social</button>
|
|
<button class="nav-btn" data-view="settings"><span>⚙️</span>Mehr</button>
|
|
</nav>
|
|
|
|
<!-- Modal Container -->
|
|
<div class="modal-backdrop" id="modal" hidden>
|
|
<div class="modal" id="modalBox"></div>
|
|
</div>
|
|
|
|
<!-- Toast -->
|
|
<div class="toast-wrap" id="toastWrap"></div>
|
|
|
|
<script src="/socket.io/socket.io.js"></script>
|
|
<script type="module" src="/js/app.js"></script>
|
|
</body>
|
|
</html>
|