From 1a42b39d2251e4ea85a26015b211aca8d55d5399 Mon Sep 17 00:00:00 2001 From: Hayriye Saricicek Date: Mon, 30 Mar 2026 15:42:59 +0100 Subject: [PATCH 1/2] updated function and styled in html --- Sprint-3/quote-generator/index.html | 38 ++++++++++++++++++++++++++--- Sprint-3/quote-generator/quotes.js | 17 +++++++++++++ 2 files changed, 52 insertions(+), 3 deletions(-) diff --git a/Sprint-3/quote-generator/index.html b/Sprint-3/quote-generator/index.html index 30b434bcf..b596c0e75 100644 --- a/Sprint-3/quote-generator/index.html +++ b/Sprint-3/quote-generator/index.html @@ -1,13 +1,45 @@ - + - Title here + Quote Generator App + -

hello there

+

Welcome to the Quote Generator

diff --git a/Sprint-3/quote-generator/quotes.js b/Sprint-3/quote-generator/quotes.js index 4a4d04b72..bf1220def 100644 --- a/Sprint-3/quote-generator/quotes.js +++ b/Sprint-3/quote-generator/quotes.js @@ -1,3 +1,20 @@ +// DO NOT EDIT ABOVE HERE +window.addEventListener("DOMContentLoaded", () => { + const quoteElement = document.getElementById("quote"); + const authorElement = document.getElementById("author"); + const newQuoteBtn = document.getElementById("new-quote"); + + function displayRandomQuote() { + const randomQuote = pickFromArray(quotes); + quoteElement.textContent = `"${randomQuote.quote}"`; + authorElement.textContent = randomQuote.author; + } + + displayRandomQuote(); + + newQuoteBtn.addEventListener("click", displayRandomQuote); +}); + // DO NOT EDIT BELOW HERE // pickFromArray is a function which will return one item, at From e4ad56d1e1abe1ae3aefce736a0070a0486c9072 Mon Sep 17 00:00:00 2001 From: Hayriye Saricicek Date: Sun, 5 Apr 2026 23:43:23 +0100 Subject: [PATCH 2/2] moved styling from html to css --- Sprint-3/quote-generator/index.html | 33 +---------------------------- Sprint-3/quote-generator/quotes.js | 16 +++++++------- Sprint-3/quote-generator/style.css | 30 ++++++++++++++++++++++++++ 3 files changed, 39 insertions(+), 40 deletions(-) diff --git a/Sprint-3/quote-generator/index.html b/Sprint-3/quote-generator/index.html index b596c0e75..1d9f5adcd 100644 --- a/Sprint-3/quote-generator/index.html +++ b/Sprint-3/quote-generator/index.html @@ -3,39 +3,8 @@ + Quote Generator App - diff --git a/Sprint-3/quote-generator/quotes.js b/Sprint-3/quote-generator/quotes.js index bf1220def..83a55d8d1 100644 --- a/Sprint-3/quote-generator/quotes.js +++ b/Sprint-3/quote-generator/quotes.js @@ -1,18 +1,18 @@ -// DO NOT EDIT ABOVE HERE -window.addEventListener("DOMContentLoaded", () => { + window.addEventListener("DOMContentLoaded", () => { const quoteElement = document.getElementById("quote"); const authorElement = document.getElementById("author"); const newQuoteBtn = document.getElementById("new-quote"); - function displayRandomQuote() { - const randomQuote = pickFromArray(quotes); - quoteElement.textContent = `"${randomQuote.quote}"`; - authorElement.textContent = randomQuote.author; - } - displayRandomQuote(); +function displayRandomQuote() { + const randomQuote = pickFromArray(quotes); + quoteElement.textContent = `"${randomQuote.quote}"`; + authorElement.textContent = randomQuote.author; +} newQuoteBtn.addEventListener("click", displayRandomQuote); + + displayRandomQuote(); }); // DO NOT EDIT BELOW HERE diff --git a/Sprint-3/quote-generator/style.css b/Sprint-3/quote-generator/style.css index 63cedf2d2..926f18473 100644 --- a/Sprint-3/quote-generator/style.css +++ b/Sprint-3/quote-generator/style.css @@ -1 +1,31 @@ /** Write your CSS in here **/ +body { + display: grid; + place-items: center; + min-height: 100vh; + margin: 0; + font-family: Arial, sans-serif; + text-align: center; + margin-top: 40px; + background-color: aqua; +} +h1 { + font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; + color: green; +} + +#quote { + font-size: 45px; + margin-bottom: 10px; + color: purple; +} +#author { + font-size: 30px; + color: red; + margin-bottom: 10px; + font-family: Cambria, Cochin, Georgia, Times, "Times New Roman", serif; +} +#new-quote { + padding: 10px 20px; + font-size: 16px; +}