add task solution #4738
add task solution #4738
Conversation
There was a problem hiding this comment.
It looks like there are a couple of critical issues that need to be addressed before we can proceed. The self-closing <form> tag in your HTML is not valid and can affect the functionality of your form. Additionally, the box-shadow property in your CSS needs to be defined with a complete value to ensure it works as expected. Once these are fixed, your code will be in great shape! Keep up the good work, and don't hesitate 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.
| data-qa="keypress" | ||
| placeholder="Try “Los Angeles“" | ||
| /> | ||
| <form |
There was a problem hiding this comment.
The <form> tag is incorrectly self-closing. In HTML, form elements should not be self-closing. Ensure to open and close the <form> tag properly.
src/style.css
Outdated
| font-family: Avenir, sans-serif; | ||
| font-weight: 700; | ||
| outline: none; | ||
| box-shadow: var(--hover-shadow); |
There was a problem hiding this comment.
The box-shadow property in the .search__input:focus selector is currently set to var(--hover-shadow), which is just a color value. Ensure that box-shadow is defined with a complete value, including offsets and blur radius, like 0 4px 4px 0 var(--hover-shadow).
There was a problem hiding this comment.
Review Summary
Great job on addressing the previous issues with your HTML and CSS files! 🎉 Your current implementation meets the task requirements and constraints. Here are some key points to consider for future improvements:
-
HTML File:
- You've successfully corrected the
<form>tags, ensuring they are not self-closing. This is crucial for the proper functionality of your forms. Keep up the good work!
- You've successfully corrected the
-
CSS File:
- The
box-shadowproperty is now defined with a complete value, which is essential for achieving the desired visual effect. Remember to always include all necessary parameters for CSS properties.
- The
While the decision is to APPROVE your Pull Request to help you move forward with your learning, please review the comments to further improve your code. Addressing these critical issues in the future will enhance your coding skills and prevent similar problems. Keep learning and refining your skills! 🚀
✨ Please rate this review in the Platform's notification center. I will be grateful for your feedback! ✨
| <form | ||
| class="search search__big" | ||
| data-qa="big" | ||
| > |
There was a problem hiding this comment.
The <form> tag should not be self-closing. It needs an opening <form> tag and a closing </form> tag to properly encapsulate the form elements.
| <form | ||
| class="search search__small" | ||
| data-qa="small" | ||
| > |
There was a problem hiding this comment.
Similar to the previous form, this <form> tag should not be self-closing. Ensure it has a proper opening and closing tag.
| } | ||
|
|
||
| :root { | ||
| --box-shadow: rgba(61, 78, 97, 0.1); |
There was a problem hiding this comment.
The --box-shadow variable is defined with only a color value. The box-shadow property typically requires at least the horizontal and vertical offsets, and optionally the blur radius, spread radius, and color. Consider defining --box-shadow with a complete value, such as 0 1px 8px 0 rgba(61, 78, 97, 0.1).
DEMO LINK
TEST REPORT LINK