vinny/iptv-stream-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Complete 3.3.3: Mobile Navigation - Implement bottom navigation pattern for mobile with chat controls

Browse source
This commit is contained in:
VinnyNC 2025-09-29 21:29:03 -04:00
parent a7fa21d3fa
commit 91a5c81a25
3 changed files with 188 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

29
index.php
View file

@ -401,6 +401,35 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['action'])) {
<!-- Toast Notification -->
<div class="toast" id="toast"></div>
<!-- Mobile Bottom Navigation -->
<nav class="mobile-nav" id="mobileNav" role="navigation" aria-label="Mobile navigation">
<button class="mobile-nav-btn" data-action="toggle-chat" aria-label="Toggle chat" aria-expanded="false">
<span class="icon icon-chat icon-lg"></span>
<span>Chat</span>
</button>
<button class="mobile-nav-btn" data-action="refresh-stream" aria-label="Refresh stream">
<span class="icon icon-refresh icon-lg"></span>
<span>Refresh</span>
</button>
<button class="mobile-nav-btn" data-action="toggle-fullscreen" aria-label="Toggle fullscreen">
<svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="24" height="24">
<path d="M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7"></path>
</svg>
<span>Fullscreen</span>
</button>
<button class="mobile-nav-btn" data-action="toggle-picture-in-picture" aria-label="Picture in picture mode">
<svg class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="24" height="24">
<path d="M21 3H3v7h18V3z"></path>
<rect x="7" y="13" width="10" height="7" rx="2"></rect>
</svg>
<span>PiP</span>
</button>
<button class="mobile-nav-btn" data-action="toggle-quality" aria-label="Video quality settings" style="display:none;">
<span class="icon icon-settings icon-lg"></span>
<span>Quality</span>
</button>
</nav>
<script src="https://vjs.zencdn.net/8.6.1/video.min.js"></script>
<script defer src="assets/js/app.js?v=1.4.4"></script>
<script defer src="assets/js/api.js?v=1.4.4"></script>