Сергей delphinpro

.wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.element {
  width: 20%;
  text-align: center;
}

.slick-slide {
  transform: scale(0.8);
  transition: transform 0.8s ease;
}
.slick-active {
  transform: scale(1);
}
.slick-active + .slick-slide {
  transform: scale(0.9);
}
.slick-active + .slick-slide ~ .slick-slide {
  transform: scale(0.7);
}

@foreach($reviews as $review)
<li>
    <h6 class="comment-name">{{ $review->user->name }}</h6>
    <div class="content">
    <p>{{ $review->content }}</p>
    <div class="comment-content-right">
      <a href="#" onclick="openReplyModal({{ $review->id }})">Ответить</a>
    </div>
    </div>
</li>
@endforeach

<div id="modal-reply">
  <form>
    <input type="hidden" name="review_id" id="review-id-field">
    <div class="modal-body">
      <textarea name="content"></textarea>
    </div>
  </form>
</div>

function openReplyModal(reviewId) {
  document.getElementById('review-id-field').value = reviewId;
  
  // Bootstrap 4
  $('#modal-reply').modal('show');

  // Bootstrap 5
  const modal = new bootstrap.Modal(document.getElementById('modal-reply'), {});
  modal.show();
}

<div class="header__phone">
   <a href="tel:+74999228974">
      +74999228974
   </a>
   <button class="button">заказать звонок</button>
</div>

<input type=checkbox>
<label>Checkbox</label>

input[type=checkbox]:checked + label {
}

/dist
  /scss
    main.scss - отслеживается
    /blocks
      header.scss - не отслеживается

gulp.watch('./dist/scss/**/*.scss', gulp.series('sass'));

<div class="section">
  <div class="container">
    <div class="slider">
      
    </div>
  </div>
</div>

.section {
  overflow: hidden;
}
.container {
  width: 1000px;
  margin: auto;
  padding: 10px 0;
  background: green;
}
.slider {
  height: 100px;
  background:red;
  width: calc(50% + 50vw);
}