Beamer-Diashow der laufenden Matches unter /beamer

Ein Match pro Folie, groß und aus der Ferne lesbar: Teams, Serienstand, aktuelle Map mit Rundenstand und Seiten, Maps der Serie, im Veto wer dran ist. Zum Schluss eine Folie mit Lobbys und Ergebnissen. Schaltet automatisch weiter (?sekunden=), Vollbild per Klick oder F, Pfeiltasten und Leertaste. In der Kopfzeile verlinkt.

client/src/App.jsx

@@ -6,6 +6,7 @@ import CreateMatch from './pages/CreateMatch.jsx';
 import MatchPage from './pages/MatchPage.jsx';
 import StreamPage from './pages/StreamPage.jsx';
 import StreamOverviewPage from './pages/StreamOverviewPage.jsx';
+import BeamerPage from './pages/BeamerPage.jsx';
 import AdminPage from './pages/AdminPage.jsx';
 import { JoinPage, WatchPage } from './pages/AccessPages.jsx';
 
@@ -16,6 +17,8 @@ export default function App() {
       <Route path="/stream/:code" element={<StreamPage />} />
       <Route path="/stream/match/:matchId" element={<StreamOverviewPage />} />
       <Route path="/stream" element={<StreamOverviewPage />} />
+      {/* Diashow der laufenden Matches für den Beamer, ein Match pro Folie */}
+      <Route path="/beamer" element={<BeamerPage />} />
       <Route path="*" element={<MainLayout />} />
     </Routes>
   );
@@ -44,6 +47,7 @@ function MainLayout() {
         <nav>
           <Link to="/" className="nav-link">Übersicht</Link>
           <a href="/stream" target="_blank" rel="noreferrer" className="nav-link">Stream-Übersicht</a>
+          <a href="/beamer" target="_blank" rel="noreferrer" className="nav-link">Beamer</a>
           <Link to="/admin" className="nav-link">Admin</Link>
           <Link to="/neu" className="btn btn-primary btn-sm">Match erstellen</Link>
         </nav>