@PatricioZarauz
Posted
First off, let me congratulate you on the challenge you did, it's great and looks identical!
After reviewing your code, I have a small number of tips to give so you can have it in mind for a next challenge.
- When using colors in your scss, you can define a variable as following:
$dark_blue:hsl(218, 44%, 22%);and then use$dark_blueanywhere you want. - Instead of using position absolute for the footer, you could use a grid template, for your layout. Since if the screen is short enough, the footer and the card starts to overlap and it's not readable. In this case it would be better for the user to scroll and see everything correctly.
Regarding your question on how you can make it accessible, you can use the axe DevTools plugin in order to get accessibility recomendations for your page, in your case the only issues are with the footer that you added, that it doesn't meet the minimum contrast requirement.
I insist, you did great job! and I would like to get some tips from you on how you were able to get the exact measurements of everything, since I couldn't :(
Marked as helpful
@itsmesrishti
Posted
@PatricioZarauz Thank you so much for the detailed review! You gave such great tips! I'll try to implement them all in my next project!
For the exact measurements there was the figma design file provided with the project so I used that. There's also this Dimensions extensions that's helpful too sometimes!
Again, thank you for reviewing and leaving actionable tips!
