Enhance layout styles: update alignment classes for improved responsiveness and add utility classes for alignment

This commit is contained in:
a.beging@eas-solutions.de
2026-04-23 14:09:41 +02:00
parent 8ad6a143de
commit cb3a2ae042
6 changed files with 33 additions and 21 deletions

View File

@@ -7,7 +7,11 @@
<Button Color="Color.Secondary" Class="position-absolute start-0 top-0 m-2 z-3 text-white bg-dark border-0 rounded-circle w-40px h-40px fs-4 lh-1" Clicked="() => SelectedImageIndex = null">
<i class="fa-solid fa-close"></i>
</Button>
<img src="@(_images[SelectedImageIndex.Value])" class="img-fluid rounded" style="max-height: 80vh;" />
<a href="@(_images[SelectedImageIndex.Value])" target="_blank" download>
<img src="@(_images[SelectedImageIndex.Value])" class="img-fluid rounded" style="max-height: 80vh;" />
</a>
<div class="d-flex justify-content-between position-absolute top-50 start-0 w-100">
<Button Color="Color.Dark" Class="rounded-circle" Disabled="@(SelectedImageIndex.Value == 0)" Clicked="() => SelectedImageIndex--"><i class="fa-solid fa-chevron-left"></i></Button>
<Button Color="Color.Dark" Class="rounded-circle" Disabled="@(SelectedImageIndex.Value == _images.Count - 1)" Clicked="() => SelectedImageIndex++"><i class="fa-solid fa-chevron-right"></i></Button>