From bcefa6a9b33ef61d8bd9053df716cf70380a271b Mon Sep 17 00:00:00 2001 From: mollup Date: Sun, 23 Mar 2025 23:56:24 -0400 Subject: [PATCH] 5 big booms for webdev lab 5 --- index.html | 2 +- static/script.js | 89 +++++++++++++++++++++++++++------------------ static/style.css | 48 +++++++++++++++++++++++- views/contact.html | 13 ++++++- views/cv.html | 1 + views/for-fun.html | 32 ++++++++++++---- views/mom.png | Bin 0 -> 289822 bytes 7 files changed, 137 insertions(+), 48 deletions(-) create mode 100644 views/mom.png diff --git a/index.html b/index.html index 59953de..339cb49 100644 --- a/index.html +++ b/index.html @@ -13,10 +13,10 @@ André Miller +
- diff --git a/static/script.js b/static/script.js index 25802d1..c76eeeb 100644 --- a/static/script.js +++ b/static/script.js @@ -40,47 +40,52 @@ function loop(l) { // loop(L1); // loop(L2); -function greetingFunc() { - let d = new Date(); - let h = d.getHours(); - if (h < 5) { - message = "Good night my name is André Miller"; - } else if (h < 12) { - message = "Good morning, my name is André Miller"; - } else if (h < 18) { - message = "Good afternoon, my name is André Miller"; - } else if (h < 20) { - message = "Good evening, my name is André Miller"; - } else { - message = "Good night, my name is André Miller"; +document.addEventListener("DOMContentLoaded", function() { + function greetingFunc() { + let d = new Date(); + let h = d.getHours(); + let message; + if (h < 5) { + message = "Good night my name is André Miller"; + } else if (h < 12) { + message = "Good morning, my name is André Miller"; + } else if (h < 18) { + message = "Good afternoon, my name is André Miller"; + } else if (h < 20) { + message = "Good evening, my name is André Miller"; + } else { + message = "Good night, my name is André Miller"; + } + let E = document.getElementById("greeting"); + if (E) { + E.innerHTML = message; + } } - let E = document.getElementById("greeting"); - E.innerHTML = message; -} -window.onLoad = greetingFunc; - -greetingFunc(); - -function year() { - let d = new Date(); - let y = d.getFullYear(); - let E = document.getElementById("copyYear").innerHTML += y; -} + function year() { + let d = new Date(); + let y = d.getFullYear(); + let E = document.getElementById("copyYear"); + if (E) { + E.innerHTML += y; + } + } -window.onLoad = year(); + greetingFunc(); + year(); +}); -function showList() { - let list = document.getElementById("funList"); - let button = document.getElementById("showButton"); +// function showList() { +// let list = document.getElementById("funList"); +// let button = document.getElementById("showButton"); - if (list.style.display!="block") { - list.style.display = "block"; - } - else { - list.style.display = "none"; - } -} +// if (list.style.display!="block") { +// list.style.display = "block"; +// } +// else { +// list.style.display = "none"; +// } +// } $(document).ready(function(){ $("#readMore").click(function(){ @@ -141,4 +146,16 @@ function validate(event) { if (!isValid) { event.preventDefault(); // Stop the form from submitting if invalid } +} + +function getAdvice() { + fetch("https://api.adviceslip.com/advice") + .then(response => response.json()) // Convert response to JSON + .then(data => { + document.getElementById("adviceText").innerText = data.slip.advice; // Update the text + }) + .catch(error => { + console.error("Error fetching advice:", error); + document.getElementById("adviceText").innerText = "Sorry, couldn't fetch advice!"; + }); } \ No newline at end of file diff --git a/static/style.css b/static/style.css index 9de43c9..3c61b86 100644 --- a/static/style.css +++ b/static/style.css @@ -56,9 +56,55 @@ tr:nth-child(even) { #webname { background-color: #92ad70; } - +/* #funList { display: none; +} */ + +.funsection { + display: flex; + align-items: center; + gap: 20px; +} + +#vid { + object-fit: cover; + border-radius: 100%; +} + +.container { + background: white; + padding: 20px; + margin: 50px auto; + width: 300px; + border-radius: 10px; + box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); +} + +#mompic { + border-radius: 100%; + width: 250px; + height: 250px; + margin-left: 0%; + object-fit: cover; + flex-shrink: 0; +} + +.mainLayout { + display: flex; + justify-content: space-around; + align-items: center; + flex-wrap: wrap; + margin: 20px; +} + +#item1, #item2 { + background: white; + padding: 20px; + border-radius: 10px; + box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); + width: 45%; + text-align: center; } #showButton { diff --git a/views/contact.html b/views/contact.html index bc63f2b..0541b22 100644 --- a/views/contact.html +++ b/views/contact.html @@ -12,10 +12,13 @@ André Miller + +
+ @@ -27,8 +30,13 @@

André Miller

For fun!
-
-

Contact Me

+
+
+

Find me!

+ +
+
+

Contact Me

@@ -58,6 +66,7 @@

Contact Me

LinkedIn: https://www.linkedin.com/in/andré-miller/ +
diff --git a/views/cv.html b/views/cv.html index e26b0d6..960eabc 100644 --- a/views/cv.html +++ b/views/cv.html @@ -13,6 +13,7 @@ André Miller +
diff --git a/views/for-fun.html b/views/for-fun.html index 723ae40..1c4824b 100644 --- a/views/for-fun.html +++ b/views/for-fun.html @@ -13,6 +13,7 @@ André Miller +
@@ -27,16 +28,31 @@

André Miller

For fun!
-
-

Things I love to do for fun!

- -
    -
  • Pokémon Cards/Pokémon in general
    • -
  • Listening to music:
    +
    +
    +

    Things I love to do for fun!

    + +
      +
    • Pokémon Cards/Pokémon in general
      • +
    • Listening to music:
      Favorites are Radiohead, Elliott Smith, Beabadoobee, Dean Blunt, and Title Fight.
      I will listen to pretty much anything from rock/folk to reggaeton/rap, and would love to talk more!
      • -
    • Watch the New Orleans Pelicans (Next year is our year!).
      • -
    +
  • Watch the New Orleans Pelicans (Next year is our year!).
    • +
+
+
+ mom +
+
+ +
+
+

Need some advice?

+

Click the button to get a piece of advice!

+ +