Skip to content
Submitted over 5 years ago

Completed Using Atom (HTML, CSS and Bootstrap)

Vaibhav Chandak•200
@Vaibhav-chandak
A solution to the Huddle landing page with curved sections challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Please write a feedback. I think that the code needs abstraction. Really struggled for the background. The way I chose to make the curves is correct or I should have done this in a different manner?

Code

Please log in to post a comment

Log in

Community feedback

  • Matt Studdert•13,611
    @mattstuddert

    Hey Vaibhav, nice work on this challenge. As far as abstraction goes, you could definitely re-write your CSS slightly to make some more reusable classes. For example, for the .bg-* classes you're often repeating background-size: contain; background-repeat: no-repeat; height: 10rem;. For these common styles, you could just create a single class and add that class to the necessary elements.

    Also, using an empty div for the background images is fine. Another way, which I prefer, would be to use a pseudo-element, like ::before to add the curve detail. This leads to less HTML code, which is cleaner.

    Let me know if you have any questions. Keep up the great work!

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord