From 8af82a3d22cb17ad51a3c32a1d455c5740603898 Mon Sep 17 00:00:00 2001 From: Brendan <94894839+abrendan@users.noreply.github.com> Date: Sun, 5 Jan 2025 22:23:30 +0000 Subject: [PATCH] Added a reset filter button and cleaned the design a little bit more --- index.html | 3 ++- script.js | 11 +++++++++++ style.css | 11 +++++++++-- 3 files changed, 22 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index 127c6b1..cc6971c 100644 --- a/index.html +++ b/index.html @@ -9,7 +9,7 @@ -
+
@@ -50,6 +50,7 @@
+
diff --git a/script.js b/script.js index a50d055..c4edf5e 100644 --- a/script.js +++ b/script.js @@ -15,6 +15,17 @@ document.getElementById('searchButton').addEventListener('click', function() { fetchNewsArticles(); }); +document.getElementById('resetButton').addEventListener('click', function() { + document.getElementById('searchInput').value = ''; + document.getElementById('topicSelect').value = ''; + document.getElementById('apiSelect').value = 'currents'; + document.getElementById('sourceSelect').value = ''; + document.getElementById('languageSelect').value = ''; + document.getElementById('countrySelect').value = ''; + configureDropdowns(); + fetchNewsArticles(); +}); + function fetchTopics() { const url = `https://api.currentsapi.services/v1/available/categories?apiKey=${apiKeyCurrents}`; diff --git a/style.css b/style.css index cd46ad9..63f83ba 100644 --- a/style.css +++ b/style.css @@ -1,4 +1,3 @@ - :root { --bg-dark: #202020; --card-dark: #2d2d2d; @@ -39,6 +38,9 @@ body { border-radius: var(--border-radius); padding: 0.75rem; transition: all 0.2s ease; + height: 48px; + line-height: 24px; + text-align: left; } .form-control:focus { @@ -52,6 +54,11 @@ body { border-radius: var(--border-radius); padding: 0.75rem 1.5rem; transition: transform 0.2s, background-color 0.2s; + height: 48px; + width: 100%; + display: flex; + align-items: center; + justify-content: center; } .btn:active { @@ -232,4 +239,4 @@ body { .container { padding: 0.5rem; } -} +} \ No newline at end of file