Single price grid component

Hello Kalhara Sandaruwan !

Congratulation for finishing this project

I have some suggestion to make :

1. You used an hover effect for you button, which is a good idea to make your page less rigid, maybe you could also add a little variation of color for the button !

2. You didn't add a box shadow to your button, it would add some depth to it. A basic example of a box-shadow :

.btn {
  display: inline-block;
  color: white;
  background: var(--Bright-Yellow);
  padding: 0.8rem 1rem;
  border-radius: 0.3rem;
  width: 100%;
  text-align: center;
  font-weight: 700;
  transition: var(--transition);
  box-shadow: 2px 3px 2px black;
}

I give you a link to learn more about box-shadows :

• MDN Box Shadow

Otherwise, you did a good job !

I hope it helps you, keep learning and happy coding !

👾Hello Kalhara Sandaruwan, Congratulations on completing this challenge!

Your solution its almost done and I’ve some tips to help you to improve it. TWO TIPS:

1.Add the box-shadow that you've missed, the value is: box-shadow: 0rem 0.625rem 0.625rem rgb(1 56 45 / 30%);If you’re not familiar to box-shadow you can use this site to create the shadow design and then just drop the code into the CSS: https://html-css-js.com/css/generator/box-shadow/

2.You've used h3 instead of h2, increase the headings by one level, like h1, h2, h3 to show the titles hierarchy. Remember that you cannot have more than one h1 heading.

✌️ I hope this helps you and happy coding!