Files
wieerwill.github.io/angular/src/app/components/certificates/certificates.component.html

26 lines
1.1 KiB
HTML

<mat-card class="content-container bg-primary text-white" style="border-radius:20px;">
<mat-card-title>
<h1 class="my-3 display-1 text-center">
<span style="color:#ffffff">C</span><span style="color:#bebdff">ertifications</span>
</h1>
</mat-card-title>
<mat-card-subtitle>
<p class="mb-5 lead text-center">"What is a piece of paper else a note in time?"</p>
</mat-card-subtitle>
<mat-card-content>
<mat-grid-list cols="5" rowHeight="1:1">
<mat-grid-tile class="cert-container {{certificate.category}}" *ngFor="let certificate of certificates" (click)="showModal(certificate.category+'/'+ certificate.title +'.jpg')">
<img src="../../../assets/Zertifikate/{{certificate.category}}/{{certificate.title}}.jpg" class="cert-img">
<p class="overlay">{{certificate.title}}</p>
</mat-grid-tile>
</mat-grid-list>
</mat-card-content>
</mat-card>
<div id="myModal" *ngIf='show'>
<span class="close" (click)="hideModal()">&times;</span>
<img class="modal-content" src='../../../assets/Zertifikate/{{show}}'>
</div>