Order summary card using HTML and CSS (Sass)
Design comparison
Solution retrospective
I’m most proud of how effectively I applied SCSS mixins and variables to keep the code organized and maintainable, which made adjustments much easier. If I were to approach this project again, I’d experiment more with CSS Grid to refine the layout structure further and add more interactive elements to enhance the user experience. It’s rewarding to see my code becoming cleaner and more efficient with each project!
What challenges did you encounter, and how did you overcome them?One of the main challenges I encountered was adjusting the size of each element to match the design specifications precisely. I spent a lot of time tweaking dimensions, padding, and margins to ensure everything aligned perfectly. To overcome this, I relied heavily on SCSS mixins and variables, which made it easier to apply consistent sizing across elements and quickly make adjustments as needed. This experience taught me the importance of setting up a flexible and modular style system from the beginning.
What specific areas of your project would you like help with?I’d appreciate guidance on implementing ARIA attributes and roles to improve accessibility. While I used basic ARIA labels in this project, I’d like to understand how to apply a broader range of ARIA roles and attributes effectively to make my projects more accessible and user-friendly for individuals who rely on assistive technology.
Community feedback
Please log in to post a comment
Log in with GitHubJoin 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