From e840fb563002f9a69dfaab50a5a6ddf648bd3cfb Mon Sep 17 00:00:00 2001 From: afreen shaik Date: Sat, 27 Jul 2024 03:37:08 +0530 Subject: [PATCH 1/4] Used semantic tags --- Source-Code/DayPredictor/index.html | 25 +++++++++++++++++++++++++ 1 file changed, 25 insertions(+) create mode 100644 Source-Code/DayPredictor/index.html diff --git a/Source-Code/DayPredictor/index.html b/Source-Code/DayPredictor/index.html new file mode 100644 index 0000000..5d567f3 --- /dev/null +++ b/Source-Code/DayPredictor/index.html @@ -0,0 +1,25 @@ + + + + + + + + Day Predictor + + + +
+

Today is:

+ +
+ + + From 8365e04c5bef93d38795bf3632f3f93d994a9e9a Mon Sep 17 00:00:00 2001 From: afreen shaik Date: Sat, 27 Jul 2024 03:37:20 +0530 Subject: [PATCH 2/4] Add styles --- Source-Code/DayPredictor/style.css | 41 ++++++++++++++++++++++++++++++ 1 file changed, 41 insertions(+) create mode 100644 Source-Code/DayPredictor/style.css diff --git a/Source-Code/DayPredictor/style.css b/Source-Code/DayPredictor/style.css new file mode 100644 index 0000000..c63b418 --- /dev/null +++ b/Source-Code/DayPredictor/style.css @@ -0,0 +1,41 @@ +body { + font-family: Arial, Helvetica, sans-serif; + margin: 50px; + background: #fff; +} + +#container { + width: 500px; + height: 350px; + background-color: rgb(157, 255, 0); + margin: auto; + border-radius: 30px; + padding: 20px; +} + +h1 { + font-size: 40px; + font-weight: 900; + text-transform: uppercase; + text-align: center; + color: #f533e8; +} + +ul { + list-style-type: none; + display: flex; + flex-direction: column; + align-items: center; +} + +#weekday { + font-size: 40px; + color: #dd5800; + font-weight: 800; +} + +#phrase { + font-size: 40px; + color: #00f; + font-weight: 800; +} From c96235bbc92d9b7e982d53775bd75b3f58d46ab1 Mon Sep 17 00:00:00 2001 From: afreen shaik Date: Sat, 27 Jul 2024 03:37:34 +0530 Subject: [PATCH 3/4] Add funtionality --- Source-Code/DayPredictor/script.js | 49 ++++++++++++++++++++++++++++++ 1 file changed, 49 insertions(+) create mode 100644 Source-Code/DayPredictor/script.js diff --git a/Source-Code/DayPredictor/script.js b/Source-Code/DayPredictor/script.js new file mode 100644 index 0000000..7b37a7c --- /dev/null +++ b/Source-Code/DayPredictor/script.js @@ -0,0 +1,49 @@ +document.addEventListener('DOMContentLoaded', () => { + // Grab day of the week from local computer + const date = new Date(); + const dayOfWeekNumber = date.getDay(); + let nameOfDay; + let quote; + + switch (dayOfWeekNumber) { + case 0: + nameOfDay = 'Sunday'; + quote = 'Time to chillax!'; + break; + case 1: + nameOfDay = 'Monday'; + quote = 'Monday morning blues!'; + break; + case 2: + nameOfDay = 'Tuesday'; + quote = 'Taco Time!'; + break; + case 3: + nameOfDay = 'Wednesday'; + quote = 'Two more days to the weekend.'; + break; + case 4: + nameOfDay = 'Thursday'; + quote = 'The weekend is almost here...'; + break; + case 5: + nameOfDay = 'Friday'; + quote = 'Weekend is here!'; + break; + case 6: + nameOfDay = 'Saturday'; + quote = 'Time to party!'; + break; + default: + nameOfDay = 'Unknown'; + quote = ''; + } + + // Display the day of the week + const weekdayDiv = document.getElementById('weekday'); + weekdayDiv.innerHTML = `${nameOfDay}`; + + // Display quote + const quoteDiv = document.getElementById('phrase'); + quoteDiv.innerHTML = `${quote}`; +}); From 7436fa870b9c0a1e3fef59c2b123f7399d40eee4 Mon Sep 17 00:00:00 2001 From: afreen shaik Date: Sat, 27 Jul 2024 03:37:44 +0530 Subject: [PATCH 4/4] update project --- README.md | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/README.md b/README.md index f9d09cf..9e77327 100644 --- a/README.md +++ b/README.md @@ -298,6 +298,17 @@ In order to run this project you need: +
  • +
    +Day Predictor +

    A Simple Week Day Predictor App written in HTML, CSS, and JavaScript. This app displays the current day of the week along with a corresponding motivational quote, using local computer time.

    + +
    +
    • +

    (back to top)