n/a
What challenges did you encounter, and how did you overcome them?n/a
What specific areas of your project would you like help with?n/a
n/a
What challenges did you encounter, and how did you overcome them?n/a
What specific areas of your project would you like help with?n/a
O sistema nao ficou responsivel, tente adicionar flex box ou grid!
I'm proud to have completed my first challenge and to have, I think, submitted work that visually looks like the model.
There's surely a lot of room for improvement and optimization, so feel free to give me feedback so I can do better.
What challenges did you encounter, and how did you overcome them?I only started learning CSS a few months ago so the whole process has been a challenge.
I have to admit it was a fun challenge but a challenge nonetheless.
What specific areas of your project would you like help with?As a beginner, I would appreciate any advice from experienced programmers.
However, I would be happy to receive recommendations on best practices for clean and professional coding.
Hey, dude, what's up? I hope so.
First, congratulations on the solution.
Second, I would like to give you a tip regarding the center tag, it is obsolete, so use other tags and center it with css.
Hey friend, how are you?
I noticed that your card is not centered.
You can use the min-height
property on the body and set the min value to 100vh
and use flex box or grid to center it.
Center using flex box:
body {
min-height: 100vh;
display: flex;
justify-content: center;
align-items: center;
}
Center using flex grid:
body {
min-height: 100vh;
display: grid;
place-content: center;
}
Links
What's up man, everything's fine. So, I took a look at your solution and missed the use of semantic tags.
How can I see which font is used by the browser? -> in Dev tools under "computed" I can only see the specified font. Is there a best practice for class naming? -> I used detailed classnames like ".profile-card .profile-content .profile-socialmedia .profile-socialmedia-group .profile-socialmedia-type", is it better to keep them short? -> ".profile-card .profile-socialmedia-type"?
good job, Tip: separate your solution into an html and a css file.
Hello! I'm Daniel and this is my solution for this challenge! 😊
This project took my Javascript
skills to the next level. The design is very simple, but the many different validations were definitely a great challenge. At least for a Javascript Newbie like me. For the first time I had the opportunity to use switch case on a project. My index.js
file is a huge monster 😅! But in the end I managed to add all the required features.
I also added some extra features like a counter up animation for the age result and changed the colors.
If you have any suggestions on how I can improve this project, feel free to leave me a comment!
Feedback welcome 😊
Muito bom, parabéns. Dica: Teu js ficou muito grande dá pra simplificar. O resultado deu errado quando coloquei minha data de nascimento. Eu transformeu a data atual e data informada em milisegundos e subtrair e depois convertir em anos, meses e dias.