Improved Manage Categories Page layout
This commit is contained in:
parent
0f9970722f
commit
cc5a61fc09
|
@ -2,6 +2,7 @@
|
||||||
@using Microsoft.EntityFrameworkCore
|
@using Microsoft.EntityFrameworkCore
|
||||||
@using Wave.Data
|
@using Wave.Data
|
||||||
@using System.ComponentModel.DataAnnotations
|
@using System.ComponentModel.DataAnnotations
|
||||||
|
@using Humanizer
|
||||||
@using Wave.Utilities
|
@using Wave.Utilities
|
||||||
|
|
||||||
@rendermode InteractiveServer
|
@rendermode InteractiveServer
|
||||||
|
@ -52,19 +53,32 @@ bg-warning text-warning-content
|
||||||
bg-error text-error-content
|
bg-error text-error-content
|
||||||
-->
|
-->
|
||||||
|
|
||||||
<ul class="flex flex-col gap-2 max-w-xs">
|
<div class="overflow-x-auto">
|
||||||
@foreach (var category in Categories) {
|
<table class="table">
|
||||||
string postfix = CategoryUtilities.GetCssClassPostfixForColor(category.Color);
|
<tr class="border-b-2 border-current">
|
||||||
<li class="bg-@postfix text-@postfix-content p-2 border-2 border-current flex items-center">
|
<th>@Localizer["Name"]</th>
|
||||||
<span class="flex-1">@category.Name</span>
|
<th>@Localizer["Type"]</th>
|
||||||
<button type="button" class="btn btn-sm btn-square btn-error" title="delete" @onclick="async () => await DeleteCategory(category)">
|
<th></th>
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="w-5 h-5">
|
</tr>
|
||||||
<path fill-rule="evenodd" d="M8.75 1A2.75 2.75 0 0 0 6 3.75v.443c-.795.077-1.584.176-2.365.298a.75.75 0 1 0 .23 1.482l.149-.022.841 10.518A2.75 2.75 0 0 0 7.596 19h4.807a2.75 2.75 0 0 0 2.742-2.53l.841-10.52.149.023a.75.75 0 0 0 .23-1.482A41.03 41.03 0 0 0 14 4.193V3.75A2.75 2.75 0 0 0 11.25 1h-2.5ZM10 4c.84 0 1.673.025 2.5.075V3.75c0-.69-.56-1.25-1.25-1.25h-2.5c-.69 0-1.25.56-1.25 1.25v.325C8.327 4.025 9.16 4 10 4ZM8.58 7.72a.75.75 0 0 0-1.5.06l.3 7.5a.75.75 0 1 0 1.5-.06l-.3-7.5Zm4.34.06a.75.75 0 1 0-1.5-.06l-.3 7.5a.75.75 0 1 0 1.5.06l.3-7.5Z" clip-rule="evenodd" />
|
|
||||||
</svg>
|
@foreach (var category in Categories) {
|
||||||
</button>
|
string postfix = CategoryUtilities.GetCssClassPostfixForColor(category.Color);
|
||||||
</li>
|
<tr class="border-b-2">
|
||||||
}
|
<td>@category.Name</td>
|
||||||
</ul>
|
<td>
|
||||||
|
<span class="badge badge-@postfix">@category.Color.Humanize()</span>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<button type="button" class="btn btn-sm btn-square btn-error" title="delete" @onclick="async () => await DeleteCategory(category)">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="w-5 h-5">
|
||||||
|
<path fill-rule="evenodd" d="M8.75 1A2.75 2.75 0 0 0 6 3.75v.443c-.795.077-1.584.176-2.365.298a.75.75 0 1 0 .23 1.482l.149-.022.841 10.518A2.75 2.75 0 0 0 7.596 19h4.807a2.75 2.75 0 0 0 2.742-2.53l.841-10.52.149.023a.75.75 0 0 0 .23-1.482A41.03 41.03 0 0 0 14 4.193V3.75A2.75 2.75 0 0 0 11.25 1h-2.5ZM10 4c.84 0 1.673.025 2.5.075V3.75c0-.69-.56-1.25-1.25-1.25h-2.5c-.69 0-1.25.56-1.25 1.25v.325C8.327 4.025 9.16 4 10 4ZM8.58 7.72a.75.75 0 0 0-1.5.06l.3 7.5a.75.75 0 1 0 1.5-.06l-.3-7.5Zm4.34.06a.75.75 0 1 0-1.5-.06l-.3 7.5a.75.75 0 1 0 1.5.06l.3-7.5Z" clip-rule="evenodd" />
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
}
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
@code {
|
@code {
|
||||||
[CascadingParameter(Name = "TitlePostfix")]
|
[CascadingParameter(Name = "TitlePostfix")]
|
||||||
|
|
Loading…
Reference in a new issue