Result Summary Componenet

Hi, @Ajaya-Rajbhandari

I reviewed your solution and wanted to share some feedback:

• Your solution is missing key components from the design, such as the Reaction, Memory, Verbal, and Visual parts. Additionally, the font-family URL in your style.css is incorrect. It should be https://fonts.googleapis.com/css2?family=Hanken+Grotesk:[email protected]&display=swap instead of https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@400;700&display=swap.
• If you don't have a responsive design strategy in place, consider researching the mobile-first approach. Mobile-first is a responsive design strategy where you begin the design and development process with mobile devices in mind, ensuring that the website looks good on smaller screens first. Once that's done, you use media queries to progressively enhance the layout for larger screens like tablets and desktops. This strategy ensures a better experience on mobile devices, which are now more common.
• For naming conventions, I suggest looking into the BEM methodology for CSS and using camelCase for JavaScript.
• Regarding your point on adding comments: good class, variable, and function names should be self-explanatory. Focus on clear naming unless something is particularly complex and needs clarification.
• For accessibility, I'd recommend researching semantic HTML. Don't stress about color contrast for now—those concerns are more design-related. As for ARIA attributes, I don't think they need to be a priority at this stage. Focus on nailing the design first.

It seems like you have more questions, but from my perspective, your solution is currently incomplete. The goal of Frontend Mentor is learning, not just earning points. It feels like you're rushing through the process. Take your time to match the design as closely as possible, and we can dive into other topics later.

Hope this helps!