add solution #4715
add solution #4715
Conversation
There was a problem hiding this comment.
Great job on your submission! 🎉 While there are a few minor issues, such as the use of the * selector in CSS and the self-closing <form> tag, these do not critically impact the functionality of your code. You've done well in meeting the core requirements, and with a few tweaks, your code will be even better. Keep up the good work and continue refining your skills! 😊
✨ Please rate this review in the Platform's notification center. I will be grateful for your feedback! ✨
| <form | ||
| class="search-bar big-search-bar" | ||
| data-qa="big" | ||
| > |
There was a problem hiding this comment.
The <form> tag should not be self-closing. In HTML, form tags should have an opening <form> and a closing </form> tag. Please remove the self-closing slash to ensure proper HTML syntax.
| <form | ||
| class="search-bar small-search-bar" | ||
| data-qa="small" | ||
| > |
There was a problem hiding this comment.
Similar to the previous form, the <form> tag should not be self-closing. Ensure it has an opening <form> and a closing </form> tag.
|
|
||
| .search-bar-input:focus { | ||
| outline: none; | ||
| font-family: Avenir-Heavy, sans-serif; |
There was a problem hiding this comment.
The font-family 'Avenir-Heavy' is not defined in the @font-face rules. You should use 'Avenir' with the appropriate font-weight to achieve the desired effect. Consider using 'font-weight: 900;' instead to apply the heavy font style.
DEMO LINK
TEST REPORT LINK
Icon implemented using background-image CSS property
Inputs are written inside of 'form' tag with correctly passed attributes
All
Typical MistakesfromBEMlesson theory are checked.Code follows all the Code Style Rules ❗️