Adiciona layout mobile responsivo e ícones PWA
--- - Adicionado FABs flutuantes (Refresh e Add) no canto inferior direito para telas abaixo de 640px; - Ocultados botões de Refresh e Add do header no mobile (hidden sm:flex); - Cards passam a ocupar largura total no mobile (sm:max-w-[...] com prefixo responsivo em page.tsx e StreamCard.tsx); - Adicionado overflow-x: hidden no body para eliminar scroll horizontal no mobile; - Seletor de tamanho de card ocultado no popup de Settings no mobile (hidden sm:flex); - Adicionados ícones apple-touch-icon.png e apple-touch-icon-dark.png em public/ para instalação como PWA; - Registrados os ícones no metadata do layout com suporte a light/dark via media query; - Corrigido estilo do toggle de GPU no StreamForm para transição mais consistente; - Reduzido shm_size de 2gb para 1gb no exemplo do compose no CHANGELOG.md; - Atualizada seção de screenshots no README para incluir dashboard-config.png em layout de 3 colunas; ---
This commit is contained in:
@@ -10,8 +10,9 @@ Turn any web page into an RTMP/HLS stream. Chromium renders the page, ffmpeg cap
|
||||

|
||||
|
||||
<p align="center">
|
||||
<img src="./screenshots/stream-config.png" alt="Stream Config" width="49%" />
|
||||
<img src="./screenshots/login.png" alt="Login Page" width="49%" />
|
||||
<img src="./screenshots/dashboard-config.png" alt="Dashboard Config" width="33%" />
|
||||
<img src="./screenshots/stream-config.png" alt="Stream Config" width="33%" />
|
||||
<img src="./screenshots/login.png" alt="Login Page" width="33%" />
|
||||
</p>
|
||||
|
||||
## How it works
|
||||
@@ -43,6 +44,7 @@ All processes are managed by Supervisord. The web UI is a Next.js app that contr
|
||||
- **Open in new tab** — global toggle in Settings to open any button in a new tab instead of navigating in place; saved in the browser
|
||||
- **Chromium auto-reload** — per-stream toggle to reload the Chromium page on a configurable interval via Chrome DevTools Protocol; configured from the card menu and persisted on the server
|
||||
- **Player client-side auto-reload** — global toggle in Settings to reload the HLS player itself on a configurable interval (in minutes)
|
||||
- **Mobile-friendly UI** — responsive layout for phones (< 640 px): Add and Refresh become floating action buttons in the bottom-right corner, cards fill the screen width automatically, no horizontal scroll; installable as a PWA with separate light/dark home-screen icons
|
||||
|
||||
## Platform Support
|
||||
|
||||
|
||||
Reference in New Issue
Block a user