Hello fellow developers,
Here is my first advanced challenge, It took me a week to bring it together.
I appreciate all feedback, tell me what you think.
I am a react beginner, I will appreciate tips and advices to better my code... Thanks
Wow!! This is so awesome.
You did a fantastic job from the animations to the light and dark themes to the filters and responsiveness. I will definately take time to learn how all this was achieved from your repo. And congrats for submiting your guru solution.
Hi
You did a very nice job on following the design... Well done. Try to increase the font sizes a little bit to match the design. Add more padding on the buttons to appear bigger as in the design. Increase the size of the mockup image and add more space between sections to allow more breathing of the design like in the original one.
Overall, you did a great job!!
Hi Saif
I did not find the exact shadow used on the design, but I made one more subtle with more blur and less opacity. box-shadow: 0px 0px 34px -2px rgba(0,0,0,0.27);
You can use CSS box shadow generators online to create your own better version.
Hi MrSamich
You have done well on the centering of the design to match the original design... You could imrove on your design by using the original colors, forexample using the lighter background provided. lower the top bottom padding of left-section class to make it fit the height of the image, add some border-radius on the pieces to match the design.
Also you can try to add a colored semi-transparent overlay on the image to change the black and white to match the one on the original design.
Hi zyryle
I liked your approach of using flex and 100vh... You did a pretty good job in centering the boxes, and the design looks good
You could improve on it by adding a little bit more padding on the inner elements to provide some more space inside the centered box to match the design even more. Like on the boxes class.
