Pricing Component with Toggle Master (BEM, SCSS)

Community feedback

• 

  soransh singh•1,025

  @soransh-singhPosted about 3 years ago

  BEM means Block Element Modifier In your code Block will be .pricing-card

  then in .pricing-card element will be the buttons and text so you will name them .pricing-card__btns .pricing-card__text

  one card is different from the other cards so you need modify bg-clr and clr of that card then you can add modifier to it like .pricing-card--accent or something.

  Similarly you can modify btns and text by adding class card__btns--accent card__text--accent.

  you can look this link they have explained better.

  0

  ---

  

  Son Vu•100

  @anOldChildPosted about 3 years ago

  @soransh-singh Thank you for your suggestion. What I meant in my question is I already tried to write HTML with BEM, so can anyone take a look at it and comment about the way I did it. Sorry if I didn't clear myself on that.

  0

  

  soransh singh•1,025

  @soransh-singhPosted about 3 years ago

  @anOldChild yhaaa .... that is what I thought ... you have done great job with BEM and scss...

  The only thing that I would had changes is that instead of first-of-type and last-of type, I would had used a modifier class (but that's only personal preference)

  Marked as helpful

  0

  

  Son Vu•100

  @anOldChildPosted about 3 years ago

  @soransh-singh Yeah, thanks a lot for that suggestion.

  0