From 2314c3c3fa1c42dff22453bcc8e8bd2e569de4cb Mon Sep 17 00:00:00 2001 From: Mohammed Abdoon Date: Sat, 15 Nov 2025 16:07:13 +0000 Subject: [PATCH 1/2] Quote generator exercise done --- .../quote-generator/Quote_generator_app.html | 18 ++++++++ Sprint-3/quote-generator/index.html | 15 ------- Sprint-3/quote-generator/quotes.js | 19 +++++++++ Sprint-3/quote-generator/style.css | 42 +++++++++++++++++++ 4 files changed, 79 insertions(+), 15 deletions(-) create mode 100644 Sprint-3/quote-generator/Quote_generator_app.html delete mode 100644 Sprint-3/quote-generator/index.html diff --git a/Sprint-3/quote-generator/Quote_generator_app.html b/Sprint-3/quote-generator/Quote_generator_app.html new file mode 100644 index 000000000..ec39ba726 --- /dev/null +++ b/Sprint-3/quote-generator/Quote_generator_app.html @@ -0,0 +1,18 @@ + + + + + + Quotes Generator + + + + +
+

+

+ +
+ + + diff --git a/Sprint-3/quote-generator/index.html b/Sprint-3/quote-generator/index.html deleted file mode 100644 index 30b434bcf..000000000 --- a/Sprint-3/quote-generator/index.html +++ /dev/null @@ -1,15 +0,0 @@ - - - - - - Title here - - - -

hello there

-

-

- - - diff --git a/Sprint-3/quote-generator/quotes.js b/Sprint-3/quote-generator/quotes.js index 4a4d04b72..0cbd405bb 100644 --- a/Sprint-3/quote-generator/quotes.js +++ b/Sprint-3/quote-generator/quotes.js @@ -1,3 +1,22 @@ +function setup() { + const quoteButton = document.getElementById("new-quote"); + const quoteText = document.getElementById("quote"); + const authorText = document.getElementById("author"); + + function showRandomQuote() { + const randomQuote = pickFromArray(quotes); + quoteText["textContent"] = `“${randomQuote.quote}”`; + authorText["textContent"] = `- ${randomQuote.author}`; + } + + quoteButton.addEventListener("click", showRandomQuote); + + showRandomQuote(); +} + +window.onload = setup; + + // DO NOT EDIT BELOW HERE // pickFromArray is a function which will return one item, at diff --git a/Sprint-3/quote-generator/style.css b/Sprint-3/quote-generator/style.css index 63cedf2d2..f19f8fbb1 100644 --- a/Sprint-3/quote-generator/style.css +++ b/Sprint-3/quote-generator/style.css @@ -1 +1,43 @@ /** Write your CSS in here **/ +body { + font-family: Arial, sans-serif; + background-color: #605f5f; + margin: 0; + padding: 20px; +} +h1 { + color: #4DD0E1; + text-align: center; +} + +#quote-box { + background-color: #222121; + border-radius: 10px; + padding: 20px; + max-width: 600px; + margin: 20px auto; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); + height: 250px; + position: relative; +} +#quote { + font-size: 24px; + color: #ffffff; +} +#author { + font-size: 20px; + color: #cccccc; + text-align: right; +} +#new-quote { + background-color: #4DD0E1; + color: #000000; + border: none; + padding: 10px 20px; + font-size: 16px; + border-radius: 5px; + cursor: pointer; + position: absolute; + bottom: 20px; + left: 20px; +} \ No newline at end of file From a63b2c8f88bd4522e0fb515f60ef1eb52e2ab5aa Mon Sep 17 00:00:00 2001 From: Mohammed Abdoon Date: Sun, 23 Nov 2025 15:11:49 +0000 Subject: [PATCH 2/2] yodated quotes.js --- Sprint-3/quote-generator/quotes.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/Sprint-3/quote-generator/quotes.js b/Sprint-3/quote-generator/quotes.js index 0cbd405bb..7bf071945 100644 --- a/Sprint-3/quote-generator/quotes.js +++ b/Sprint-3/quote-generator/quotes.js @@ -5,8 +5,8 @@ function setup() { function showRandomQuote() { const randomQuote = pickFromArray(quotes); - quoteText["textContent"] = `“${randomQuote.quote}”`; - authorText["textContent"] = `- ${randomQuote.author}`; + quoteText.textContent = `“${randomQuote.quote}”`; + authorText.textContent = `- ${randomQuote.author}`; } quoteButton.addEventListener("click", showRandomQuote); @@ -14,7 +14,7 @@ function setup() { showRandomQuote(); } -window.onload = setup; +document.addEventListener("DOMContentLoaded", setup); // DO NOT EDIT BELOW HERE