clayschaad/ShiftScheduler
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Implement enhanced icon system with Open Iconic support

Browse source 
Co-authored-by: clayschaad <11883505+clayschaad@users.noreply.github.com>
This commit is contained in:
copilot-swe-agent[bot] 2025-08-29 19:00:01 +00:00
parent e6249fb369
commit 052524ea54
4 changed files with 38 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
Client/Components/ConfigurationDialog.razor
View file

@ -108,7 +108,25 @@
</div> </div>
<div class="col-6"> <div class="col-6">
<label class="form-label">Icon</label> <label class="form-label">Icon</label>
<input type="text" class="form-control form-control-sm" @bind="_config.Shifts[index].Icon" /> <div class="input-group">
<input type="text" class="form-control form-control-sm" @bind="_config.Shifts[index].Icon"
placeholder="Unicode, oi-icon-name, or image.png" />
<span class="input-group-text">
@if (_config.Shifts[index].IsPngIcon)
{
<img src="icons/@_config.Shifts[index].Icon" alt="Preview" style="width: 16px; height: 16px;" />
}
else if (_config.Shifts[index].IsOpenIconicIcon)
{
<span class="@_config.Shifts[index].GetOpenIconicClass()" style="font-size: 14px;" title="Open Iconic Icon" aria-hidden="true"></span>
}
else
{
<span style="font-size: 14px;">@_config.Shifts[index].Icon</span>
}
</span>
</div>
<small class="form-text text-muted">Examples: ⭐, oi-clock, break-icon.png</small>
</div> </div>
<div class="col-6"> <div class="col-6">
<label class="form-label">Morning Time</label> <label class="form-label">Morning Time</label>

8
Client/Pages/Index.razor
View file

@ -71,6 +71,10 @@ else
{ {
<img src="icons\@shift.Icon" alt="@shift.Name" style="width: 24px; height: 24px;" /> <img src="icons\@shift.Icon" alt="@shift.Name" style="width: 24px; height: 24px;" />
} }
else if (shift.IsOpenIconicIcon)
{
<span class="@shift.GetOpenIconicClass()" style="font-size: 16px;" title="@shift.Name" aria-hidden="true"></span>
}
else else
{ {
@shift.Icon @shift.Icon
@ -120,6 +124,10 @@ else
{ {
<img src="icons\@shift.Icon" alt="@shift.Name" style="width: 24px; height: 24px;" /> <img src="icons\@shift.Icon" alt="@shift.Name" style="width: 24px; height: 24px;" />
} }
else if (shift.IsOpenIconicIcon)
{
<span class="@shift.GetOpenIconicClass()" style="font-size: 16px;" title="@shift.Name" aria-hidden="true"></span>
}
else else
{ {
@shift.Icon @shift.Icon

10
Server/appsettings.json
View file

@ -32,13 +32,13 @@
"Shifts": [ "Shifts": [
{ {
"Name": "Frei", "Name": "Frei",
"Icon": "⚫", "Icon": "oi-circle-x",
"MorningTime": "", "MorningTime": "",
"AfternoonTime": "" "AfternoonTime": ""
}, },
{ {
"Name": "Urlaub", "Name": "Urlaub",
"Icon": "🌴", "Icon": "oi-map-marker",
"MorningTime": "", "MorningTime": "",
"AfternoonTime": "" "AfternoonTime": ""
}, },
@ -50,19 +50,19 @@
}, },
{ {
"Name": "Früh", "Name": "Früh",
"Icon": "🌅", "Icon": "oi-sun",
"MorningTime": "06:00-14:00", "MorningTime": "06:00-14:00",
"AfternoonTime": "" "AfternoonTime": ""
}, },
{ {
"Name": "Spät", "Name": "Spät",
"Icon": "🌆", "Icon": "oi-moon",
"MorningTime": "", "MorningTime": "",
"AfternoonTime": "14:00-22:00" "AfternoonTime": "14:00-22:00"
}, },
{ {
"Name": "Tag", "Name": "Tag",
"Icon": "☀️", "Icon": "oi-clock",
"MorningTime": "08:00-12:00", "MorningTime": "08:00-12:00",
"AfternoonTime": "13:00-17:00" "AfternoonTime": "13:00-17:00"
} }

6
Shared/Shift.cs
View file

@ -8,5 +8,11 @@ namespace ShiftScheduler.Shared
public string AfternoonTime { get; set; } = string.Empty; public string AfternoonTime { get; set; } = string.Empty;
public bool IsPngIcon => Icon.EndsWith(".png", StringComparison.OrdinalIgnoreCase); public bool IsPngIcon => Icon.EndsWith(".png", StringComparison.OrdinalIgnoreCase);
public bool IsOpenIconicIcon => Icon.StartsWith("oi-", StringComparison.OrdinalIgnoreCase);
public bool IsUnicodeIcon => !IsPngIcon && !IsOpenIconicIcon;
public string GetOpenIconicClass() => IsOpenIconicIcon ? $"oi {Icon}" : string.Empty;
} }
} }