idontcalculate · October 29, 2024 21:30
diff --git a/popup.html b/popup.html
 <!DOCTYPE html>
 <html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>Hyperfocus</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      width: 200px;
      padding: 10px;
    }
    .control {
      margin-bottom: 10px;
    }
    label {
      display: block;
      font-size: 14px;
      margin-bottom: 5px;
    }
    button {
      padding: 5px;
      font-size: 14px;
      width: 100%;
    }
  </style>
 </head>
 <body>
  <h2>Hyperfocus Settings</h2>

  <!-- Font Size Control -->
  <div class="control">
    <label for="font-size">Font Size:</label>
    <input type="range" id="font-size" min="12" max="24" value="16">
  </div>

  <!-- Background Color Control -->
  <div class="control">
    <label for="bg-color">Background Color:</label>
    <input type="color" id="bg-color" value="#ffffff">
  </div>

  <!-- Summarize Button -->
  <div class="control">
    <button id="summarize-btn">Summarize Page</button>
  </div>

  <script src="popup.js"></script>
 </body>
 </html>