From a7b1d2a76ffee2d04362c68d9a854f3d9d35b93e Mon Sep 17 00:00:00 2001 From: TTiamiyu Date: Tue, 28 Jul 2026 02:16:33 +0100 Subject: [PATCH 1/2] Refactor index.html for improved structure and styling --- Sprint-3/quote-generator/index.html | 35 ++++++++++++++++++----------- 1 file changed, 22 insertions(+), 13 deletions(-) diff --git a/Sprint-3/quote-generator/index.html b/Sprint-3/quote-generator/index.html index 30b434bcf..6265a2e5c 100644 --- a/Sprint-3/quote-generator/index.html +++ b/Sprint-3/quote-generator/index.html @@ -1,15 +1,24 @@ - - - - Title here - - - -

hello there

-

-

- - - + + + + + Quote generator app + + + + +
+
+

+

+
+ +
+ + + + + + \ No newline at end of file From 49672001866383ca9302acff143b71677b28dd71 Mon Sep 17 00:00:00 2001 From: TTiamiyu Date: Tue, 28 Jul 2026 02:18:26 +0100 Subject: [PATCH 2/2] Add displayNewQuote function to show random quotes and update HTML --- Sprint-3/quote-generator/quotes.js | 22 ++++++++++++++++++++++ 1 file changed, 22 insertions(+) diff --git a/Sprint-3/quote-generator/quotes.js b/Sprint-3/quote-generator/quotes.js index 4a4d04b72..50e0d0c35 100644 --- a/Sprint-3/quote-generator/quotes.js +++ b/Sprint-3/quote-generator/quotes.js @@ -491,3 +491,25 @@ const quotes = [ ]; // call pickFromArray with the quotes array to check you get a random quote + +// Function to select a random quote and update the HTML elements +function displayNewQuote() { + const quoteP = document.querySelector("#quote"); + const authorP = document.querySelector("#author"); + + // Get a random quote object from the quotes array + const randomQuote = pickFromArray(quotes); + + // Update the DOM element contents + quoteP.textContent = randomQuote.quote; + authorP.textContent = randomQuote.author; +} + +// 1. Display a random quote when the page initially loads +displayNewQuote(); + +// 2. Add a click event listener to the "New quote" button +const newQuoteBtn = document.querySelector("#new-quote"); +if (newQuoteBtn) { + newQuoteBtn.addEventListener("click", displayNewQuote); +}