From eabec44490be29f59479da5cedce66ed8e5ffef1 Mon Sep 17 00:00:00 2001
From: iou1name <iou1name@national.shitposting.agency>
Date: Wed, 8 Jan 2025 12:41:45 -0500
Subject: [PATCH] add settings ui

---
 static/pyrite.css    | 12 ++++++++++++
 templates/index.html | 15 +++++++++++++++
 2 files changed, 27 insertions(+)

diff --git a/static/pyrite.css b/static/pyrite.css
index a0917fb..ba9d6d0 100644
--- a/static/pyrite.css
+++ b/static/pyrite.css
@@ -79,6 +79,18 @@ input[type="radio"]:checked+div {
 		"L D D R";
 }
 
+#settings {
+	grid-area: L;
+	display: flex;
+	flex-direction: column;
+	gap: 0.5em;
+	padding: 1em;
+}
+
+#settings select {
+	width: 100%;
+}
+
 #cover_art {
 	grid-area: A;
 	padding-right: 1em;
diff --git a/templates/index.html b/templates/index.html
index b3ebb97..ee17827 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -27,6 +27,21 @@
 			<div id="track_list" class="list">
 			</div>
 			<div id="player_container">
+				<div id="settings">
+					<div>
+						<label for="playlist-select">Playlist:</label>
+						<select id="playlist-select">
+							<option>All Tracks</option>
+						</select>
+					</div>
+					<div>
+						<label for="visualizer-select">Visualizer:</label>
+						<select id="visualizer-select">
+							<option value="disabled" selected>Disabled</option>
+							<option value="bar_graph">Bar Graph</option>
+						</select>
+					</div>
+				</div>
 				<div id="cover_art"><img alt="Album cover art" src="./static/pyrite.jpg"></div>
 				<div id="title">
 					<h4><span id="now_playing_artist">Artist</span> - <span id="now_playing_album">Album</span></h4>