Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Order-Summary-Component: using HTML and Vanilla CSS (BEM method too)

@shalomkerry

Desktop design screenshot for the Order summary component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


was a good challenge. First time ever trying to implement the BEM method. My code felt a it cleaner and formal this time. I still need to practise it more tho.

Community feedback

P

@EONRaider

Posted

Hello there.

Try this shadow on the card: box-shadow: 0 40px 40px -20px rgba(13, 48, 189, 0.15);

And this one for the “Proceed to Payment” button: 0 20px 20px 0 rgba(56, 42, 225, 0.19);

The “You can now listen…” text has this color: #717fa6

Finally, the card’s dimensions should be 450x697px.

Marked as helpful

1

@shalomkerry

Posted

hey thanks @EONRaider do you know any tool that tells of the right dimension?

0
P

@EONRaider

Posted

@shalomkerry Well I'm aware of browser extensions that provide rulers and color codes but what I use is the Figma model that comes with the challenge files when you have a pro subscription. It's worth the price if you're gonna be here for a while.

Marked as helpful

0

Please log in to post a comment

Log in with GitHub
Discord logo

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