From f55cbf8e4acef7627287ed1e2505bd784b46191b Mon Sep 17 00:00:00 2001 From: Ales-Os-Dev_Lab Date: Sat, 14 Mar 2026 14:17:41 +0000 Subject: [PATCH 1/6] Changed the title to Alarm Clock App --- Sprint-3/alarmclock/index.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/Sprint-3/alarmclock/index.html b/Sprint-3/alarmclock/index.html index 48e2e80d9..18a51fc66 100644 --- a/Sprint-3/alarmclock/index.html +++ b/Sprint-3/alarmclock/index.html @@ -1,10 +1,10 @@ - + - Title here + Alarm Clock App
From 333486d8f4160f84b421ab52a63fadb426e7dca1 Mon Sep 17 00:00:00 2001 From: Ales-Os-Dev_Lab Date: Sat, 14 Mar 2026 14:18:59 +0000 Subject: [PATCH 2/6] Revert title to default in index.html --- Sprint-3/alarmclock/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Sprint-3/alarmclock/index.html b/Sprint-3/alarmclock/index.html index 18a51fc66..f16f1bd6c 100644 --- a/Sprint-3/alarmclock/index.html +++ b/Sprint-3/alarmclock/index.html @@ -4,7 +4,7 @@ - Alarm Clock App + Title here
From 7c63ba6b763988a63c818d4cef7ea8d46cab7483 Mon Sep 17 00:00:00 2001 From: Ales-Os-Dev_Lab Date: Fri, 3 Apr 2026 10:36:09 +0100 Subject: [PATCH 3/6] Refactor index.html structure and update title to 'Quote Generator' --- Sprint-3/quote-generator/index.html | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/Sprint-3/quote-generator/index.html b/Sprint-3/quote-generator/index.html index 30b434bcf..fd78748da 100644 --- a/Sprint-3/quote-generator/index.html +++ b/Sprint-3/quote-generator/index.html @@ -1,15 +1,18 @@ - + - Title here + Quote Generator + -

hello there

-

-

- +
+

Quote Generator

+

+

+ +
From 6c81be1ebb9a3568aceac6c33c0920f86d177740 Mon Sep 17 00:00:00 2001 From: Ales-Os-Dev_Lab Date: Sat, 4 Apr 2026 17:17:23 +0100 Subject: [PATCH 4/6] Add initial CSS styles for layout and design --- Sprint-3/quote-generator/style.css | 71 +++++++++++++++++++++++++++++- 1 file changed, 70 insertions(+), 1 deletion(-) diff --git a/Sprint-3/quote-generator/style.css b/Sprint-3/quote-generator/style.css index 63cedf2d2..71f7752b3 100644 --- a/Sprint-3/quote-generator/style.css +++ b/Sprint-3/quote-generator/style.css @@ -1 +1,70 @@ -/** Write your CSS in here **/ +/* Reset basic margins and set font */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; +} + +/* Center content on the screen and give it a background color */ +body { + display: flex; + justify-content: center; + align-items: center; + min-height: 100vh; + background-color: #f4f4f9; + color: #333; +} + +/* Style the main container to look like a card */ +.container { + background-color: white; + padding: 40px; + border-radius: 12px; + box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); + max-width: 500px; + text-align: center; + margin: 20px; +} + +/* Style the heading */ +h1 { + font-size: 1.5rem; + color: #555; + margin-bottom: 20px; + text-transform: uppercase; + letter-spacing: 2px; +} + +/* Style the quote text */ +#quote { + font-size: 1.25rem; + font-style: italic; + margin-bottom: 15px; + line-height: 1.5; +} + +/* Style the author text */ +#author { + font-size: 1rem; + color: #777; + font-weight: bold; + margin-bottom: 30px; +} + +/* Make the button look clickable */ +#new-quote { + background-color: #007bff; + color: white; + border: none; + padding: 12px 24px; + font-size: 1rem; + border-radius: 6px; + cursor: pointer; + transition: background-color 0.3s ease; +} + +/* Hover effect to button */ +#new-quote:hover { + background-color: #0056b3; +} From c1c30f3d1ae90d29cf6ef8d78ada395ffdff7869 Mon Sep 17 00:00:00 2001 From: Ales-Os-Dev_Lab Date: Sun, 5 Apr 2026 10:32:39 +0100 Subject: [PATCH 5/6] Implement displayRandomQuote function and initialize quote display on page load --- Sprint-3/quote-generator/quotes.js | 28 ++++++++++++++++++++++++++++ 1 file changed, 28 insertions(+) diff --git a/Sprint-3/quote-generator/quotes.js b/Sprint-3/quote-generator/quotes.js index 4a4d04b72..968fa3c44 100644 --- a/Sprint-3/quote-generator/quotes.js +++ b/Sprint-3/quote-generator/quotes.js @@ -1,3 +1,31 @@ +// Function to fetch a random quote and update the DOM +function displayRandomQuote() { + // 1. Get a random quote object using the provided helper function + const randomQuote = pickFromArray(quotes); + + // 2. Select the HTML elements where the quote and author will go + const quoteElement = document.querySelector("#quote"); + const authorElement = document.querySelector("#author"); + + // 3. Update the text of those elements + if (quoteElement && authorElement) { + quoteElement.innerText = randomQuote.quote; + authorElement.innerText = randomQuote.author; + } +} + +// Ensure the DOM is fully loaded before attaching event listeners +window.onload = function () { + // Display an initial quote right when the page loads + displayRandomQuote(); + + // Find the button and attach a click event listener + const newQuoteBtn = document.querySelector("#new-quote"); + if (newQuoteBtn) { + newQuoteBtn.addEventListener("click", displayRandomQuote); + } +}; + // DO NOT EDIT BELOW HERE // pickFromArray is a function which will return one item, at From 0aef471e6a9c4742b83e16881e1a41a1edcb823b Mon Sep 17 00:00:00 2001 From: Alex-Os-Dev-Lab Date: Tue, 7 Apr 2026 10:50:27 +0100 Subject: [PATCH 6/6] Fix doctype declaration in index.html --- Sprint-3/alarmclock/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Sprint-3/alarmclock/index.html b/Sprint-3/alarmclock/index.html index f16f1bd6c..48e2e80d9 100644 --- a/Sprint-3/alarmclock/index.html +++ b/Sprint-3/alarmclock/index.html @@ -1,4 +1,4 @@ - +