mirror of
https://github.com/claunia/marechai.git
synced 2025-12-16 19:14:25 +00:00
Add carousel to company logos, fixes #19
This commit is contained in:
@@ -2,7 +2,7 @@
|
||||
<Project Sdk="Microsoft.NET.Sdk.Web">
|
||||
<PropertyGroup>
|
||||
<TargetFramework>netcoreapp3.1</TargetFramework>
|
||||
<Version>4.0.0.1767</Version>
|
||||
<Version>4.0.0.1784</Version>
|
||||
<Company>Canary Islands Computer Museum</Company>
|
||||
<Copyright>Copyright © 2003-2020 Natalia Portillo</Copyright>
|
||||
<Product>Canary Islands Computer Museum Website</Product>
|
||||
|
||||
@@ -65,19 +65,15 @@
|
||||
}
|
||||
</p>
|
||||
<div class="row">
|
||||
@{
|
||||
_carrouselActive = "active";
|
||||
}
|
||||
@if (_logos != null &&
|
||||
_logos.Count > 1)
|
||||
{
|
||||
// TODO: Carousel
|
||||
<div class="col-3">
|
||||
<div class="carousel slide" data-ride="carousel" id="logosCarousel">
|
||||
<div class="carousel-inner">
|
||||
@foreach (var logo in _logos.Where(logo => File.Exists(Path.Combine(Host.WebRootPath, "assets/logos", logo.Guid + ".svg"))))
|
||||
{
|
||||
<div class="carousel-item @_carrouselActive">
|
||||
<Carousel @bind-SelectedSlide="@_selectedSlide" ShowIndicators="true" ShowControls="true">
|
||||
@foreach(var logo in _logos.Where(logo => File.Exists(Path.Combine(Host.WebRootPath, "assets/logos", logo.Guid + ".svg"))))
|
||||
{
|
||||
<CarouselSlide Name="@logo.Guid.ToString()">
|
||||
<div style="width: 256px; height: 256px; margin: auto;">
|
||||
<picture>
|
||||
<source type="image/svg+xml" srcset="/assets/logos/@(logo.Guid).svg">
|
||||
<source type="image/webp" srcset="/assets/logos/webp/1x/@(logo.Guid).webp,
|
||||
@@ -88,21 +84,9 @@
|
||||
/assets/logos/png/1x/@(logo.Guid).webp 3x" src="/assets/logos/png/1x/@(logo.Guid).png" alt="" height="auto" width="auto" style="max-height: 256px; max-width: 256px" />
|
||||
</picture>
|
||||
</div>
|
||||
|
||||
_carrouselActive = null;
|
||||
}
|
||||
</div>
|
||||
<a class="carousel-control-prev" data-slide="prev" href="#logosCarousel" role="button">
|
||||
<span aria-hidden="true" class="carousel-control-prev-icon">
|
||||
</span>
|
||||
<span class="sr-only">Previous</span>
|
||||
</a>
|
||||
<a class="carousel-control-next" data-slide="next" href="#logosCarousel" role="button">
|
||||
<span aria-hidden="true" class="carousel-control-next-icon">
|
||||
</span>
|
||||
<span class="sr-only">Next</span>
|
||||
</a>
|
||||
</div>
|
||||
</CarouselSlide>
|
||||
}
|
||||
</Carousel>
|
||||
</div>
|
||||
}
|
||||
<div class="col-6">
|
||||
@@ -391,3 +375,19 @@
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.carousel-indicators {
|
||||
position: absolute;
|
||||
bottom: -50px;
|
||||
}
|
||||
|
||||
.carousel-indicators li {
|
||||
background-color: black;
|
||||
}
|
||||
|
||||
.carousel-control-prev,
|
||||
.carousel-control-next {
|
||||
filter: sepia(100%) saturate(200%) brightness(0%) hue-rotate(330deg);
|
||||
}
|
||||
</style>
|
||||
@@ -24,6 +24,7 @@
|
||||
*******************************************************************************/
|
||||
|
||||
using System.Collections.Generic;
|
||||
using System.IO;
|
||||
using System.Linq;
|
||||
using System.Threading.Tasks;
|
||||
using Marechai.Database;
|
||||
@@ -35,7 +36,6 @@ namespace Marechai.Pages.Companies
|
||||
{
|
||||
public partial class View
|
||||
{
|
||||
string _carrouselActive;
|
||||
CompanyViewModel _company;
|
||||
List<Machine> _computers;
|
||||
List<Machine> _consoles;
|
||||
@@ -43,6 +43,7 @@ namespace Marechai.Pages.Companies
|
||||
int _id;
|
||||
bool _loaded;
|
||||
List<CompanyLogo> _logos;
|
||||
string _selectedSlide;
|
||||
Company _soldTo;
|
||||
|
||||
[Parameter]
|
||||
@@ -84,6 +85,10 @@ namespace Marechai.Pages.Companies
|
||||
_soldTo = await Service.GetSoldToAsync(_company.SoldToId);
|
||||
_logos = await CompanyLogosService.GetByCompany(Id);
|
||||
|
||||
_selectedSlide = _logos.
|
||||
FirstOrDefault(logo => File.Exists(Path.Combine(Host.WebRootPath, "assets/logos",
|
||||
logo.Guid + ".svg")))?.Guid.ToString();
|
||||
|
||||
_loaded = true;
|
||||
StateHasChanged();
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user