add product-card

[AnoriFrell]

• DEMO LINK

• TEST REPORT LINK

• there 2 BEM blocks card and stars each in their own file

• SCSS Nesting is used for elements, modifiers and pseudo-classes

• SCSS Variables are used for main values and placed in a separate file

• all stars--N modifiers work as expected (Highlight first N stars)

• Code follows all the Code Style Rules ❗️

[mateacademy-ai-mentor]

---

Thank you for your hard work on this project! 😊 While your solution is on the right track, there are a few critical issues that need to be addressed before we can approve the pull request.

1. BEM Blocks: The task requires separate files for the card and stars BEM blocks. Currently, the stars block is integrated into the card block within the index.scss file, and there is no separate file for the stars block. This is a core requirement that needs to be resolved.

2. SCSS Variables: The task specifies that SCSS variables should be placed in a separate file. Currently, they are defined within the index.scss file. Moving them to a dedicated file will enhance maintainability and is necessary to meet the task requirements.

3. Stars Modifiers: The implementation of stars--N modifiers is missing. These modifiers are essential for highlighting the first N stars, as specified in the task requirements.

These issues are critical as they directly relate to the core requirements of the task. Once these are addressed, your solution will be much stronger. Keep up the great work, and feel free to reach out if you need any help! 🌟

✨ Please rate this review in the Platform's notification center. I will be grateful for your feedback! ✨

🔄 Fix the issues, commit the changes, and then re-request my review using the Re-request review button in the Reviewers tab.

[mateacademy-ai-mentor]

The font-size value should include a unit (e.g., 'px', 'em'). Currently, it is missing, which might lead to unexpected behavior.

[mateacademy-ai-mentor]

The border-radius value should include a unit (e.g., 'px'). Currently, it is missing, which might lead to unexpected behavior.

[mateacademy-ai-mentor]

The font-size value should include a unit (e.g., 'px', 'em'). Currently, it is missing, which might lead to unexpected behavior.

[mateacademy-ai-mentor]

Great job on your progress so far! 🎉 While there are a few areas that need improvement, such as separating the stars BEM block into its own SCSS file and moving SCSS variables to a dedicated file, your effort is commendable. These changes will enhance the maintainability and organization of your code. Remember to implement the stars--N modifiers to meet the task requirements fully. Keep up the good work, and use this feedback to refine your skills. Addressing these issues will help you avoid similar problems in the future. Keep learning and improving! 💪

✨ Please rate this review in the Platform's notification center. I will be grateful for your feedback! ✨

[mateacademy-ai-mentor]

Ensure that the SCSS file linked here (index.scss) is structured according to the task requirements. Specifically, check that the card and stars BEM blocks are in separate files, and SCSS variables are placed in a dedicated file.

[mateacademy-ai-mentor]

The SCSS variables should be moved to a separate file dedicated to variables, as per the task requirements. This will enhance maintainability and organization.

[mateacademy-ai-mentor]

The stars BEM block should be moved to a separate SCSS file. The task requires separate files for each BEM block, which helps in maintaining a clear structure and organization.