Как следует называть модификаторы разных размеров шрифтов по БЕМу?

Question

[CoolStory]

Есть блок. Есть элемент внутри этого блока. Внутри этого элемента есть текст с несколькими размерами шрифта. Так вот, как следует называть модификаторы этих размеров?

block__title-text--large, block__title-text--medium и block__title-text--small слишком обширные названия. Например, в тексте используются такие размеры шрифтов: 90px, 80px, 60px, 30px, 10px. Что из них large, medium и small? А как называть тогда остальные размеры, не писать же что-то типа --super-mega-ultra-large для 90px и --super-mega-large для 80px?

Answer 1

[Никита Михайлов]

Например, в тексте используются такие размеры шрифтов: 90px, 80px, 60px, 30px, 10px.

ИМХО стоит пересмотреть дизайн. Не похоже на норм ситуацию.

block__title-text--small

В этом и будет прелесть. Если значение изменится, то не придётся бегать и переписывать классы.

Всё таки советую найти опорные точки, и получить потом модификаторы а-ля small-x2, medium, medium-x2 и так далее

Answer 2

[Realetive]

С чего вы взяли, что размер шрифта «наследуется» от элемента? Может, это h-заголовок и font-size закономерно «проистекают» от размера заголовка?

<article class="cart">
  <h3 class="heading heading_size_xxl cart__title">Очень крупный заголовок 90px</h3>
</article>

<article class="cart">
  <h3 class="heading heading_size_xl cart__title">Крупный заголовок 80px</h3>
</article>

и т. д.

Рассуждать о БЭМ без дизайна — как чинить компьютер «по фотографии».

Answer 3

[Kirill Makarov]

А что мешает например создать отдельные классы в файле text.scss ну или что вы там используете, и написать text-sm text-md и так далее