add solution #4541
add solution #4541
Conversation
Fridrif27
commented
Oct 16, 2024
Fridrif27
commented
- DEMO LINK
- TEST REPORT LINK
There was a problem hiding this comment.
You're doing a fantastic job! 🎉 However, there are a few changes that need to be made in your CSS file. Remember to be consistent with your margins to avoid potential margin collapse and reconsider changing the font weight on focus. Keep up the good work! 👍
✨ Please rate this review in the Platform's notification center. I will be grateful for your feedback! ✨
| padding: 0; | ||
| margin: 20px 0; | ||
|
|
||
| font-family: Avenir, Arial, Helvetica, sans-serif; |
There was a problem hiding this comment.
Great job on using a fallback font family! This ensures that if the Avenir font doesn't load for some reason, the browser will use Arial, Helvetica, or a generic sans-serif font instead.
There was a problem hiding this comment.
Great job on implementing the fallback fonts! While there are a few minor improvements suggested, they don't impact the core functionality of your code. Keep up the good work and consider the feedback for future enhancements! 😊
✨ Please rate this review in the Platform's notification center. I will be grateful for your feedback! ✨
| > | ||
| <input | ||
| data-qa="keypress" | ||
| type="text" | ||
| placeholder="Try “Los Angeles“" | ||
| class="form__input form__input--primary" | ||
| /> | ||
| </form> |
There was a problem hiding this comment.
There should be an empty line between the two form elements to improve readability, as they are multiline sibling blocks.
| <input | ||
| data-qa="keypress" | ||
| type="text" | ||
| placeholder="Try “Los Angeles“" |
There was a problem hiding this comment.
The placeholder text contains a space within the quotes. Ensure that links or anchor tags do not contain spaces, as per the checklist.
|
|
||
| .form__input { | ||
| box-sizing: border-box; | ||
| display: flex; |
There was a problem hiding this comment.
Avoid using tag names for styling. Instead of using 'display: flex;' directly on '.form__input', consider using a class to apply this style.
| padding: 0; | ||
| margin-top: 20px; | ||
|
|
||
| font-family: Avenir, Arial, Helvetica, sans-serif; |
There was a problem hiding this comment.
It's good practice to provide fallback fonts in case the primary font fails to load. You've done this correctly by including Arial, Helvetica, and sans-serif as fallbacks.
