Single Price Grid Component solution

Hi Oryan,

You will find out in a short time that actually hardest coding challenges are related not to actually coding but coming up with names :D Starting from naming function to CSS classes.

The thing that helped me the most was following a standard or lets say architecture, and thats the BEM standard, which stands for Block-element-modifier. With this standard you will not have to think much as the standard it self will think for you.

You can read the docs here : https://getbem.com/introduction/ BUT basicly how it goes its you have a block in the HTML lets say <form> and some children inside <button> or <input>, the main class of the block will dictate the main name and the children or elements will be the name after the block ex. Form---button, Form--input or Form--contactButton and then the M in the BEM standard which stands for modifier will be for example if you have some modified state ex. Form--contactButton-disabled, Form--input-error.

There you go, CSS naming solved :P I hope this helped.

I will also suggest for you to try SCSS, which is just another way to write CSS. It changed my life and i would never come back to write normal CSS. :))

Hello Oryan!

I also had hard time naming classes then this article from freeCodeCamp came very handy.

You can have a look 👍🏻