Added initial components.

This commit is contained in:
2025-11-30 16:35:54 -05:00
parent b2ef08c995
commit de00bee801
13 changed files with 266 additions and 13 deletions

View File

@@ -0,0 +1,34 @@
@using JSMR.UI.Blazor.Enums
<div class="@GetIconClasses()"></div>
@code {
[Parameter]
public Graphic Graphic { get; set; }
[Parameter]
public SizeVarient Size { get; set; } = SizeVarient.Medium;
[Parameter]
public IconVarient Varient { get; set; } = IconVarient.None;
[Parameter]
public ColorVarient Color { get; set; }
private string GetIconClasses()
{
string graphic = Varient == IconVarient.None
? Graphic.ToString().ToLower()
: $"{Graphic.ToString().ToLower()}-{Varient.ToString().ToLower()}";
List<string> classNames =
[
$"j-icon",
$"j-icon-{graphic}",
$"j-icon-size-{Size.ToString().ToLower()}",
$"background-color-{Color.ToString().ToLower()}"
];
return string.Join(" ", classNames);
}
}

View File

@@ -0,0 +1,24 @@
@using JSMR.UI.Blazor.Enums
<BitTooltip Text="@Tooltip">
<div class="j-input-prefix background-color-@BackgroundColor.ToString().ToLower()">
<Icon Color="Color" Size="SizeVarient.Small" Graphic="Graphic" Varient="IconVarient"></Icon>
</div>
</BitTooltip>
@code {
[Parameter]
public Graphic Graphic { get; set; }
[Parameter]
public IconVarient IconVarient { get; set; } = IconVarient.None;
[Parameter]
public ColorVarient Color { get; set; } = ColorVarient.Primary;
[Parameter]
public ColorVarient BackgroundColor { get; set; } = ColorVarient.Black;
[Parameter]
public string? Tooltip { get; set; }
}

View File

@@ -1,5 +1,6 @@
@using JSMR.Application.VoiceWorks.Queries.Search
@using JSMR.Domain.Enums
@using JSMR.UI.Blazor.Enums
@using JSMR.UI.Blazor.Services
@using System.Globalization
@@ -54,26 +55,38 @@
}
@* <div class="j-icon-2 j-icon-2-flag-@GetFlagClassSuffix(Product)"></div> *@
<div class="j-spacer"></div>
<div class="j-product-indicators">
<BitStack Horizontal="true" Gap="0.5rem" VerticalAlign="BitAlignment.End" HorizontalAlign="BitAlignment.End">
@if (Product.IsValid != true)
{
<div class="j-product-indicator j-product-indicator-invalid">
<div class="j-icon j-icon-warning-fill"></div>
</div>
<ProductIndicator Graphic="Graphic.Warning" IconVarient="IconVarient.Fill" Color="ColorVarient.Orange" BackgroundColor="ColorVarient.Black"></ProductIndicator>
}
@if (Product.OriginalProductId is not null)
{
<ProductIndicator Graphic="Graphic.Translate" Color="ColorVarient.Primary" BackgroundColor="ColorVarient.Black"></ProductIndicator>
}
@if (Product.Favorite)
{
<div class="j-product-indicator j-product-indicator-favorite">
<div class="j-icon j-icon-heart-fill"></div>
</div>
<ProductIndicator Graphic="Graphic.Star" Color="ColorVarient.Pink" BackgroundColor="ColorVarient.Black"></ProductIndicator>
}
@if (Product.HasTrial || Product.HasChobit)
{
<div class="j-trial-container">
<div class="j-icon j-icon-headphones"></div>
</div>
<ProductIndicator Graphic="Graphic.Headphones" Color="ColorVarient.Blue" BackgroundColor="ColorVarient.Black"></ProductIndicator>
}
</div>
</BitStack>
@* <div class="j-product-indicators">
@if (Product.IsValid != true)
{
<ProductIndicator Graphic="Graphic.Warning" IconVarient="IconVarient.Fill" Color="ColorVarient.Orange" BackgroundColor="ColorVarient.Black"></ProductIndicator>
}
@if (Product.Favorite)
{
<ProductIndicator Graphic="Graphic.Star" Color="ColorVarient.Pink" BackgroundColor="ColorVarient.Black"></ProductIndicator>
}
@if (Product.HasTrial || Product.HasChobit)
{
<ProductIndicator Graphic="Graphic.Headphones" Color="ColorVarient.Blue" BackgroundColor="ColorVarient.Black"></ProductIndicator>
}
</div> *@
</div>
</div>

View File

@@ -0,0 +1,22 @@
@using JSMR.UI.Blazor.Enums
<div class="j-product-indicator border-color-@Color.ToString().ToLower() background-color-@BackgroundColor.ToString().ToLower()">
<Icon Color="Color" Size="SizeVarient.Small" Graphic="Graphic" Varient="IconVarient"></Icon>
</div>
@code {
[Parameter]
public Graphic Graphic { get; set; }
[Parameter]
public IconVarient IconVarient { get; set; }
[Parameter]
public ColorVarient Color { get; set; }
[Parameter]
public ColorVarient BackgroundColor { get; set; }
[Parameter]
public bool Clickable { get; set; }
}

View File

@@ -35,7 +35,11 @@
TItem="BitDropdownItem<Locale>"
TValue="Locale"
Value="@Value.Locale"
ValueChanged="@(value => Update(Value with { Locale = value }))" />
ValueChanged="@(value => Update(Value with { Locale = value }))">
<PrefixTemplate>
<InputPrefix Graphic="Graphic.Globe" Tooltip="Locale"></InputPrefix>
</PrefixTemplate>
</BitDropdown>
</div>
<!-- Row 2 -->
<div class="search-filter-control-span-1">