NgTemplate Bootstrap не принимает мой класс CSS - PullRequest
0 голосов
/ 28 марта 2019

Я создал модификацию CSS, чтобы изменить ширину модальной зоны до 50% против 100% просмотра.Но класс модального содержимого дублируется против модифицированных.

enter image description here

enter image description here

CSS

  .modal-content{
    width: 50%;
  }

HTML

<ng-template #content>
  <div class="modal-content">
    <div class="modal-header">
      <i class="fa fa-heart"></i> A
    </div>
    <div class="modal-footer">
      <i class="fa fa-heart"></i> B
    </div>
  </div>
</ng-template>

1 Ответ

1 голос
/ 28 марта 2019

Я также столкнулся с той же проблемой в моей разработке, и я нашел решение с помощью windowClass в ng-bootstrap

const modalRef = this.modalService.open(UserPasswordComponent, {
  windowClass: 'custom-modal-width' // add a custom class here where you open the modal
});

В вашем style.css контроле ширины

.custom-modal-width .modal-content {
    width: 50%;
}

обязательно удалите класс model-content из вашего шаблона

...