How to split into bam?

Question

BEM

I am building a slider that has controls for switching slides, the slides themselves and their components (slide name, description, etc.). How to properly organize the layout taking into account bam?

1. The block is our .slider, and the elements are .slider__slide, .slider__arrow, .slider__arrow_left, .slider__slide-title, etc.
2. .slider is a block. The elements of this block are .slider__arrow. A slide is also a block with .slide__title, .slide__desc

elements.

Answer 1

<div class='slider'>
  <h1 class='slider__title'></h1>
  <div class='slider__container'>
    <h2 class='slider__title-container'><h2>
    <p class='slider__subtitle-container></p>
    <div class='slider__container-image'>
      <img class='slider__img' />
      <p class='slider__img-subtitle'></p>
    </div>
  </div>
</div>