@vanzasetia
Posted
Hey, Éric Férole! 👋
Congratulations on finishing this challenge! 🎉
I won't recommend separating the CSS unless you have a good reason to do it. Since you are using Sass, I recommend organizing the Sass files instead. And, yeah, you can use the "7-1 architecture" approach to structure your Sass files.
I have some feedback on this solution.
- Remove the word "logo" from the alternative text for the logo. Avoid having any words that are related to the word "image" whenever you are writing the alternative text for images. The semantic meaning of the
img
element is already enough. - Not every image needs alt text. If the image does not provide any meaningful content, such as an illustration, consider using empty alt text (
alt=””
). This saves your screen reader users time as they navigate the page. - There should not be text in
span
anddiv
alone whenever possible. Instead, wrap the text with a meaningful element like a paragraph element. - Always specify the
type
of thebutton
. It will prevent the button from behaving unexpectedly. - In your CSS, I noticed this selector
.cards .card__header .card__description
which would much be as.card__description
. I recommend only nesting when you want to style pseudo-elements, pseudo-classes (:hover
,:focus
, etc), and@media
queries. It's a good practice to keep the CSS specificity as low and flat as possible. High specificity will make your stylesheet hard to maintain.
I hope this helps! Happy coding! 😄