Skip to content
OverviewSolutions
13
Comments
4
Mohammed Faisal
@Mohammed-Faisal9

All comments

  • Mohammed Faisal•350
    @Mohammed-Faisal9Posted about 1 year ago

    hello Daniel, your solution is very good but there are some issue you should know it, you should not use min-width: 100vh because it will be scrolling in the page. happy coding

    1
  • Mohammed Faisal•350
    @Mohammed-Faisal9Posted about 1 year ago

    Hello Joda, your solution is good, but the grid needs a little improvement on a tablet screen. I really recommend you follow Kevin Powell on YouTube. if you don't know him he's the king of CSS and if you want more resources I would be happy to contact me.

    Marked as helpful
    0
  • Josh•100
    @j-likes-spicySubmitted about 1 year ago

    I know that I could have done better and there are likely some subtle differences between my version and the solution version, but it is fully functional and deployed as of this moment. Overall, it was a pretty good challenge. I did not work on it every single day due to a combination of procrastination, laziness, and getting wrapped up in having to do other things. I'm always open to feedback. Thanks for taking a look :)!

    age-calculator-app

    1
    Mohammed Faisal•350
    @Mohammed-Faisal9Posted about 1 year ago

    honestly, this is a really good solution, the JavaScript code is perfect. try to improve your html css code.

    0
  • Agustín Firpo•500
    @ArfirpoSubmitted about 1 year ago

    Frontend Mentor - Age calculator app solution

    Hi everybody! 👋

    This is a solution to the Age calculator app challenge on Frontend Mentor.

    • PS: I don’t quite understand how to animate the transition of numbers (bonus of the challenge), if anyone could guide me at this point I would thank them.
    • PS2: if someone wanted to check my javascript code and suggest how to improve it would be great. Saludos!

    The challenge 🎯

    Users should be able to:

    • View an age in years, months, and days after submitting a valid date through the form
    • Receive validation errors if:
      • Any field is empty when the form is submitted
      • The day number is not between 1-31
      • The month number is not between 1-12
      • The year is in the future
      • The date is invalid e.g. 31/04/1991 (there are 30 days in April)
    • View the optimal layout for the interface depending on their device's screen size
    • See hover and focus states for all interactive elements on the page
    • Bonus: See the age numbers animate to their final number when the form is submitted

    Links 🔗

    My process ⚙️

    Built with 🛠️

    • Semantic HTML5 markup
    • CSS custom properties
    • Flexbox
    • Javascript

    What I learned 📚

    This work was a real challenge when testing my skills with javascript, mainly when I had to create the functionalities of error messages for inputs and also to assemble the age calculation. With this challenge I began to get into the management of functions and calculations.

    Continued development 🔨

    In the following challenges I want to improve my javascript skills. I must strengthen my knowledge and management of functions, field validation and much more.

    Author 🙋🏻‍♂️

    Responsive Age Calculator

    1
    Mohammed Faisal•350
    @Mohammed-Faisal9Posted about 1 year ago

    hi Agustín Firpo, your solution is good, but it needs some improvement, For example, if the user enters a negative number, you can stop the count and show him an error, and if enter a year above the current year. To do animate the transition of numbers you should read about setInterval method in JavaScript I hope we can communicate to improve our skills.

    Marked as helpful
    0