@engie-group/fluid-design-system-angular/src/components/modal/modal.component.html

Fluid Design System Angular

<div class="nj-modal nj-modal--visible" [ngClass]="{'nj-modal--vertical-centered': isVerticallyCentered}">
  <div class="nj-modal__dialog">
    <div class="nj-modal__content" @modal>
      <div class="nj-modal__header">
        <h1 class="nj-modal__title" [attr.id]="titleId">
          <ng-content select="[njModalTitle]"></ng-content>
        </h1>
        <nj-icon-button icon="close" size="sm" class="nj-modal__close"
                        (buttonClick)="closeModal()"
                        *ngIf="hasCloseIcon" [label]="closeLabel">
        </nj-icon-button>
      </div>
      <div class="nj-modal__body">
        <ng-content select="[njModalContent]"></ng-content>
      </div>
      <div class="nj-modal__footer">
        <ng-content select="[njModalFooter]"></ng-content>
      </div>
    </div>
  </div>
</div>