From 0dc063bbae19dec432903c060d4106f4d1ce24a7 Mon Sep 17 00:00:00 2001 From: "bob.rao" Date: Fri, 21 Apr 2023 13:28:52 +0800 Subject: [PATCH] beatify the page --- popup.css | 64 ++++++++++++++++++++++++++++++++++++++++++++++++++---- popup.html | 14 +++++++++--- popup.js | 6 ++++- 3 files changed, 76 insertions(+), 8 deletions(-) diff --git a/popup.css b/popup.css index e113b42..c35d74d 100644 --- a/popup.css +++ b/popup.css @@ -2,13 +2,69 @@ body { width: 200px; padding: 15px; font-family: Arial, sans-serif; + display: flex; + flex-direction: column; + align-items: center; +} + +.header { + margin-bottom: 10px; + width: 100%; + border-bottom: 1px solid #ccc; + padding-bottom: 10px; +} + +.header h1 { + font-size: 16px; + font-weight: bold; + text-align: center; + margin: 0; +} + +.buttons-row { + display: flex; + justify-content: space-between; + width: 100%; + margin-bottom: 10px; } button { - display: block; - margin-bottom: 10px; - width: 100%; - padding: 5px; + padding: 8px 12px; font-size: 14px; cursor: pointer; + background-color: #1ABC9C; + color: white; + border: 1px solid #16A085; + border-radius: 6px; + text-align: center; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); + transition-duration: 0.4s; +} + +button:hover { + background-color: #16A085; + border-color: #14967F; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); +} + +button#bulk-delete { + width: 100%; + font-size: 16px; + background-color: #e74c3c; + border-color: #c0392b; + margin-top: 10px; +} + +button#bulk-delete:hover { + background-color: #c0392b; + border-color: #a93226; +} + +.footer { + margin-top: 10px; + width: 100%; + font-size: 12px; + text-align: center; + border-top: 1px solid #ccc; + padding-top: 10px; } diff --git a/popup.html b/popup.html index 7c9f99e..77e363a 100644 --- a/popup.html +++ b/popup.html @@ -7,9 +7,17 @@ - - - +
+

bulk-delete-chatGPT

+
+
+ + +
+ +
+ +
diff --git a/popup.js b/popup.js index c44a226..d309b4d 100644 --- a/popup.js +++ b/popup.js @@ -8,4 +8,8 @@ document.getElementById('bulk-delete').addEventListener('click', () => { document.getElementById('remove-checkboxes').addEventListener('click', () => { chrome.tabs.executeScript({ file: 'removeCheckboxes.js' }); -}); \ No newline at end of file +}); + +// Update copyright year +const currentYear = new Date().getFullYear(); +document.getElementById('copyright').innerHTML = '© ' + currentYear + ' @qcrao';