infinimotion/frontend
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Make the hall look less ugly

Browse Source 
Enhanced theater layout with speaker and lamp icons, adjusted seat button spacing, and improved overlay component styling for better visual structure and alignment.
This commit is contained in:
Piet Ostendorp
2025-11-14 00:02:47 +01:00
parent cd0b2d0880
commit b7cd22ef6b
5 changed files with 50 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
src/app/theater-layout/theater-layout.component.html
View File

@@ -1,10 +1,42 @@
<div class="m-auto w-200 h-10 bg-gray-300 mb-20" style="clip-path: polygon(0% 0%,100% 0%,90% 100%,10% 100%);">
<p class="flex justify-center text-2xl fond-bold p-1">
<div class="m-auto w-200 h-10 bg-gray-200 mb-22" style="clip-path: polygon(0% 0%,100% 0%,90% 100%,10% 100%);">
<p class="flex justify-center text-lg font-bold p-1.5">
Leinwand
</p>
</div>
<div>
@for (row of seatsPerRow(); track $index) {
<app-seat-row class="flex justify-center" [rowSeatList]="row"></app-seat-row>
<div class="flex items-center justify-between">
<!-- Speaker -->
<div class="shrink-0 pl-25">
@if ($index % 4 === 0) {
<mat-icon class="material-symbols-outlined opacity-25" style="font-size: 30px; width: 30px; height: 30px">
speaker
</mat-icon>
}
@if ($index % 4 === 2) {
<mat-icon class="material-symbols-outlined opacity-25" style="font-size: 30px; width: 30px; height: 30px">
wall_lamp
</mat-icon>
}
</div>
<!-- Sitzreihe -->
<app-seat-row class="flex justify-center" [rowSeatList]="row"></app-seat-row>
<!-- Speaker -->
<div class="shrink-0 pr-25">
@if ($index % 4 === 0) {
<mat-icon class="material-symbols-outlined opacity-25 mirrored" style="font-size: 30px; width: 30px; height: 30px">
speaker
</mat-icon>
}
@if ($index % 4 === 2) {
<mat-icon class="material-symbols-outlined opacity-25 mirrored" style="font-size: 30px; width: 30px; height: 30px">
wall_lamp
</mat-icon>
}
</div>
</div>
}
</div>