2019-10-08 05:43:49 +00:00
|
|
|
<div class="overlay">
|
2022-12-17 07:09:43 +00:00
|
|
|
<div class="overlay-content">
|
2019-10-08 05:43:49 +00:00
|
|
|
<div class="tags">
|
|
|
|
<span *ngFor="let tag of tags" [class.active]="tag.active">{{ tag.text }}</span>
|
|
|
|
</div>
|
|
|
|
<div class="container">
|
2022-12-21 16:27:47 +00:00
|
|
|
<div class="slide currentSlide song mat-headline-2" [innerHTML]="chordproFormatted(currentSlides[activeSlide])|chordpro"></div>
|
2019-10-08 05:43:49 +00:00
|
|
|
<div class="nextSlides">
|
2022-12-17 07:09:43 +00:00
|
|
|
<div
|
|
|
|
class="slide song"
|
|
|
|
[class.first]="slide.first_slide_of_tag"
|
|
|
|
*ngFor="let slide of nextSlides"
|
|
|
|
[innerHTML]="chordproFormatted(slide)|chordpro">
|
|
|
|
</div>
|
2019-10-08 05:43:49 +00:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
2022-12-17 07:09:43 +00:00
|
|
|
<div class="toolbar">
|
|
|
|
<a class="back-button" mat-mini-fab color="" routerLink="/" [matTooltip]="'Go back to controller'">
|
|
|
|
<mat-icon>arrow_back</mat-icon>
|
|
|
|
</a>
|
2019-10-08 05:43:49 +00:00
|
|
|
<div class="transpose">
|
|
|
|
<button mat-icon-button (click)="transposeDown()">
|
|
|
|
<mat-icon>keyboard_arrow_down</mat-icon>
|
|
|
|
</button>
|
2022-12-17 07:09:43 +00:00
|
|
|
<span>{{ transposeLevel }}</span>
|
|
|
|
<button mat-icon-button (click)="transposeUp()">
|
|
|
|
<mat-icon>keyboard_arrow_up</mat-icon>
|
|
|
|
</button>
|
2019-10-08 05:43:49 +00:00
|
|
|
</div>
|
2022-12-17 07:09:43 +00:00
|
|
|
<div class="time">{{ (openlpService.getIsTwelveHourTime()) ? (time|date:'h:mm a') : (time|date:'HH:mm') }}</div>
|
2019-10-08 05:43:49 +00:00
|
|
|
</div>
|
2022-10-19 11:51:03 +00:00
|
|
|
</div>
|