Skip to content
Submitted 3 months ago

Four card feature section solution with ❤️ react & tw ❤️

Rastislav Hepner•180
@raswonders
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Four card feature section
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?

I'm proud of finishing some grid theory before starting challenge.

What challenges did you encounter, and how did you overcome them?

Applying different bg color on card stripes was little awkward on dynamically created elements, but I've managed with use of array of predefined tw classes. Also realizing that i can center grid elements easier with odd: tw modifier was cool.

What specific areas of your project would you like help with?

Anything really. Something is inaccessible? Weird or clunky? Let me know. Thx 🙏

Community feedback

  • Ian Parker•200
    @i-prkrPosted 3 months ago

    This was a great solution to look at, and interesting to see the use of React and Tailwind for it! The only suggestion that came to mind was that while doing this solution I discovered the element <hgroup> and found this a good use case for it. Thanks for the solution!

    1
    Rastislav Hepner•180
    @raswondersPosted 3 months ago

    @i-prkr

    Hi thank you for bringing hgroup to my attention, wasn't really aware of it. I'm fascinated by the fact this tag became obsolete and then came back to standard. I'm not sure if it's widely used but sounds like a nice wrapper for title and tagline.

    1
  • Vutlhari Shiburi•100
    @Exterminator737Posted 3 months ago

    Good

    0
    Rastislav Hepner•180
    @raswondersPosted 3 months ago

    @Exterminator737 what should i do to make it great? 🙃

    0
    Vutlhari Shiburi•100
    @Exterminator737Posted 3 months ago

    @raswonders I think you should just swap the calculator and karma cards around, then it'll be perfect 👌

    1
    Rastislav Hepner•180
    @raswondersPosted 3 months ago

    @Exterminator737

    Thank you good sir I fixed it.

    0

Please log in to post a comment

Log in with GitHub

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