From 70b8e5e7ac4b1f802393b4e57bbed5f291907219 Mon Sep 17 00:00:00 2001 From: russom Date: Tue, 18 Aug 2026 21:48:45 +0100 Subject: [PATCH] Quote generator: only include Sprint-3/quote-generator changes --- Sprint-3/quote-generator/index.html | 5 +++-- Sprint-3/quote-generator/quotes.js | 24 ++++++++++++++++++++++++ Sprint-3/quote-generator/style.css | 27 +++++++++++++++++++++++++++ 3 files changed, 54 insertions(+), 2 deletions(-) diff --git a/Sprint-3/quote-generator/index.html b/Sprint-3/quote-generator/index.html index 30b434bcf..e1b96f50c 100644 --- a/Sprint-3/quote-generator/index.html +++ b/Sprint-3/quote-generator/index.html @@ -3,11 +3,12 @@ - Title here + Quote generator app" + -

hello there

+

Welcome

diff --git a/Sprint-3/quote-generator/quotes.js b/Sprint-3/quote-generator/quotes.js index 4a4d04b72..bc019ca24 100644 --- a/Sprint-3/quote-generator/quotes.js +++ b/Sprint-3/quote-generator/quotes.js @@ -16,6 +16,7 @@ // pickFromArray(['a','b','c','d']) // maybe returns 'c' // You don't need to change this function + function pickFromArray(choices) { return choices[Math.floor(Math.random() * choices.length)]; } @@ -490,4 +491,27 @@ const quotes = [ }, ]; +//console.log(pickFromArray(quotes)); // call pickFromArray with the quotes array to check you get a random quote + +//When the page loads it should show a random quote from the `quotes` array on the screen. It should also show who said the quote. + +//When you click a button on the screen it should change the quote on the screen. + +const button = document.querySelector("#new-quote"); +const quoteText = document.querySelector("#quote"); +const quoteAuthor = document.querySelector("#author"); + +function showRandomQuote() { + const randomQuote = pickFromArray(quotes); + quoteText.textContent = randomQuote.quote; + quoteAuthor.textContent = randomQuote.author; +} + +showRandomQuote(); + +button.addEventListener("click", showRandomQuote); + +//function pickFromArray(choices) { +// return choices[Math.floor(Math.random() * choices.length)]; +//} \ No newline at end of file diff --git a/Sprint-3/quote-generator/style.css b/Sprint-3/quote-generator/style.css index 63cedf2d2..6c92827a5 100644 --- a/Sprint-3/quote-generator/style.css +++ b/Sprint-3/quote-generator/style.css @@ -1 +1,28 @@ /** Write your CSS in here **/ + +body { + color: rgb(48, 46, 46); + background-color: rgb(238, 235, 235); + font-family: Arial, sans-serif; + margin: 0; + padding: 20px; +} + +h1 { + text-align: center; + font-size: 2.5rem; + color: ; +} + +p { + font-size: 1rem; + color: ; +} + +button { + background-color: rgb(221, 235, 116); + color: rgb(131, 95, 29); + border: none; + padding: 10px; + border-radius: 5px; +}