Victory• 70
@preciousvictory
Submitted
I just finished this challenge and I know there are lot of things that I still need to learn and improve on especially JS. Please review.
NadiaFr
@NadiaFrShLm
All comments
- NadiaFr• 310
@NadiaFrShLm
Posted
I just finished it also and what can I add at a first glance, the pattern at the left side that you added with background-image: url(); if you also add: { background-position: center; background-repeat: no-repeat; background-size: cover; } the pattern will cover left side with right proportions at any screen with.
Marked as helpful
0 - Shaina Khan• 220
@shainay
Submitted
Feedbacks are always welcome. Feel free to give any feedbacks. and let me know where I messed up. Happy Coding...!
NadiaFr• 310@NadiaFrShLm
Posted
I think that box-shadow should be much less visible. Especially at the top of the card in your case -> box-shadow: 0px 0px 14px 14px #00000024; /* offset-x | offset-y | blur-radius | spread-radius | color */ I'd leave 'offset-y' and 'blur-radius' . You can play around with box-shadow using online generator, like this one https://html-css-js.com/css/generator/box-shadow/
0 - Louise Norrsén• 140
@louisenorrsen
Submitted
Feedback are very welcome!
NadiaFr• 310@NadiaFrShLm
Posted
Excelent match with design! How did you manage to make all the spacing and sizes to match perfectly?
0 - Sebastian Fuentes• 170
@sfuentes-dev
Submitted
Hello Frontend Mentor community, this is my solution to this challenge. I hope you like it and any comment to improve my code is welcome, every feedback is very appreciated.
NadiaFr• 310@NadiaFrShLm
Posted
Hi, I just finished the same challenge. And I noticed on your screenshot that the colour of the borders at the top of each cards are rounded at the ends. They have the same curve as rounded corners of each card. But at the exemple they are straight.
I resolved this isue by adding the empty component to the card component
<span class="border green-border"></span>
and in css gave an absolute position : .border { position: absolute; top: 0; left: 0; width: 100%; height: 4px; }
Marked as helpful
0
