<div class="container dialog" #container>
    <div class="tags">
        <div class="contents" *ngFor="let type of card.types" >
            <div [class]="[type, 'icon']" *ngIf="type !== 'normal'"></div>
        </div>
    </div>
    <div class="main" *ngIf="!flipped">
        <div class="contents" #frontSide>
            <h6>{{card.name}}</h6>
            <div class="img-fitter" [style.background-image]="'url(\'' + card.imageUrl + '\')'">
            </div>
        </div>
    </div>
    <div class="info" #backSide *ngIf="flipped">
        <div class="contents" *ngFor="let paragraph of card.info">
            <h6 class="small">{{paragraph.heading}}</h6>
            <p class="small">{{paragraph.content}}</p>
        </div>
    </div>
    <button igxButton igxRipple (click)="flip()">Обърни</button>
</div>