angular2-boiler-plate/src/app/sui/sui.modal/sui.modal.component.html

Angular 2 Boiler plate that integrated with WebPack, TypeScript, DatePicker, RxJs for Reactive Extensions in Java Script , Karma , Jasmine for unit testing , WebKit ,protractor e2e testing

<div [@modal] *ngIf="visible" class="sui-modal">
    <div class="sui-modal-content">
        <header class="{{'sui-padding-left '+cssClassHeader}}">
            <button *ngIf="closable" (click)="close()" aria-label="Close" class="sui-closebtn">X</button>
            <h3> <i class="{{headerIcon}}"> </i> {{headerText}}</h3>
        </header>
        <div class="sui-container sui-margin-top">
            <ng-content></ng-content>
        </div>
        <br/>
    </div>
</div>
<div *ngIf="visible" class="sui-overlay" (click)="close()"></div>