Age Calculator App with happy birthday message

Hello Joseph, your project turned out incredibly well, it's close to the proposed design, and has a very unique theme. I also found it interesting that you already created a link between it and your Portfolio.

I also noticed that you used a neo-brutalism aesthetic for your homepage button, so it would be interesting to add this aesthetic to the calculator as well, to make it more cohesive. But that's just a suggestion.

Regarding your code, it's clean, but it doesn't seem to be correct because, for example, I entered 14/07/2001, and the result returned to me was "23 years, -3 months, 16 days". In this way, only the days are correct, while the month and year are not. What you can do is add a way so that when the month has a negative value, the year is reduced by 1.

Also, in your logic, you didn't include leap years, you can do this using the modulo operator to see if the year is divisible by 4.

Below is the code you can use to make the correct calculation (Note that only a small portion has been changed for this, and it was in the calculateAge function):

  let yyyy = todaysYear - birthDate.getFullYear();
  let mm = todaysMonth - birthDate.getMonth();
  let dd = todaysDay - birthDate.getDate();

  if (dd < 0) {
    mm--;
    dd += daysPerMonth[birthDate.getMonth()];
  } else if (mm < 0) {
    yyyy--;
    mm += 12;
  }

And again, congratulations, if you have any questions please comment below and I'll try to help as best as possible, and if something goes wrong with the code I provided, let me know as well.

Hello there 👋. Congratulations on successfully completing the challenge! 🎉

• I have a suggestion regarding your code that I believe will be of great interest to you.

MAKING ACCESSIBLE BUTTON :

• Your solution's button markup for Mobile devices is not accessible, that's simply because those elements does not have any text content or an aria-label attribute that describes its purpose or function. The alt attribute on the <img> element inside the button is not an adequate replacement for an accessible name.

• Incorrect use of <img> inside <button>: While it is possible to have an <img> element inside a <button>, the <button> must want to have an aria-label attribute to provide an accessible name for the button.

• Here's an example:

<button aria-label="Click to calculate your age" type="submit" id="submitBtn">
   <img src="./assets/images/icon-arrow.svg" alt="arrow icon">
</button>

.

I hope you find this helpful 😄 Above all, the solution you submitted is great !

Happy coding!