From e5182591b972956f98f95394a88cc5a8e53e2afc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andreas=20Kr=C3=BChlmann?= Date: Wed, 10 Dec 2025 11:02:39 +0100 Subject: [PATCH] Add header --- src/main/resources/static/css/styles.css | 60 +++++++++++++++++++++++- src/main/resources/templates/admin.html | 45 +++++++++++------- 2 files changed, 85 insertions(+), 20 deletions(-) diff --git a/src/main/resources/static/css/styles.css b/src/main/resources/static/css/styles.css index 09305d7..ba53ed3 100644 --- a/src/main/resources/static/css/styles.css +++ b/src/main/resources/static/css/styles.css @@ -268,6 +268,58 @@ body { flex-direction: column; } +.admin-body { + background: radial-gradient(circle at 0% 30%, rgba(59, 130, 246, 0.12), transparent 32%), + radial-gradient(circle at 90% 5%, rgba(124, 58, 237, 0.1), transparent 30%), + #0f172a; +} + +.admin-shell { + max-width: 1200px; + width: 100%; + margin: 0 auto; + padding: 28px 18px 56px; + display: flex; + flex-direction: column; + gap: 18px; +} + +.admin-header { + display: flex; + align-items: center; + justify-content: space-between; + gap: 16px; + padding: 18px 22px; + background: rgba(15, 23, 42, 0.92); + border: 1px solid #1f2937; + border-radius: 16px; + box-shadow: 0 18px 50px rgba(0, 0, 0, 0.4); +} + +.admin-header h1 { + margin: 6px 0 8px; +} + +.admin-identity { + display: flex; + gap: 14px; + align-items: center; +} + +.header-actions.tight { + gap: 8px; +} + +.header-actions.horizontal { + flex-direction: row; + align-items: center; + gap: 10px; +} + +.header-actions.horizontal form { + margin: 0; +} + .dashboard-body { min-height: 100vh; background: radial-gradient(circle at 0% 30%, rgba(59, 130, 246, 0.14), transparent 30%), @@ -397,6 +449,7 @@ body { gap: 24px; padding: 16px; background: #0b1220; + border-radius: 12px; } .controls-full { @@ -450,10 +503,13 @@ body { .overlay { position: relative; flex: 1; - min-height: 420px; - height: calc(100vh - 260px); + min-height: 520px; + height: calc(100vh - 220px); background: black; overflow: hidden; + border: 1px solid #1f2937; + border-radius: 16px; + box-shadow: 0 16px 45px rgba(0, 0, 0, 0.45); } .overlay iframe { diff --git a/src/main/resources/templates/admin.html b/src/main/resources/templates/admin.html index 19638bf..6f156fb 100644 --- a/src/main/resources/templates/admin.html +++ b/src/main/resources/templates/admin.html @@ -9,24 +9,32 @@ - +
-
-

Channel overlay controls

-
-
- -
-
-
-
- - -
-
-
-

Overlay assets

-

Upload overlay visuals and adjust them inline.

+
+
+
+
IF
+
+

Channel

+

+
+
+
+ Back to dashboard +
+ +
+
+
+
+ + +
+
+
+

Overlay assets

+

Upload overlay visuals and adjust them inline.

@@ -161,7 +169,8 @@
-
+
+