@JamesLaviron
Posted
- Does the solution include semantic HTML?
Yes it does, ice work here.
- Is it accessible, and what improvements could be made?
It's accessible. However you could add some aria-label to images and buttons in order to explicit what it is.
- Does the layout look good on a range of screen sizes?
Yes it does, however on mobile it seems like your image take more space than current screen width. Maybe add overflow-x: hidden;
to body in order to remove it.
- Is the code well-structured, readable, and reusable?
It is well done! I would have put text presets inside classes using @include
as many presets are linked to "common" elements such as h1/h2 tags or description class.
Moreover you could use mixins in order to use it for responsive handling such as (if you code mobile-first):
@include desktop {
[desktop styles related to class/tag]
}
That way, if you ever change a device breakpoint, you don't have to change it 25 times xD
- Does the solution differ considerably from the design?
It's very close to design. Good job mate :)
Marked as helpful
@i-prkr
Posted
@JamesLaviron Thank you so much for your comment, I have found it very helpful! Great tip particularly regarding the text presets as mixins, I will try to use that in the future :)
Appreciate your time, happy coding!