Hi, I'm new to BEM and are refactoring a legacy codebase. I still have trouble deciding which ones are Blocks and which one are Elements.
The docs says that Blocks are for independent stuffs but Elements are for those who are dependent on the blocks.
And to my question:
Suppose I have a card. I currently always use cards inside card-list. However, in the future, I might use cards outside card-list. I don't know if I will ever do such thing or not. Do I make card an element of card-list block, or do I keep them independent, and is there a sort-of rule of thumb to figure this out?
I currently have several different ways of writing it and I wonder which one would be the most BEM-ish.
<div class="card-list"> <div class="card-list__card"> <div class="card-list__card"> </div>
<div class="list list--type-card"> <div class="card list__item"> <div class="card list__item"> </div>
<div class="card__list"> <div class="card"> <div class="card"> </div>
Thank you very much.