From f12317a9f216558ee879cc6cafbc755fcc7dc8ad Mon Sep 17 00:00:00 2001
From: Pinapelz <yukais@pinapelz.com>
Date: Tue, 20 May 2025 01:38:47 -0700
Subject: adjust popup CSS for consistency

---
 icons/icon.png    | Bin 1086005 -> 0 bytes
 icons/icon128.png | Bin 0 -> 30911 bytes
 icons/icon16.png  | Bin 0 -> 813 bytes
 icons/icon32.png  | Bin 0 -> 2439 bytes
 icons/icon48.png  | Bin 0 -> 5107 bytes
 manifest.json     |  10 ++++++---
 popup.html        |  59 ++++++++++++++++++++++++++++++++----------------------
 7 files changed, 42 insertions(+), 27 deletions(-)
 delete mode 100644 icons/icon.png
 create mode 100644 icons/icon128.png
 create mode 100644 icons/icon16.png
 create mode 100644 icons/icon32.png
 create mode 100644 icons/icon48.png

diff --git a/icons/icon.png b/icons/icon.png
deleted file mode 100644
index 3738246..0000000
Binary files a/icons/icon.png and /dev/null differ
diff --git a/icons/icon128.png b/icons/icon128.png
new file mode 100644
index 0000000..ffc599c
Binary files /dev/null and b/icons/icon128.png differ
diff --git a/icons/icon16.png b/icons/icon16.png
new file mode 100644
index 0000000..2c7ae36
Binary files /dev/null and b/icons/icon16.png differ
diff --git a/icons/icon32.png b/icons/icon32.png
new file mode 100644
index 0000000..1de25f4
Binary files /dev/null and b/icons/icon32.png differ
diff --git a/icons/icon48.png b/icons/icon48.png
new file mode 100644
index 0000000..265e22c
Binary files /dev/null and b/icons/icon48.png differ
diff --git a/manifest.json b/manifest.json
index eba16de..1ac1a2d 100644
--- a/manifest.json
+++ b/manifest.json
@@ -5,17 +5,21 @@
   "description": "A tool for generating timestamps on YouTube videos or livestreams",
   "browser_specific_settings": {
     "gecko": {
-      "id": "ytquickstamper@pinapelz.com"
+      "id": "yt-quickstamper@pinapelz.com"
     }
   },
   "permissions": ["activeTab", "scripting", "clipboardWrite", "storage"],
   "icons": {
-    "48": "icons/icon.png"
+    "16": "icons/icon16.png",
+    "32": "icons/icon32.png",
+    "48": "icons/icon48.png",
+    "128": "icons/icon128.png"
   },
+
   "action": {
     "default_popup": "popup.html",
     "default_icon": {
-      "48": "icons/icon.png"
+      "48": "icons/icon48.png"
     }
   },
   "web_accessible_resources": [
diff --git a/popup.html b/popup.html
index 58560f7..84b951f 100644
--- a/popup.html
+++ b/popup.html
@@ -5,52 +5,63 @@
     <title>YTQuickStamper</title>
     <style>
         body {
-            font-family: Arial, sans-serif;
+            font-family: 'Roboto', sans-serif;
             padding: 20px;
-            max-width: 350px;
-            background-color: #181818;
-            color: #f1f1f1;
+            max-width: 400px;
+            background-color: #202020;
+            color: #e0e0e0;
+            line-height: 1.6;
         }
         h3 {
             text-align: center;
-            color: #FF0000;
+            color: #FF5722;
+            font-size: 1.8rem;
+            margin-bottom: 20px;
         }
         button {
-            padding: 10px;
-            background-color: #FF0000;
-            color: white;
+            padding: 12px 20px;
+            background-color: #FF5722;
+            color: #ffffff;
             border: none;
-            border-radius: 4px;
+            border-radius: 6px;
             cursor: pointer;
             font-size: 1rem;
-            transition: background-color 0.3s;
+            font-weight: bold;
+            transition: background-color 0.3s, transform 0.2s;
+            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
         }
         button:hover {
-            background-color: #CC0000;
+            background-color: #E64A19;
+            transform: translateY(-2px);
+            box-shadow: 0 6px 8px rgba(0, 0, 0, 0.3);
         }
         #offset {
-            padding: 8px;
-            border: 2px solid #FF0000;
-            border-radius: 4px;
-            width: 60px;
+            padding: 10px;
+            border: 2px solid #FF5722;
+            border-radius: 6px;
+            width: 80px;
             font-size: 1rem;
-            background-color: #333;
-            color: #f1f1f1;
+            background-color: #2c2c2c;
+            color: #ffffff;
+            text-align: center;
         }
         label {
-            margin-top: 2rem;
+            margin-top: 1.5rem;
             font-size: 1rem;
-            color: #f1f1f1;
+            color: #e0e0e0;
+            display: block;
+            margin-bottom: 8px;
         }
         .offset-container {
             display: flex;
             align-items: center;
             justify-content: space-between;
             margin-top: 20px;
-            padding: 10px;
-            background-color: #282828;
-            border: 1px solid #444;
-            border-radius: 6px;
+            padding: 12px;
+            background-color: #2a2a2a;
+            border: 1px solid #555;
+            border-radius: 8px;
+            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
         }
     </style>
 </head>
@@ -58,7 +69,7 @@
     <h3>QuickStamper</h3>
     <button id="activate">Launch Timestamp Tool</button>
     <div>
-        <label for="offset">Offset (sec):</label>
+        <label for="offset">-Offset (sec):</label>
         <input type="number"
             id="offset"
             title="Offset each timestamp by this many seconds, ex. 3 = 3s before each timestamp, -3 = 3s after each timestamp"
-- 
cgit v1.2.3