Submitted almost 4 years ago

Responsive component

@tix04

A solution to the Order summary component challenge

Solution retrospective

Just starting out on frontendmentor and this is my first challenge. Can anyone rate my project from 1 -10 and send me any feedback on any errors you find or any improvements I can make. Whether it is on my naming conventions, How clean my code is, or just improvements to help me become a better developer. Thank you for your time!!

Code

Please log in to post a comment

Community feedback

Mohamed ELIDRISSI•435
@elidrissidev
Posted almost 4 years ago
Great start Jaonary! Definitely not bad for a first challenge. Keep it up! Here are some suggestions for you:
- Avoid using pixels, especially for things like font-size, margin, padding, width, height etc. Reason being is that they don't scale with your browser's font size setting. To verify this, try increasing your browser's font size from 16px to something like 20px and do a comparison between your solution and this site. See how in your solution nothing changes, while in frontendmentor the page sort of zooms in a bit? There will be special occasions where this won't matter, but as a general advice I will suggest that you look into rems and ems.
- Decorative images that don't add anything to the page content can have an empty alt text as per the W3C Web Accessibility Initiative:
Decorative images don’t add information to the content of a page...In these cases, a null (empty) alt text should be provided (alt="") so that they can be ignored by assistive technologies, such as screen readers.
- A very small detail but I'd add a cursor: pointer to the "Proceed to payment" button to give the feedback that it's clickable.
That's all I have. Good luck to you!

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord