From bc8ae2041aed02f62a2b764d30a8e12599b831a2 Mon Sep 17 00:00:00 2001 From: Pythia Date: Thu, 6 Nov 2025 13:04:01 +0100 Subject: [PATCH 01/25] Created file mean.js & test file mean.test.js and wrote code and tests as I was doing the preparation. --- .prettierrc | 2 +- prep/mean.js | 20 ++++++++++++++++++++ prep/mean.test.js | 6 ++++++ 3 files changed, 27 insertions(+), 1 deletion(-) create mode 100644 prep/mean.js create mode 100644 prep/mean.test.js diff --git a/.prettierrc b/.prettierrc index 59bb3b44f..264aee094 100644 --- a/.prettierrc +++ b/.prettierrc @@ -12,7 +12,7 @@ "requirePragma": false, "semi": true, "singleQuote": false, - "tabWidth": 2, + "tabWidth": 4, "trailingComma": "es5", "useTabs": false, "vueIndentScriptAndStyle": false diff --git a/prep/mean.js b/prep/mean.js new file mode 100644 index 000000000..f9ec4bdae --- /dev/null +++ b/prep/mean.js @@ -0,0 +1,20 @@ +function calculateMean(list) { + let total = 0; + for (const item of list) { + total += item; + } +} + +function calculateMedian(list) { + const middleIndex = Math.floor(list.length / 2); + const median = list.splice(middleIndex, 1)[0]; + + return median; +} + +const list = [10, 20, 30]; +const copy = list; +copy.push(60, 70); + +console.log(list); +console.log(copy); diff --git a/prep/mean.test.js b/prep/mean.test.js new file mode 100644 index 000000000..7a057e17d --- /dev/null +++ b/prep/mean.test.js @@ -0,0 +1,6 @@ +test("calculates the median of a list of odd length", () => { + const list = [10, 20, 30, 50, 60]; + const currentOutput = calculateMedian(list); + const targetOutput = 30; + expect(currentOutput).toEqual(targetOutput); +}); From 5c7adf7b747e4dcf519f2a0a56e24bac48eb044f Mon Sep 17 00:00:00 2001 From: Pythia Date: Thu, 6 Nov 2025 13:33:46 +0100 Subject: [PATCH 02/25] Created files for exercises and their tests. Copied the code. --- prep/exercise-1.js | 14 ++++++++++++++ prep/exercise-1.test.js | 0 prep/exercise-2.js | 0 prep/exercise-2.test.js | 0 4 files changed, 14 insertions(+) create mode 100644 prep/exercise-1.js create mode 100644 prep/exercise-1.test.js create mode 100644 prep/exercise-2.js create mode 100644 prep/exercise-2.test.js diff --git a/prep/exercise-1.js b/prep/exercise-1.js new file mode 100644 index 000000000..975f735d6 --- /dev/null +++ b/prep/exercise-1.js @@ -0,0 +1,14 @@ +// Can you fix this code? +function doubleAllNumbers() { + let doubledNumbers; + + for (let n of numbers) { + doubledNumbers.push(n * 2); + } + + return doubledNumbers; +} + +const myNums = [10, 20, 30]; +doubleAllNumbers(myNums); +console.log(myNums); diff --git a/prep/exercise-1.test.js b/prep/exercise-1.test.js new file mode 100644 index 000000000..e69de29bb diff --git a/prep/exercise-2.js b/prep/exercise-2.js new file mode 100644 index 000000000..e69de29bb diff --git a/prep/exercise-2.test.js b/prep/exercise-2.test.js new file mode 100644 index 000000000..e69de29bb From c27dca3c7f53b7c9a51ac7613fc544def6da62b0 Mon Sep 17 00:00:00 2001 From: Pythia Date: Thu, 6 Nov 2025 13:34:31 +0100 Subject: [PATCH 03/25] Copied the code in exercise-2 file --- prep/exercise-2.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/prep/exercise-2.js b/prep/exercise-2.js index e69de29bb..37480e779 100644 --- a/prep/exercise-2.js +++ b/prep/exercise-2.js @@ -0,0 +1,8 @@ +// Write a function which takes an array as a parameter +// and swaps the first element with the last element + +function swapFirstAndLast(arr) {} + +const myArray = [5, 2, 3, 4, 1]; +swapFirstAndLast(myArray); +console.log(myArray); // what output should we expect? From d67bad2329f76c457e9b11f33aceba85f08c8043 Mon Sep 17 00:00:00 2001 From: Pythia Date: Thu, 6 Nov 2025 13:37:49 +0100 Subject: [PATCH 04/25] Defined the variable as an array --- prep/exercise-1.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/prep/exercise-1.js b/prep/exercise-1.js index 975f735d6..2e7c8c920 100644 --- a/prep/exercise-1.js +++ b/prep/exercise-1.js @@ -1,6 +1,6 @@ // Can you fix this code? function doubleAllNumbers() { - let doubledNumbers; + let doubledNumbers = []; for (let n of numbers) { doubledNumbers.push(n * 2); From b610439a054ff06cccd488b3d6a60bd0c40683be Mon Sep 17 00:00:00 2001 From: Pythia Date: Thu, 6 Nov 2025 13:39:01 +0100 Subject: [PATCH 05/25] Made numbers the parameter --- prep/exercise-1.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/prep/exercise-1.js b/prep/exercise-1.js index 2e7c8c920..d98b14566 100644 --- a/prep/exercise-1.js +++ b/prep/exercise-1.js @@ -1,5 +1,5 @@ // Can you fix this code? -function doubleAllNumbers() { +function doubleAllNumbers(numbers) { let doubledNumbers = []; for (let n of numbers) { From 67bc3d1ea9524f21127828f75a9ae26284b06684 Mon Sep 17 00:00:00 2001 From: Pythia Date: Thu, 6 Nov 2025 13:41:47 +0100 Subject: [PATCH 06/25] Tried to log the doubleAllNumbers (and failed) --- prep/exercise-1.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/prep/exercise-1.js b/prep/exercise-1.js index d98b14566..e65575bfc 100644 --- a/prep/exercise-1.js +++ b/prep/exercise-1.js @@ -11,4 +11,4 @@ function doubleAllNumbers(numbers) { const myNums = [10, 20, 30]; doubleAllNumbers(myNums); -console.log(myNums); +console.log(doubleAllNumbers); From 98a84fca9d48a4276674424bc0504cae0dedb058 Mon Sep 17 00:00:00 2001 From: Pythia Date: Thu, 6 Nov 2025 13:43:58 +0100 Subject: [PATCH 07/25] Created a variable that i could log in the console --- prep/exercise-1.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/prep/exercise-1.js b/prep/exercise-1.js index e65575bfc..be0bc25ea 100644 --- a/prep/exercise-1.js +++ b/prep/exercise-1.js @@ -10,5 +10,5 @@ function doubleAllNumbers(numbers) { } const myNums = [10, 20, 30]; -doubleAllNumbers(myNums); -console.log(doubleAllNumbers); +const double = doubleAllNumbers(myNums); +console.log(double); From 0d09f79a62373212482d6e0bce9599c34c8753ed Mon Sep 17 00:00:00 2001 From: Pythia Date: Thu, 6 Nov 2025 14:03:38 +0100 Subject: [PATCH 08/25] Wrote the function to swap first-last digits of array --- prep/exercise-2.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/prep/exercise-2.js b/prep/exercise-2.js index 37480e779..f86376857 100644 --- a/prep/exercise-2.js +++ b/prep/exercise-2.js @@ -1,7 +1,13 @@ // Write a function which takes an array as a parameter // and swaps the first element with the last element -function swapFirstAndLast(arr) {} +function swapFirstAndLast(arr) { + let arr = []; //Made arr an array + const first = arr[0]; //Indivates the first digit location of the array + const last = arr[arr.length - 1]; //Indicates the lst digit location of the array + arr[0] = last; //Because I can't reassign a new value to a const and we want the first position to hold the value of the last + arr[arr.length - 1] = first; +} const myArray = [5, 2, 3, 4, 1]; swapFirstAndLast(myArray); From 4a38ce95b7a9e2ea387638cc1ddab8634996cef2 Mon Sep 17 00:00:00 2001 From: Pythia Date: Thu, 6 Nov 2025 14:04:34 +0100 Subject: [PATCH 09/25] Deleted the arr[] as testing indicated it was already declared --- prep/exercise-2.js | 1 - 1 file changed, 1 deletion(-) diff --git a/prep/exercise-2.js b/prep/exercise-2.js index f86376857..fa228871a 100644 --- a/prep/exercise-2.js +++ b/prep/exercise-2.js @@ -2,7 +2,6 @@ // and swaps the first element with the last element function swapFirstAndLast(arr) { - let arr = []; //Made arr an array const first = arr[0]; //Indivates the first digit location of the array const last = arr[arr.length - 1]; //Indicates the lst digit location of the array arr[0] = last; //Because I can't reassign a new value to a const and we want the first position to hold the value of the last From 526f2521447cc05a2c5d5428f65b6d3abcf7d930 Mon Sep 17 00:00:00 2001 From: Pythia Date: Mon, 24 Nov 2025 15:48:33 +0100 Subject: [PATCH 10/25] changed title --- Sprint-3/slideshow/index.html | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/Sprint-3/slideshow/index.html b/Sprint-3/slideshow/index.html index 50f2eb1c0..ce7afa02f 100644 --- a/Sprint-3/slideshow/index.html +++ b/Sprint-3/slideshow/index.html @@ -1,14 +1,14 @@ - - - - Title here - - - - cat-pic - - - + + + + <Img>Image carousel</Img> + + + + cat-pic + + + From 19f181310689c58000fb7fb78502f5fb2f8da27a Mon Sep 17 00:00:00 2001 From: Pythia Date: Mon, 24 Nov 2025 22:14:47 +0100 Subject: [PATCH 11/25] Wrote the function to detect index and move forward or backwards. Added the click events --- Sprint-3/slideshow/slideshow.js | 20 +++++++++++++++++++- 1 file changed, 19 insertions(+), 1 deletion(-) diff --git a/Sprint-3/slideshow/slideshow.js b/Sprint-3/slideshow/slideshow.js index 063ceefb5..89717af96 100644 --- a/Sprint-3/slideshow/slideshow.js +++ b/Sprint-3/slideshow/slideshow.js @@ -4,5 +4,23 @@ const images = [ "./assets/cute-cat-c.jpg", ]; +// Write your code here +let currentIndex = 0; +function moveFrontOnce(forward) { + if (forward) { + currentIndex = (currentIndex + 1) % images.length; // If forward is true adds 1 to the index + // and wraps with % images.length in case we are in the last index + } else { + currentIndex = (currentIndex - 1 + images.length) % images.length; // Same here if backward it deducts one index + //making sure it wraps back to last image in case we were at index[0] + } + const image = document.getElementById("carousel-img"); + image.src = images[currentIndex]; +} -// Write your code here \ No newline at end of file +document + .getElementById("forward-btn") + .addEventListener("click", () => moveFrontOnce(true)); +document + .getElementById("backward-btn") + .addEventListener("click", () => moveFrontOnce(false)); From add31487d5b9b8cb96e3e7eefa8f757cfb7f74b5 Mon Sep 17 00:00:00 2001 From: Pythia Date: Mon, 24 Nov 2025 22:22:05 +0100 Subject: [PATCH 12/25] removed from title --- Sprint-3/slideshow/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Sprint-3/slideshow/index.html b/Sprint-3/slideshow/index.html index ce7afa02f..45b8ca741 100644 --- a/Sprint-3/slideshow/index.html +++ b/Sprint-3/slideshow/index.html @@ -3,7 +3,7 @@ - <Img>Image carousel</Img> + Image carousel From b65c3607e2172eb5a0f6a483b5e303b2ed0505f3 Mon Sep 17 00:00:00 2001 From: Pythia Date: Mon, 24 Nov 2025 22:37:21 +0100 Subject: [PATCH 13/25] Adding things to pass the test --- Sprint-3/slideshow/slideshow.js | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) diff --git a/Sprint-3/slideshow/slideshow.js b/Sprint-3/slideshow/slideshow.js index 89717af96..b254e03b3 100644 --- a/Sprint-3/slideshow/slideshow.js +++ b/Sprint-3/slideshow/slideshow.js @@ -7,7 +7,8 @@ const images = [ // Write your code here let currentIndex = 0; function moveFrontOnce(forward) { - if (forward) { + console.log("moveFrontOnce called, forward = ", forward); + if (forward === true) { currentIndex = (currentIndex + 1) % images.length; // If forward is true adds 1 to the index // and wraps with % images.length in case we are in the last index } else { @@ -16,11 +17,14 @@ function moveFrontOnce(forward) { } const image = document.getElementById("carousel-img"); image.src = images[currentIndex]; + console.log("Image scr is set to:", image.scr); } -document - .getElementById("forward-btn") - .addEventListener("click", () => moveFrontOnce(true)); -document - .getElementById("backward-btn") - .addEventListener("click", () => moveFrontOnce(false)); +document.addEventListener("DOMContentLoaded", () => { + document + .getElementById("forward-btn") + .addEventListener("click", () => moveFrontOnce(true)); + document + .getElementById("backward-btn") + .addEventListener("click", () => moveFrontOnce(false)); +}); From efb92772eb0738c7ded06b2c7ae0771bc669bc7b Mon Sep 17 00:00:00 2001 From: Pythia Date: Mon, 24 Nov 2025 22:54:55 +0100 Subject: [PATCH 14/25] Trying to pass the test, live server working tests failing --- Sprint-3/slideshow/slideshow.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/Sprint-3/slideshow/slideshow.js b/Sprint-3/slideshow/slideshow.js index b254e03b3..2e7d76d33 100644 --- a/Sprint-3/slideshow/slideshow.js +++ b/Sprint-3/slideshow/slideshow.js @@ -1,4 +1,4 @@ -const images = [ +window.images = [ "./assets/cute-cat-a.png", "./assets/cute-cat-b.jpg", "./assets/cute-cat-c.jpg", @@ -7,6 +7,7 @@ const images = [ // Write your code here let currentIndex = 0; function moveFrontOnce(forward) { + const images = window.images; console.log("moveFrontOnce called, forward = ", forward); if (forward === true) { currentIndex = (currentIndex + 1) % images.length; // If forward is true adds 1 to the index @@ -16,8 +17,8 @@ function moveFrontOnce(forward) { //making sure it wraps back to last image in case we were at index[0] } const image = document.getElementById("carousel-img"); - image.src = images[currentIndex]; - console.log("Image scr is set to:", image.scr); + image.setAttribute("src", images[currentIndex]); + console.log("Image src is set to:", image.src); } document.addEventListener("DOMContentLoaded", () => { From 60c45eda756deb457d8bf4e9264ef431ce07940f Mon Sep 17 00:00:00 2001 From: Pythia Date: Mon, 24 Nov 2025 23:02:41 +0100 Subject: [PATCH 15/25] Typos --- Sprint-3/slideshow/readme.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/Sprint-3/slideshow/readme.md b/Sprint-3/slideshow/readme.md index a0c06e4ff..e4b492bb3 100644 --- a/Sprint-3/slideshow/readme.md +++ b/Sprint-3/slideshow/readme.md @@ -64,9 +64,9 @@ Make your buttons work to navigate forwards and backwards, manually. Add the following buttons: -- auto-forward -- stop -- auto-backwards +- auto-forward +- stop +- auto-backwards These should allow automatic navigation through the images, say every 5 seconds. @@ -74,8 +74,8 @@ These should allow automatic navigation through the images, say every 5 seconds. Congratulations, you've finished the basics! -- Make sure you can access it and play with it on a smartphone! -- Celebrate! +- Make sure you can access it and play with it on a smartphone! +- Celebrate! ## Further work From 4f6e9828a9dce573546a4beaec43c9600e1544d4 Mon Sep 17 00:00:00 2001 From: Pythia Date: Tue, 25 Nov 2025 14:33:50 +0100 Subject: [PATCH 16/25] Added comments --- Sprint-3/slideshow/slideshow.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/Sprint-3/slideshow/slideshow.js b/Sprint-3/slideshow/slideshow.js index 2e7d76d33..e506acc25 100644 --- a/Sprint-3/slideshow/slideshow.js +++ b/Sprint-3/slideshow/slideshow.js @@ -8,7 +8,7 @@ window.images = [ let currentIndex = 0; function moveFrontOnce(forward) { const images = window.images; - console.log("moveFrontOnce called, forward = ", forward); + console.log("moveFrontOnce called, forward = ", forward); // Trying to troubleshoot if (forward === true) { currentIndex = (currentIndex + 1) % images.length; // If forward is true adds 1 to the index // and wraps with % images.length in case we are in the last index @@ -17,8 +17,8 @@ function moveFrontOnce(forward) { //making sure it wraps back to last image in case we were at index[0] } const image = document.getElementById("carousel-img"); - image.setAttribute("src", images[currentIndex]); - console.log("Image src is set to:", image.src); + image.setAttribute("src", images[currentIndex]); // Changed the approach while trying to pass the tests + console.log("Image src is set to:", image.src); // Tests shows that my img src is undefined } document.addEventListener("DOMContentLoaded", () => { From ddcf9a9c46e8fc8a6d05cf95514aa6589f3f422a Mon Sep 17 00:00:00 2001 From: Pythia Date: Tue, 25 Nov 2025 14:43:32 +0100 Subject: [PATCH 17/25] Added the buttons of auto forward, auto backward and stop --- Sprint-3/slideshow/index.html | 3 +++ 1 file changed, 3 insertions(+) diff --git a/Sprint-3/slideshow/index.html b/Sprint-3/slideshow/index.html index 45b8ca741..e4a1bf7a9 100644 --- a/Sprint-3/slideshow/index.html +++ b/Sprint-3/slideshow/index.html @@ -8,7 +8,10 @@ cat-pic + + + From 85d7cb114ed668dc4f945563c66a2b19390a73a4 Mon Sep 17 00:00:00 2001 From: Pythia Date: Tue, 25 Nov 2025 15:31:02 +0100 Subject: [PATCH 18/25] Created the functions for auto slideshow and stop. Enabled/disabled the buttons --- Sprint-3/slideshow/slideshow.js | 44 +++++++++++++++++++++++++++++++++ 1 file changed, 44 insertions(+) diff --git a/Sprint-3/slideshow/slideshow.js b/Sprint-3/slideshow/slideshow.js index e506acc25..ac0d51ec4 100644 --- a/Sprint-3/slideshow/slideshow.js +++ b/Sprint-3/slideshow/slideshow.js @@ -6,6 +6,9 @@ window.images = [ // Write your code here let currentIndex = 0; +let intervalId = null; + +// Manual movement of carousel function moveFrontOnce(forward) { const images = window.images; console.log("moveFrontOnce called, forward = ", forward); // Trying to troubleshoot @@ -21,6 +24,38 @@ function moveFrontOnce(forward) { console.log("Image src is set to:", image.src); // Tests shows that my img src is undefined } +// Auto movement of carousel forward +function startAutoForward() { + stopAuto(); // Function to stop the autoslide before we start + intervalId = setInterval(() => moveFrontOnce(true), 2000); // Starts the autoslide forward every 2" + toggleButtons(true); // Auto-forward button active +} + +// Auto movement of carousel backwards +function startAutoBackward() { + stopAuto(); // Stop the autoslide before we start + intervalId = setInterval(() => moveFrontOnce(false), 2000); // Starts the autoslide backwards + toggleButtons(true); // Auto-backward button active +} + +// Stops automatic slideshow +function stopAuto() { + if (intervalId !== null) { + clearInterval(intervalId); + intervalId = null; + } + toggleButtons(false); +} + +// Enables/disables buttons based on if autoslideshow is running +function toggleButtons(isRunning) { + document.getElementById("auto-forward").disabled = isRunning; // When the auto slideshow is on auto-forward button is unclickable + document.getElementById("auto-backward").disabled = isRunning; // When auto slideshow is on auto-backward button is unclicable + document.getElementById("stop").disabled = !isRunning; // Stop button is disabled only when auto slideshow is off, so when autoslideshow is running + //stop is the only button we can click +} + +// Activate (call) the buttons document.addEventListener("DOMContentLoaded", () => { document .getElementById("forward-btn") @@ -28,4 +63,13 @@ document.addEventListener("DOMContentLoaded", () => { document .getElementById("backward-btn") .addEventListener("click", () => moveFrontOnce(false)); + document + .getElementById("auto-forward") + .addEventListener("click", () => startAutoForward()); + document + .getElementById("auto-backward") + .addEventListener("click", () => startAutoBackward()); + document.getElementById("stop").addEventListener("click", () => stopAuto()); + // Disable stop button initially when autoslideshow is not running yet + document.getElementById("stop").disabled = true; }); From 583e04b5046d0195c145549a05a9caf05ce5ffda Mon Sep 17 00:00:00 2001 From: Pythia Date: Tue, 25 Nov 2025 16:09:22 +0100 Subject: [PATCH 19/25] Try to arrange all imgs to have the same size as the first and added link of css file to my html file --- Sprint-3/slideshow/index.html | 1 + Sprint-3/slideshow/style.css | 7 +++++++ 2 files changed, 8 insertions(+) diff --git a/Sprint-3/slideshow/index.html b/Sprint-3/slideshow/index.html index e4a1bf7a9..12cef5511 100644 --- a/Sprint-3/slideshow/index.html +++ b/Sprint-3/slideshow/index.html @@ -5,6 +5,7 @@ Image carousel + cat-pic diff --git a/Sprint-3/slideshow/style.css b/Sprint-3/slideshow/style.css index 63cedf2d2..2b8ff45b0 100644 --- a/Sprint-3/slideshow/style.css +++ b/Sprint-3/slideshow/style.css @@ -1 +1,8 @@ /** Write your CSS in here **/ +#carousel-img { + width: 745px; + height: 559px; + object-fit: cover; /* ensures the image covers the area without distortion */ + display: block; /* removes any inline whitespace below image */ + margin: 0 auto; /* center horizontally if needed */ +} From eb970165abf88840486a7d6c32d27a50a802b0f0 Mon Sep 17 00:00:00 2001 From: Pythia Date: Tue, 25 Nov 2025 16:14:30 +0100 Subject: [PATCH 20/25] Added all buttons in a div for css manipulation --- Sprint-3/slideshow/index.html | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/Sprint-3/slideshow/index.html b/Sprint-3/slideshow/index.html index 12cef5511..be96a9c85 100644 --- a/Sprint-3/slideshow/index.html +++ b/Sprint-3/slideshow/index.html @@ -9,10 +9,12 @@ cat-pic - - - - - +
+ + + + + +
From 33254a29b6a9316efce46280760fdf783c0e120b Mon Sep 17 00:00:00 2001 From: Pythia Date: Tue, 25 Nov 2025 16:18:01 +0100 Subject: [PATCH 21/25] Styling the buttons --- Sprint-3/slideshow/style.css | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/Sprint-3/slideshow/style.css b/Sprint-3/slideshow/style.css index 2b8ff45b0..4d6902d17 100644 --- a/Sprint-3/slideshow/style.css +++ b/Sprint-3/slideshow/style.css @@ -6,3 +6,10 @@ display: block; /* removes any inline whitespace below image */ margin: 0 auto; /* center horizontally if needed */ } + +#button-container { + display: flex; + justify-content: center; + gap: 10px; + margin-top: 20px; +} From ba68494f766f954db35bbf01ee351102d03af08d Mon Sep 17 00:00:00 2001 From: Pythia Date: Tue, 25 Nov 2025 16:20:48 +0100 Subject: [PATCH 22/25] Added class to buttons for css manipulation --- Sprint-3/slideshow/index.html | 18 +++++++++++++----- 1 file changed, 13 insertions(+), 5 deletions(-) diff --git a/Sprint-3/slideshow/index.html b/Sprint-3/slideshow/index.html index be96a9c85..0e7ce30f0 100644 --- a/Sprint-3/slideshow/index.html +++ b/Sprint-3/slideshow/index.html @@ -10,11 +10,19 @@ cat-pic
- - - - - + + + + +
From d4224ca2f7fc0cee4818c3c8fa8c0120e38481d1 Mon Sep 17 00:00:00 2001 From: Pythia Date: Tue, 25 Nov 2025 16:29:48 +0100 Subject: [PATCH 23/25] Styling buttons and fixed typo --- Sprint-3/slideshow/index.html | 2 +- Sprint-3/slideshow/style.css | 6 ++++++ 2 files changed, 7 insertions(+), 1 deletion(-) diff --git a/Sprint-3/slideshow/index.html b/Sprint-3/slideshow/index.html index 0e7ce30f0..65f1fe0d5 100644 --- a/Sprint-3/slideshow/index.html +++ b/Sprint-3/slideshow/index.html @@ -16,7 +16,7 @@ - + diff --git a/Sprint-3/slideshow/style.css b/Sprint-3/slideshow/style.css index 4d6902d17..b712f9fe5 100644 --- a/Sprint-3/slideshow/style.css +++ b/Sprint-3/slideshow/style.css @@ -13,3 +13,9 @@ gap: 10px; margin-top: 20px; } + +.button { + background-color: bisque; + font-size: 16px; + border-radius: 8px; +} From 547d595221b5db90b78eb78c55a7ceb899dc6aeb Mon Sep 17 00:00:00 2001 From: Pythia Date: Tue, 25 Nov 2025 16:36:25 +0100 Subject: [PATCH 24/25] Styling buttons and body --- Sprint-3/slideshow/style.css | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/Sprint-3/slideshow/style.css b/Sprint-3/slideshow/style.css index b712f9fe5..f65a86823 100644 --- a/Sprint-3/slideshow/style.css +++ b/Sprint-3/slideshow/style.css @@ -1,4 +1,7 @@ /** Write your CSS in here **/ +body { + background-color: brown; +} #carousel-img { width: 745px; height: 559px; @@ -16,6 +19,10 @@ .button { background-color: bisque; + font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif font-size: 16px; + font-style: oblique; border-radius: 8px; + padding: 10px 20px; + cursor: pointer; } From bf5394b51b82de18f0fb88d23b0734b83951fd8a Mon Sep 17 00:00:00 2001 From: Pythia Date: Tue, 25 Nov 2025 16:48:44 +0100 Subject: [PATCH 25/25] Styling buttons and body --- Sprint-3/slideshow/style.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/Sprint-3/slideshow/style.css b/Sprint-3/slideshow/style.css index f65a86823..9a1521f3b 100644 --- a/Sprint-3/slideshow/style.css +++ b/Sprint-3/slideshow/style.css @@ -1,6 +1,6 @@ /** Write your CSS in here **/ body { - background-color: brown; + background-color: rgb(242, 106, 106); } #carousel-img { width: 745px; @@ -12,7 +12,7 @@ body { #button-container { display: flex; - justify-content: center; + justify-content: center; /* Justify in horizontal axis*/ gap: 10px; margin-top: 20px; } @@ -20,7 +20,7 @@ body { .button { background-color: bisque; font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif - font-size: 16px; + font-size: Verdana, Geneva, Tahoma, sans-serif font-style: oblique; border-radius: 8px; padding: 10px 20px;