initial commit

2025-06-21 18:01:38 -07:00
commit 710cafefa7
11 changed files with 749 additions and 0 deletions
--- a/options.html
+++ b/options.html
@ -0,0 +1,99 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <title>AmNP Settings (Beta)</title>
+  <style>
+    :root {
+      --accent: #F5A9B8;
+      --bg: #121212;
+      --fg: #eee;
+      --input-bg: #1e1e1e;
+      --input-border: #444;
+      --input-focus: var(--accent);
+      --button-bg: var(--accent);
+      --button-hover: #d67b8a;
+      --shadow: rgba(245, 169, 184, 0.3);
+    }
+    body {
+      margin: 0;
+      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
+      background-color: var(--bg);
+      color: var(--fg);
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      height: 100vh;
+      padding: 1rem;
+    }
+    .container {
+      background-color: #1c1c1c;
+      padding: 2rem;
+      border-radius: 12px;
+      max-width: 500px;
+      width: 100%;
+    }
+    h1 {
+      margin-top: 0;
+      font-weight: 700;
+      font-size: 1.8rem;
+      color: var(--accent);
+      text-align: center;
+    }
+    label {
+      display: block;
+      margin-top: 1.5rem;
+      font-weight: 600;
+      font-size: 1rem;
+      color: var(--fg);
+    }
+    input[type="text"] {
+      width: 100%;
+      padding: 0.6rem 0.8rem;
+      font-size: 1rem;
+      margin-top: 0.3rem;
+      border: 1.5px solid var(--input-border);
+      border-radius: 8px;
+      background-color: var(--input-bg);
+      color: var(--fg);
+      transition: border-color 0.3s ease;
+    }
+    input[type="text"]::placeholder {
+      color: #888;
+    }
+    input[type="text"]:focus {
+      outline: none;
+      border-color: var(--input-focus);
+    }
+    button {
+      margin-top: 2rem;
+      width: 100%;
+      padding: 0.75rem;
+      font-size: 1.1rem;
+      font-weight: 700;
+      border: none;
+      border-radius: 10px;
+      background-color: var(--button-bg);
+      color: #fff;
+      cursor: pointer;
+      transition: background-color 0.3s ease;
+    }
+    button:hover,
+    button:focus {
+      background-color: var(--button-hover);
+      outline: none;
+    }
+  </style>
+</head>
+<body>
+  <div class="container">
+    <h1><span title="Apple Music Now Playing">AmNP</span> Settings (Beta)</h1>
+    <label for="endpoint">POST Endpoint:</label>
+    <input type="text" id="endpoint" placeholder="https://zorpzeep.blorp/wp-json/nowplaying/v1/update" autocomplete="off" spellcheck="false"/>
+    <label for="token">Bearer Token:</label>
+    <input type="text" id="token" placeholder="73757065725f7365637572655f746f6b656e" autocomplete="off" spellcheck="false"/>
+    <button id="save">Save</button>
+  </div>
+  <script src="options.js"></script>
+</body>
+</html>