Stars solution

[schyrva]

• Yellow stars are added with container modifier + pseudo-selector (NO extra classes)
• Each BEM block has its own separate file
• All Typical Mistakes from BEM lesson theory are checked.
• Code follows all the Code Style Rules ❗️

[mateacademy-ai-mentor]

Hey there! You've done a great job overall, but there are some issues that need to be addressed. There's an extra body tag in your HTML document and it's important to remember that there should only be one body tag in a HTML document. Also, consider using semantic tags more effectively and avoid using the * selector as it impacts performance. Keep up the good work! 👍

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

[mateacademy-ai-mentor]

You have a body tag inside another body tag. This is not valid HTML. There should only be one body tag in a HTML document. Please remove the extra body tag.

[mateacademy-ai-mentor]

Here is the closing tag for the extra body tag. Please remove it.

[mateacademy-ai-mentor]

It's great that you're using semantic tags such as section, but the content inside these sections are not semantically clear. Consider adding some descriptive text or alternative content to give more context about these sections. If the div elements are meant to be visual representations, consider using span with appropriate classes or ids.

[mateacademy-ai-mentor]

Avoid using the * selector as it impacts performance. It's better to set styles only for elements that require them.

[mateacademy-ai-mentor]

Remember to use fallback fonts - alternative font-family in case the main one doesn't work.

[mateacademy-ai-mentor]

Good job on the HTML structure and use of meaningful class names. There are a few points to improve - consider using a CSS preprocessor for more efficient code and avoid using the '*' selector for better performance. Keep learning and improving! 🚀

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

[mateacademy-ai-mentor]

It's recommended not to use '*' selector as it impacts performance. It would be better to set styles only for elements that require them.

[mateacademy-ai-mentor]

This part of the code is a bit repetitive. You could use a CSS preprocessor like SASS or LESS to loop through these classes and generate them dynamically. This would make your code DRY (Don't Repeat Yourself), easier to maintain and less prone to errors.