From c2721f87135d8a66a5bd68f7d612bbff41a6a799 Mon Sep 17 00:00:00 2001 From: Matthias Blankertz Date: Tue, 16 Dec 2025 22:58:39 +0100 Subject: [PATCH] feat: frontend: list of playlists screen, playlist screen, add tracks screen Signed-off-by: Matthias Blankertz --- software/frontend/index.html | 955 +++++++++++++++++++++++++++++------ 1 file changed, 800 insertions(+), 155 deletions(-) diff --git a/software/frontend/index.html b/software/frontend/index.html index 48d6548..39681e9 100644 --- a/software/frontend/index.html +++ b/software/frontend/index.html @@ -45,6 +45,92 @@ padding-left: 10px; margin-top: 10px; } + + /* Tree view */ + .tree ul { + list-style: none; + padding-left: 1rem; + } + + .tree li { + margin: 2px 0; + } + + .caret { + cursor: pointer; + display: inline-block; + width: 1em; + height: 1em; + user-select: none; + } + + .caret::before { + content: "▶"; + opacity: 0.6; + } + + li.expanded > .caret::before { + content: "▼"; + } + + li:not(:has(ul)) > .caret::before { + content: ""; + } + + .node { + cursor: pointer; + padding: 2px 6px; + border-radius: 4px; + user-select: none; + } + + .node:hover { + background: #eee; + } + + .node.selected { + background: #0078d7; + color: white; + } + + .tree ul ul { + display: none; + } + + li.expanded > ul { + display: block; + } + + .scroll-container { + border: 1px solid #ccc; + border-radius: 4px; + + height: 500px; + overflow-y: auto; + overflow-x: hidden; + } + + .flex-horizontal { + display:flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + gap: 10px; + margin-bottom: 10px; + } + + .flex-vertical { + display:flex; + flex-direction: column; + justify-content: space-between; + align-items: center; + gap: 10px; + } + + .list { + list-style: none; + } + @@ -54,6 +140,7 @@ @@ -63,6 +150,7 @@ @@ -71,178 +159,735 @@

Configuration Editor

Loading…
- +
+ +
+

Playlist Editor

+
+
+ +
+ + + +
+
+
+
+ +
+
    +
  • Loading...
    • +
+
+
+ + + +
+
+
+
+ + +
+

Playlist Editor

+
+
+
+ + +
+
+
+ +
+
    +
  • Loading...
    • +
+
+
+
+ + +
+
+
+ + + +
+
+
+
+ + +
+

Playlist Editor

+
+
+
+
  • Loading...
+ +
+
+
+ + +
+
+
+