From e1b30060cd589aa56b5e7f57a76adb9d4c7d3a6c Mon Sep 17 00:00:00 2001 From: Seti Mussa Date: Mon, 13 Apr 2026 16:09:36 +0100 Subject: [PATCH 1/4] Changed the title and header inside the index html --- Sprint-3/quote-generator/index.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/Sprint-3/quote-generator/index.html b/Sprint-3/quote-generator/index.html index 30b434bcf..83f633e7d 100644 --- a/Sprint-3/quote-generator/index.html +++ b/Sprint-3/quote-generator/index.html @@ -3,11 +3,11 @@ - Title here + Quote Generator app -

hello there

+

Quote Generator app

From f2dd47777ee37e5e14ba62f7969dd1d879298e95 Mon Sep 17 00:00:00 2001 From: Seti Mussa Date: Mon, 13 Apr 2026 17:15:21 +0100 Subject: [PATCH 2/4] Add random quote generator --- Sprint-3/quote-generator/package.json | 7 +++++- Sprint-3/quote-generator/quotes.js | 18 ++++++++++++++ Sprint-3/quote-generator/style.css | 35 +++++++++++++++++++++++++++ 3 files changed, 59 insertions(+), 1 deletion(-) diff --git a/Sprint-3/quote-generator/package.json b/Sprint-3/quote-generator/package.json index 0f6f98917..ea64c4035 100644 --- a/Sprint-3/quote-generator/package.json +++ b/Sprint-3/quote-generator/package.json @@ -13,5 +13,10 @@ "bugs": { "url": "https://github.com/CodeYourFuture/CYF-Coursework-Template/issues" }, - "homepage": "https://github.com/CodeYourFuture/CYF-Coursework-Template#readme" + "homepage": "https://github.com/CodeYourFuture/CYF-Coursework-Template#readme", + "devDependencies": { + "@testing-library/jest-dom": "^6.9.1", + "jest": "^30.3.0", + "jest-environment-jsdom": "^30.3.0" + } } diff --git a/Sprint-3/quote-generator/quotes.js b/Sprint-3/quote-generator/quotes.js index 4a4d04b72..5784e945d 100644 --- a/Sprint-3/quote-generator/quotes.js +++ b/Sprint-3/quote-generator/quotes.js @@ -491,3 +491,21 @@ const quotes = [ ]; // call pickFromArray with the quotes array to check you get a random quote + +const quoteElement = document.getElementById("quote"); +const authorElement = document.getElementById("author"); + +function displayQuote() { + const randomQuote = pickFromArray(quotes); + + quoteElement.textContent = randomQuote.quote; + authorElement.textContent = randomQuote.author; +} + +// Show a quote when page loads +displayQuote(); + +// Change quote when button is clicked +document + .getElementById("new-quote") + .addEventListener("click", displayQuote); \ No newline at end of file diff --git a/Sprint-3/quote-generator/style.css b/Sprint-3/quote-generator/style.css index 63cedf2d2..8d2dac628 100644 --- a/Sprint-3/quote-generator/style.css +++ b/Sprint-3/quote-generator/style.css @@ -1 +1,36 @@ /** Write your CSS in here **/ +body { + font-family: Arial, sans-serif; + text-align: center; + margin-top: 50px; + background-color: #f5f5f5; +} + +h1 { + color: #333; +} + +#quote { + font-size: 24px; + margin: 20px; + font-style: italic; +} + +#author { + font-size: 18px; + color: #666; +} + +button { + padding: 10px 20px; + font-size: 16px; + cursor: pointer; + border: none; + background-color: #333; + color: white; + border-radius: 5px; +} + +button:hover { + background-color: #555; +} \ No newline at end of file From 46724ecf9d5456079808855bc807d60c32b99fd6 Mon Sep 17 00:00:00 2001 From: Seti Mussa Date: Thu, 16 Apr 2026 18:56:00 +0100 Subject: [PATCH 3/4] Add setup function foe page load --- Sprint-3/quote-generator/quotes.js | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/Sprint-3/quote-generator/quotes.js b/Sprint-3/quote-generator/quotes.js index 5784e945d..b0e5333d9 100644 --- a/Sprint-3/quote-generator/quotes.js +++ b/Sprint-3/quote-generator/quotes.js @@ -492,9 +492,13 @@ const quotes = [ // call pickFromArray with the quotes array to check you get a random quote -const quoteElement = document.getElementById("quote"); +// this runs when the page loads + +function setup() { + const quoteElement = document.getElementById("quote"); const authorElement = document.getElementById("author"); + function displayQuote() { const randomQuote = pickFromArray(quotes); @@ -508,4 +512,8 @@ displayQuote(); // Change quote when button is clicked document .getElementById("new-quote") - .addEventListener("click", displayQuote); \ No newline at end of file + .addEventListener("click", displayQuote); +} + +// run setup after page loads +window.addEventListener("load",setup); \ No newline at end of file From 38d1417613bf5b2f0a2cd91870307873967bdc28 Mon Sep 17 00:00:00 2001 From: Seti Mussa Date: Thu, 16 Apr 2026 20:20:23 +0100 Subject: [PATCH 4/4] Fix indenation and the formatting --- Sprint-3/quote-generator/quotes.js | 25 +++++++++++-------------- 1 file changed, 11 insertions(+), 14 deletions(-) diff --git a/Sprint-3/quote-generator/quotes.js b/Sprint-3/quote-generator/quotes.js index b0e5333d9..a9641f4c6 100644 --- a/Sprint-3/quote-generator/quotes.js +++ b/Sprint-3/quote-generator/quotes.js @@ -496,24 +496,21 @@ const quotes = [ function setup() { const quoteElement = document.getElementById("quote"); -const authorElement = document.getElementById("author"); + const authorElement = document.getElementById("author"); + function displayQuote() { + const randomQuote = pickFromArray(quotes); -function displayQuote() { - const randomQuote = pickFromArray(quotes); + quoteElement.textContent = randomQuote.quote; + authorElement.textContent = randomQuote.author; + } - quoteElement.textContent = randomQuote.quote; - authorElement.textContent = randomQuote.author; -} - -// Show a quote when page loads -displayQuote(); + // Show a quote when page loads + displayQuote(); -// Change quote when button is clicked -document - .getElementById("new-quote") - .addEventListener("click", displayQuote); + // Change quote when button is clicked + document.getElementById("new-quote").addEventListener("click", displayQuote); } // run setup after page loads -window.addEventListener("load",setup); \ No newline at end of file +window.addEventListener("load", setup);