From 52aa07ab987c289d13bfd3384b945bcffff0d68b Mon Sep 17 00:00:00 2001 From: Gogs Date: Mon, 6 Jul 2026 21:35:19 +0200 Subject: [PATCH] Add app layout with sidebar and header --- app/public/assets/css/main.css | 242 +++++++++++++++++++++++++++------ app/public/index.php | 39 +++++- app/src/Config.php | 12 +- app/src/View.php | 2 - app/templates/channel.php | 2 +- app/templates/channels.php | 44 ++++++ app/templates/header.php | 10 ++ app/templates/home.php | 2 +- app/templates/layout.php | 21 ++- app/templates/sidebar.php | 9 ++ docs/server-setup.md | 6 + 11 files changed, 314 insertions(+), 75 deletions(-) create mode 100644 app/templates/channels.php create mode 100644 app/templates/header.php create mode 100644 app/templates/sidebar.php create mode 100644 docs/server-setup.md diff --git a/app/public/assets/css/main.css b/app/public/assets/css/main.css index 678295f..2dbeb5c 100644 --- a/app/public/assets/css/main.css +++ b/app/public/assets/css/main.css @@ -1,89 +1,245 @@ +:root { + --bg: #0f172a; + --panel: #111827; + --panel-2: #1f2937; + --panel-3: #273244; + --border: #334155; + --text: #f8fafc; + --muted: #94a3b8; + --accent: #3b82f6; + --accent-soft: rgba(59, 130, 246, 0.16); + --success: #22c55e; +} + +* { + box-sizing: border-box; +} + body { margin: 0; - font-family: system-ui, sans-serif; - background: #101114; - color: #eee; + font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; + background: var(--bg); + color: var(--text); } -.topbar { - padding: 20px; - background: #181a20; - border-bottom: 1px solid #2b2f3a; +.app-shell { + min-height: 100vh; + display: grid; + grid-template-columns: 230px 1fr; +} + +.sidebar { + background: #0b1120; + border-right: 1px solid var(--border); + padding: 24px 16px; +} + +.sidebar-nav { + display: flex; + flex-direction: column; + gap: 8px; +} + +.sidebar-nav a { + color: var(--muted); + text-decoration: none; + padding: 12px 14px; + border-radius: 12px; + font-weight: 600; +} + +.sidebar-nav a:hover, +.sidebar-nav a.active { + color: var(--text); + background: var(--accent-soft); +} + +.app-main { + min-width: 0; +} + +.app-header { + height: 82px; + background: var(--panel); + border-bottom: 1px solid var(--border); + padding: 16px 28px; display: flex; align-items: center; - gap: 28px; + justify-content: space-between; + gap: 24px; } -.topbar h1 { - margin: 0; +.brand-title { + font-size: 1.45rem; + font-weight: 800; } -.topbar nav { - display: flex; - gap: 14px; +.brand-subtitle { + color: var(--muted); + font-size: 0.85rem; + margin-top: 2px; } -.topbar a { - color: #cfd6e6; - text-decoration: none; +.search-box input { + width: min(360px, 40vw); + background: #020617; + color: var(--text); + border: 1px solid var(--border); + border-radius: 999px; + padding: 10px 16px; } -main { - padding: 20px; - max-width: 1100px; - margin: 0 auto; +.content { + padding: 32px; + max-width: 1280px; } .channel { - margin-bottom: 28px; - background: #181a20; - border: 1px solid #2b2f3a; - border-radius: 16px; + margin-bottom: 24px; + background: var(--panel); + border: 1px solid var(--border); + border-radius: 18px; overflow: hidden; } .channel-header { - padding: 14px 18px; - background: #20232c; - font-size: 1.25rem; - font-weight: 700; + padding: 16px 20px; + background: var(--panel-2); + font-size: 1.2rem; + font-weight: 800; } .programme { - padding: 14px 18px; - border-top: 1px solid #2b2f3a; + padding: 16px 20px; + border-top: 1px solid var(--border); } .programme-time { - color: #9da7bd; + color: var(--muted); font-size: 0.95rem; - margin-bottom: 4px; + margin-bottom: 5px; } .programme-title { font-size: 1.1rem; - font-weight: 700; + font-weight: 800; } .programme-desc { - color: #c9ced8; - margin-top: 6px; + color: #cbd5e1; + margin-top: 7px; } .category { display: inline-block; - margin-top: 8px; - padding: 3px 8px; + margin-top: 10px; + padding: 4px 9px; border-radius: 999px; - background: #303545; - color: #cfd6e6; + background: var(--panel-3); + color: #dbeafe; font-size: 0.8rem; } -.empty { - color: #aaa; - background: #181a20; - border: 1px solid #2b2f3a; +.empty, +.notice { + background: var(--panel); + border: 1px solid var(--border); border-radius: 16px; padding: 18px; } + +.notice { + border-color: #15803d; + background: rgba(34, 197, 94, 0.12); + color: #dcfce7; + margin-bottom: 18px; +} + +button { + background: var(--accent); + color: white; + border: 0; + border-radius: 10px; + padding: 10px 16px; + font-weight: 800; + cursor: pointer; +} + +.settings-header { + display: flex; + justify-content: space-between; + align-items: center; + margin-bottom: 18px; +} + +.settings-header h2 { + margin: 0; +} + +.channels-table { + width: 100%; + border-collapse: collapse; + background: var(--panel); + border: 1px solid var(--border); + border-radius: 16px; + overflow: hidden; +} + +.channels-table th, +.channels-table td { + padding: 12px; + border-bottom: 1px solid var(--border); + text-align: left; +} + +.channels-table th { + background: var(--panel-2); + color: #cbd5e1; +} + +.channels-table input[type="text"], +.channels-table input[type="number"] { + background: #020617; + color: var(--text); + border: 1px solid var(--border); + border-radius: 8px; + padding: 7px 9px; +} + +.number-input { + width: 70px; +} + +.channel-id { + color: var(--muted); + font-size: 0.8rem; + margin-top: 3px; +} + +@media (max-width: 900px) { + .app-shell { + grid-template-columns: 1fr; + } + + .sidebar { + border-right: 0; + border-bottom: 1px solid var(--border); + } + + .sidebar-nav { + flex-direction: row; + overflow-x: auto; + } + + .content { + padding: 20px; + } + + .app-header { + padding: 14px 20px; + } + + .search-box input { + width: 160px; + } +} diff --git a/app/public/index.php b/app/public/index.php index a273ad6..72deafd 100644 --- a/app/public/index.php +++ b/app/public/index.php @@ -1,10 +1,8 @@ synchronizeChannels($config); +$view = $_GET['view'] ?? $config->get('default_view', 'today'); + +if ($view === 'channels' && $_SERVER['REQUEST_METHOD'] === 'POST') { + $savedChannels = $config->getChannels(); + + foreach ($savedChannels as $id => &$channel) { + $channel['enabled'] = isset($_POST['enabled'][$id]); + $channel['favorite'] = isset($_POST['favorite'][$id]); + $channel['number'] = (int)($_POST['number'][$id] ?? $channel['number'] ?? 999999); + $channel['group'] = trim($_POST['group'][$id] ?? $channel['group'] ?? 'Unknown'); + } + + unset($channel); + + uasort($savedChannels, function ($a, $b) { + return ((int)($a['number'] ?? 999999)) <=> ((int)($b['number'] ?? 999999)); + }); + + $config->saveChannels($savedChannels); + + header('Location: /?view=channels&saved=1'); + exit; +} + [$channels, $programmes] = $xmltv->load($config); -$contentTemplate = '/var/www/templates/home.php'; +$contentTemplate = $view === 'channels' + ? '/var/www/templates/channels.php' + : '/var/www/templates/home.php'; View::render('layout', [ 'title' => $config->get('title', 'TVGuide'), 'channels' => $channels, 'programmes' => $programmes, 'contentTemplate' => $contentTemplate, + 'view' => $view, + 'channelConfig' => $config->getChannels(), + 'saved' => isset($_GET['saved']), ]); diff --git a/app/src/Config.php b/app/src/Config.php index 095f415..ebedb14 100644 --- a/app/src/Config.php +++ b/app/src/Config.php @@ -1,10 +1,5 @@ channels = $channels; - file_put_contents( '/var/www/config/channels.json', - json_encode( - $channels, - JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE - ) + json_encode($channels, JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE) ); } } diff --git a/app/src/View.php b/app/src/View.php index 646cdfe..26e45d2 100644 --- a/app/src/View.php +++ b/app/src/View.php @@ -1,7 +1,5 @@ - $p]); ?> + $p]); ?> diff --git a/app/templates/channels.php b/app/templates/channels.php new file mode 100644 index 0000000..15ae53b --- /dev/null +++ b/app/templates/channels.php @@ -0,0 +1,44 @@ + +
Sender gespeichert.
+ + +
+
+

Senderverwaltung

+ +
+ + + + + + + + + + + + + $channel): ?> + + + + + + + + + +
Nr.AktivFavoritSenderGruppe
+ + + > + + > + + +
+ 		+ +
+
diff --git a/app/templates/header.php b/app/templates/header.php new file mode 100644 index 0000000..38382d8 --- /dev/null +++ b/app/templates/header.php @@ -0,0 +1,10 @@ +
+
+
TVGuide
+
tv.windesign.at
+
+ +
+ +
+
diff --git a/app/templates/home.php b/app/templates/home.php index 467b449..5354235 100644 --- a/app/templates/home.php +++ b/app/templates/home.php @@ -5,7 +5,7 @@ $channel): ?> - $channelId, 'channel' => $channel, 'programmes' => $programmes[$channelId] ?? [] diff --git a/app/templates/layout.php b/app/templates/layout.php index 21e7aa1..b94a705 100644 --- a/app/templates/layout.php +++ b/app/templates/layout.php @@ -7,18 +7,17 @@ -
-

TVGuide

- -
+
+ -
- -
+
+ + +
+ +
+
+
diff --git a/app/templates/sidebar.php b/app/templates/sidebar.php new file mode 100644 index 0000000..56ff62e --- /dev/null +++ b/app/templates/sidebar.php @@ -0,0 +1,9 @@ + diff --git a/docs/server-setup.md b/docs/server-setup.md new file mode 100644 index 0000000..14ce50e --- /dev/null +++ b/docs/server-setup.md @@ -0,0 +1,6 @@ +# Gitea SSH + +Wenn der Linux-Benutzer `git` ein anderes Home-Verzeichnis als `/home/git` besitzt (z. B. `/var/opt/gitlab`), muss in `app.ini` Folgendes gesetzt werden: + +```ini +SSH_ROOT_PATH = /var/opt/gitlab/.ssh