@evgeniy8509Submitted 20 days ago
P
Pierpaolo Pistorio
@Zelos23All comments
- @evgeniy8509Submitted 21 days agoP@Zelos23Posted 18 days ago
The project is perfect. It's nice that you keep the button disabled until user interacts with the inputs, to prevent potential bugs. Congrats!
0 - P@To-be-SunSubmitted 2 months agoP@Zelos23Posted about 2 months ago
The overall solution is very good, you can now focus to match the original design or try to experiment with a front-end framework or library. Congratulations!
0 - P@flavin-jrSubmitted 3 months agoP@Zelos23Posted 2 months ago
The solution is perfect! Fast and responsive.. Congratulations :D
0 - @luismiguelrodriguez3Submitted over 2 years agoP@Zelos23Posted 3 months ago
The overall solution is very good. To further improve it you can focus on the micro aspects of the design, such as making the arrows of the input type number disappear, and the correct rendering of the logo. Very well done and congrats!
0 - @JustinFowlerArtSubmitted over 2 years ago
- @NjeriwaweruSubmitted 3 months agoP@Zelos23Posted 3 months ago
The solution is really good and close to the design. Great work!
1 - @JeancyjrSubmitted 3 months agoWhat are you most proud of, and what would you do differently next time?
I learnt a lot of few things I'm going to apply from now on.
What challenges did you encounter, and how did you overcome them?Media query can be tough. Building mobile first and improving css knowledge can improve responsiveness. Work to do.
What specific areas of your project would you like help with?Building mobile first.
P@Zelos23Posted 3 months agoThe solution is practically identical to the design. Congratulations and keep going!
1 - P@wildchild04Submitted 3 months agoWhat are you most proud of, and what would you do differently next time?
This was not fun
What challenges did you encounter, and how did you overcome them?all the design detail are a pain to write, it was not enjoyable
What specific areas of your project would you like help with?the tablet and mobile designs were not implemented, but yeah how to organize the divs in the grid to achieve the different positions depending the size would be cool to know
- P@Bobstyle23Submitted 4 months agoP@Zelos23Posted 3 months ago
Nothing to say other than the job is really good and accurate. Congratulations!
1 - P@Bobstyle23Submitted 4 months agoP@Zelos23Posted 3 months ago
The design looks great, congrats! There is a very little detail that I point at you as a stretch goal and fun challenge: the top colored border of the cards looks a bit different than the original design. You have multiple solutions to manage this, for example consider using pseudo elements like ::before. Again very well done!
0 - @b16h22Submitted 6 months agoWhat challenges did you encounter, and how did you overcome them?
Using CSS Flexbox to switch the flex direction when switching between desktop and mobile screen proved tricky with more complex layouts. The paddings and margins took some fettling to be perfected to work with flexbox and responsive layout design.
P@Zelos23Posted 6 months agoI can spot almost no differences between design and solution, very accurate. Well done! 👍
Marked as helpful1 - @TheTrueScoutSubmitted 6 months agoWhat are you most proud of, and what would you do differently next time?
I implemented some of the advice given to me on my last few challeges, and i would like to know if i did better this time :).
What specific areas of your project would you like help with?-
The list elements. I took a very round about way to fix two things- one of them being changing the width of the bullet points. I used
li:marker { width: 0.3rem; }but it did not change the size. the second thing was the space between theliand the text. For both theoland theul, I used the pseudo element::beforeto make that space(and changing the size of the bullets), but it got much more complicated with theoland the code got longer than I'd have wanted it to. If there's a better way to fix these, please tell me. -
Is there a way to increase space between
lielements without turningulorolinto flex elements? I don't thinkgap:works without flex( I could be mistaken.)
P@Zelos23Posted 6 months agoThis feels really good and accurate. The use of the :marker pseudo-selector is correct in my opinion, you can try to style the bullet by changing font size instead of width and see if the outcome is similar, but visually to me seems ok. to make space between bullets and the element i did just with padding left in the ul/ol and in li elements without the pseudo elements sure there are many other ways but in this case i thought it would be a good compromise. Don't know if there is a way to achieve the spacing needed automatically without flex, maybe with hard coded values and eye tuning; and yes gap is a property enabled by flex containers. Great job by the way, congrats!
1 -
- @phucb2103436Submitted 7 months agoP@Zelos23Posted 6 months ago
Good job! I would take a look to the max-width of the card starting from mobile through desktop layout. According to the design the width grows until the tablet layout then shrinks again through desktop. Final note, you can consider to center vertically the card relative to the viewport and you're really good to go! congrats!
Marked as helpful0 - @codebyMMSubmitted 7 months agoP@Zelos23Posted 7 months ago
Very good overall! you can add a border around the card and higher line height and spacing through the content. Congrats!
Marked as helpful0 - P@fraserjubbSubmitted 7 months agoWhat are you most proud of, and what would you do differently next time?
- This was my first Frontend Mentor challenge! Feels great finally reaching this stage in my learning journey.
- This project also finally made me sit down and look at Markdown syntax. This meant that I finally created my own README on my GitHub profile too. Another useful step!
-
I wanted to add the focus/challenge of using CSS variables as I had never used them before up until this point. Even though they are a little redundant on a smaller project, this felt like a great opportunity to learn it. I now have a much better understanding of how they work and can see their benefits on larger projects.
-
This was my first project that involved using a Figma file for reference. It was a little overwhelming at first but I have managed to grasp the basics of navigation, this became easier the longer I used it.
-
I would like to increase my understanding of Figma, particularly navigation. This will likely come through further practice in future projects. If anyone has any learning resources to help aid this I would appreciate it.
-
Any issues with my code or other feedback would be much appreciated!
