<div *ngIf="imageType!=='carousel'" class="items">
  <div class="item {{imageType}}" *ngFor="let item of items">
    <img [src]="item.links?.full" (click)="show(item.id)"/>
  </div>
</div>

<div *ngIf="imageType==='carousel'" class="carousel" id="section-{{section.id}}">
  <div class="prev">
    <img src="/assets/images/icons/chevron_left_48dp.svg"/>
  </div>
  <div class="center">
    <swiper [config]="config">
      <ng-template ngFor let-item [ngForOf]="items">
        <ng-template swiperSlide>
          <div class="slide">
            <img [src]="item?.links?.full"/>
          </div>
        </ng-template>
      </ng-template>
    </swiper>
  </div>
  <div class="next">
    <img src="/assets/images/icons/chevron_right_48dp.svg"/>
  </div>
</div>

<div *ngIf="showFullscreen" class="fullscreen">
  <div *ngIf="items?.length > 1" class="left" (click)="go('decrement')">
    <img *ngIf="backId!==''" src="/assets/images/icons/chevron_left_white_48dp.svg"/>
  </div>
  <div class="center">
    <div class="photo" (click)="showFullscreen = false"><img [src]="photo"/></div>
  </div>
  <div *ngIf="items?.length > 1" class="right" (click)="go('increment')">
    <img *ngIf="nextId!==''" src="/assets/images/icons/chevron_right_white_48dp.svg"/>
  </div>
</div>


