add task solution

[lizbarkovska]

• DEMO LINK
• TEST REPORT LINK
• 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]

Great job on using CSS imports correctly! 👍 I'm approving your Pull Request as there are no critical issues with your code. Remember to keep an eye on consistent margins, use classes for styling, format your attributes neatly, leave empty lines for readability, and maintain consistent indentation. These tips will help you write even cleaner and more maintainable code! 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]

There should be empty lines between multiline sibling blocks of HTML to improve readability. Please add empty lines between the

blocks that have the class 'stars'.

[mateacademy-ai-mentor]

The attributes of the tag should be formatted correctly with each attribute starting on a new line and with 2-space indentation related to the tag. The tag’s closing bracket should be on the same level as the opening one.

[mateacademy-ai-mentor]

According to the checklist, avoid using tag names for styling (except html and body). It's recommended to style elements using .classes. If .page is a class applied to the body or html tag, this is fine. Otherwise, consider using a class for styling specific elements.

[mateacademy-ai-mentor]

Be consistent with your margins (Add only top or bottom, but not both). In this case, you are adding both right and bottom margins to the .stars__star class. It's better to stick with one direction to avoid potential margin collapse issues.

[anastasiiavorobiova]

Great work! Almost done!

[anastasiiavorobiova]

Suggested change

	.stars--1 :first-child {
	.stars--1 :first-child,
	stars--2 :nth-child(-n + 2),
	... {

Consider using commas to group selectors

[anastasiiavorobiova]

Suggested change

margin-bottom: 4px;