Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

All comments

  • Daniel ๐Ÿ›ธโ€ข 44,230

    @danielmrz-dev

    Submitted

    What are you most proud of, and what would you do differently next time?

    ๐Ÿ›ธ Hello FEM Community! I'm Daniel and this is my solution for this challenge! ๐Ÿ˜Š

    ๐Ÿ› ๏ธ Built with:

    • HTML ๐Ÿงพ
    • SASS ๐ŸŽจ
    • TypeScript ๐Ÿ’Ž
    • Vitejs โšก
    • BEM Notation ๐Ÿ…ฑ๏ธ
    • Mobile first workflow approach ๐Ÿ“ฒ

    One more opportunity to practice Vite + TypeScript. Tried to make it a bit more accessible, so it's possible to complete the form using only the keyboard. Not sure if my approach was the best, but it's working.

    Again, thanks to the Front-End Mentor team that creates challenges that make us learn a lot from doing them. ๐Ÿ’Ÿ

    If you have any suggestions on how I can improve this project, feel free to leave me a comment!

    Feedback welcome ๐Ÿ˜Š

    Ki'ara Colbertโ€ข 120

    @kiaraaa123

    Posted

    This looks (and works) great, Daniel! It's so motivating to look through your solutions and see your progress over a year. Thanks for sharing your journey on here!

    Marked as helpful

    1
  • P
    FRYDPHROGโ€ข 230

    @FRYDPHROG

    Submitted

    What specific areas of your project would you like help with?

    This is my second time ever using a grid, so any advice or feedback would be appreciated :) .

    Ki'ara Colbertโ€ข 120

    @kiaraaa123

    Posted

    Great job!

    Another option for the mobile styling is:

    display: flex;
    flex-direction: column;
    

    Same result: fewer lines of code. ๐Ÿ˜Š

    0
  • Melissa Martinsโ€ข 150

    @MellTins

    Submitted

    What are you most proud of, and what would you do differently next time?

    • Proud to make the design almost identical
    • I would like to be faster at understanding the grid positions

    What challenges did you encounter, and how did you overcome them?

    • It was difficult to make the cards on the left and right stay in the middle.

    What specific areas of your project would you like help with?

    • good programming practices.
    Ki'ara Colbertโ€ข 120

    @kiaraaa123

    Posted

    Hey Melissa,

    Great job on this challenge!

    1
  • Gilbert Koomsonโ€ข 260

    @Gilbert-Koom

    Submitted

    What are you most proud of, and what would you do differently next time?

    Proud I could finish a project in a day

    Ki'ara Colbertโ€ข 120

    @kiaraaa123

    Posted

    Hey Gilbert,

    Good job on your project, and congrats on finishing it a day! I'm always excited when that happens too, lol. You did a great job but I just wanted to offer a couple of tips that might be useful in the future:

    • To differentiate the border-radius on each side, you use four values. They represent each corner going clockwise, starting from the top left. For example, for the image in this project, you would use border-radius: 10px 0 0 10px;
    • To remove the auto-styling on the button, you can use border: none;
    • Lastly, you can call button svg to add a little padding between the cart icon and the button text

    Again, you did an amazing job! Looking forward to seeing your next project in my feed.

    Marked as helpful

    1
  • Ki'ara Colbertโ€ข 120

    @kiaraaa123

    Posted

    Great job, Guilherme! The only thing I'd consider is revisiting your padding and margin. Otherwise, your solution is pretty spot-on with the original design.

    0