From a8a46bf97e64e143c699b649aed94d8137519b84 Mon Sep 17 00:00:00 2001
From: pliny <133052465+elder-plinius@users.noreply.github.com>
Date: Sat, 12 Aug 2023 16:48:43 -0700
Subject: [PATCH] Update popup.html

---
 popup.html | 28 ++++++++++++++++++++--------
 1 file changed, 20 insertions(+), 8 deletions(-)
diff --git a/popup.html b/popup.html
index ca7dd0b..eabd5e6 100644
--- a/popup.html
+++ b/popup.html
@@ -1,14 +1,26 @@
 <!DOCTYPE html>
-<html>
+<html lang="en">
 <head>
-  <link rel="stylesheet" type="text/css" href="styles.css">
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Binaural Beats Generator</title>
+    <style>
+        body {
+            width: 200px;
+            font-family: Arial, sans-serif;
+        }
+    </style>
 </head>
 <body>
-  <h1>Binaural Beats Generator</h1>
-  <p>Customize the frequency of the binaural beats:</p>
-  <input type="range" min="1" max="1000" value="440" class="slider" id="frequencySlider">
-  <p id="frequencyDisplay">Frequency: 440 Hz</p>
-  <button id="togglePlayPause">Play</button>
-  <script src="popup.js"></script>
+    <label for="frequencySlider">Frequency:</label>
+    <input type="range" id="frequencySlider" min="1" max="30" value="10">
+    <span id="frequencyDisplay">Frequency: 10 Hz</span>
+    <br><br>
+    <label for="volumeSlider">Volume:</label>
+    <input type="range" id="volumeSlider" min="0" max="1" step="0.01" value="0.5">
+    <span id="volumeDisplay">Volume: 50%</span>
+    <br><br>
+    <button id="togglePlayPause">Play</button>
+    <script src="popup.js"></script>
 </body>
 </html>
