daniel-c-harvey
70 lines
2.0 KiB
Plaintext
70 lines
2.0 KiB
Plaintext
<div class="deepdrft-track-card-container">
|
|
|
|
@if (!string.IsNullOrEmpty(TrackModel?.ImagePath))
|
|
{
|
|
<div class="deepdrft-track-card-bg" style="background-image: url('@TrackModel.ImagePath');">
|
|
</div>
|
|
}
|
|
else
|
|
{
|
|
<div class="deepdrft-track-card-fallback"></div>
|
|
}
|
|
|
|
<div class="deepdrft-track-card-content">
|
|
|
|
<div class="deepdrft-track-info-top">
|
|
<MudText Typo="Typo.subtitle1"
|
|
Class="deepdrft-track-title text-truncate mb-1">
|
|
@TrackModel?.TrackName
|
|
</MudText>
|
|
|
|
<MudText Typo="Typo.caption"
|
|
Class="deepdrft-track-artist text-truncate mb-2">
|
|
@TrackModel?.Artist
|
|
</MudText>
|
|
</div>
|
|
|
|
<div class="deepdrft-track-info-middle">
|
|
@if (!string.IsNullOrEmpty(TrackModel?.Album))
|
|
{
|
|
<MudText Typo="Typo.caption"
|
|
Class="deepdrft-track-meta text-truncate">
|
|
@TrackModel.Album
|
|
</MudText>
|
|
}
|
|
|
|
@if (!string.IsNullOrEmpty(TrackModel?.Genre))
|
|
{
|
|
<MudChip T="string"
|
|
Size="Size.Small"
|
|
Variant="Variant.Outlined"
|
|
Color="Color.Tertiary"
|
|
Class="deepdrft-genre-chip">
|
|
@TrackModel.Genre
|
|
</MudChip>
|
|
}
|
|
</div>
|
|
|
|
<div class="deepdrft-track-info-bottom">
|
|
@if (TrackModel?.ReleaseDate.HasValue == true)
|
|
{
|
|
<MudText Typo="Typo.caption"
|
|
Class="deepdrft-track-meta">
|
|
@TrackModel.ReleaseDate.Value.Year
|
|
</MudText>
|
|
}
|
|
else
|
|
{
|
|
<div></div>
|
|
}
|
|
|
|
<MudFab Color="Color.Tertiary"
|
|
Size="Size.Medium"
|
|
StartIcon="@PlayPauseIcon"
|
|
OnClick="@PlayClick"/>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|