Answer the question
In order to leave comments, you need to log in
How do you use repeating text elements in BEM?
Let's say there is a site that has a bunch of different blocks / sections and all of them have the same titles, subtitles, text blocks, links, and so on. These elements sometimes differ only in font size or color.
For now, I’m making my own &__title, &__text, &__link for each block / section, and if I need variations in terms of styles, then I add modifiers to them.
But all this violates the DRY principle, since you have to repeat the same code. In this case, I began to use scss placeholders (but I'm thinking of abandoning them and switching to mixins, for now it's a moot point).
Am I doing everything right? There was also an idea to simply make each such text element an independent block/component and insert it into different blocks/sections, but it seems to be not canon.
Answer the question
In order to leave comments, you need to log in
<div class="block1">
<div class="block1__title title">Title</div>
</div>
<div class="block2">
<div class="block2__title title">Title</div>
</div>
<div class="block3">
<div class="block3__title title title_size_large">Title</div>
</div>
<div class="block3 block3_theme_dark">
<div class="block3__title block3__title_inverse title">Title</div>
</div>
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question