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

grid flexbox css

Rehman 280

@Abdurehman420

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


the background gave me a little trouble , I wonder If a linear gradient is used

Community feedback

Vanza Setia 27,795

@vanzasetia

Posted

Greetings, Abdurehman! 👋

Congratulations on finishing this challenge! 🎉

Regarding the background, you don't need any linear gradient. So, I would recommend changing the linear gradient with the bg-pattern and the remove the pseudo-element that contains the bg-pattern.

Some feedback on this solution.

  • I would recommend installing a code formatter like Prettier to help you format your code. Currently, the indentation and a huge amount of whitespace make your code hard to understand.
  • Not all text content needs to be a heading, so I would suggest trying to refactor the heading markup. As a hint, there is only two text content that needs to be headings. Also, you might find it helpful if you think of a heading like a title on a document.

That's it! Happy coding! 😁

Marked as helpful

0

Rehman 280

@Abdurehman420

Posted

@vanzasetia thank you soo much for the feedback

0
Rehman 280

@Abdurehman420

Posted

@vanzasetia one more thing !! the box shadows weren't working. both on container and the blue button!!

0
Vanza Setia 27,795

@vanzasetia

Posted

@Abdurehman420 I've just inspected the button and the container element and currently, the box-shadow is not valid. That is because the box-shadow contains an invalid rgba value.

box-shadow: 0 1.5rem 4rem rgba(black, 0.4);

If you need the pure black color then the rgba code should be rgba(0, 0, 0, 0.4).

Fun fact: You could actually do rgba(black, 0.4) if you are using Sass.

0
Rehman 280

@Abdurehman420

Posted

@vanzasetia oh my god these little things can actually kill someone hahaha , you see I use sass for bigger projects so that I can break the CSS into few files, and for this small project I was using CSS so I was only familiar with rgba(black, 0.4) , thank you so much again!!!

0
Vanza Setia 27,795

@vanzasetia

Posted

@Abdurehman420 You're welcome! 😁

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