add task solution

[renatoveludo]

• DEMO LINK

• TEST REPORT LINK

• [] Header height is set in 1 place (for the links)

• Content is vertically centered (for any header height)

• CSS is used to show all letters in Uppercase (don't type them in HTML)

• Logo is an image wrapped with a link

• CSS Variable is used for a blue color

• Pseudo-element is used for a blue line below the active link

• Code follows all the Code Style Rules ❗️

[mateacademy-ai-mentor]

Thank you for your submission! 🎉 While your code does not fully meet the task requirements, this decision is made to help you move forward with your learning journey. Please review the following key points to improve your code:

1. Semantic Tags: Ensure to use semantic tags like <ul> and <li> for navigation items instead of <div> for better accessibility and structure.

2. Logo Link: The href attribute in the logo's anchor tag should link to a webpage, such as the homepage, rather than an image file.

3. CSS Variables: Define and use a CSS variable for the blue color as specified in the task requirements.

4. Pseudo-element for Active Link: Correct the implementation of the pseudo-element for the active link to match design specifications, ensuring the border-style is used correctly.

5. HTML Formatting: Maintain consistent indentation using 2 spaces throughout your HTML file.

6. CSS Selector: Avoid using the universal selector * due to potential performance impacts.

7. Class Naming: Use meaningful class names that represent the content rather than styles or tag names.

8. Link Hover Effect: Ensure the link hover effect aligns with the design specifications.

9. Missing Files: Verify that all required images are included in the project directory as mentioned in the task description.

Addressing these issues will enhance the functionality and maintainability of your code. Keep up the good work and continue to learn from these experiences! 🚀

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

[mateacademy-ai-mentor]

The 'crossorigin' attribute should be set to 'anonymous' or 'use-credentials'. '0' is not a valid value for this attribute.

[mateacademy-ai-mentor]

The 'border-style' property should not have a value like '10px solid'. It should only specify the style of the border, such as 'solid', 'dashed', etc. If you intended to set a border width, use 'border-width' instead.