Added Board components for layouting

This commit is contained in:
Mia Rose Winter 2024-01-20 18:29:32 +01:00
parent 8371f131b9
commit fb51b4b360
Signed by: miawinter
GPG key ID: 4B6F6A83178F595E
3 changed files with 86 additions and 68 deletions

View file

@ -12,75 +12,72 @@
<StatusMessage Message="@Message" /> <StatusMessage Message="@Message" />
<div class="flex gap-4 flex-wrap"> <BoardComponent>
<section class="w-80 max-w-xs"> <BoardCardComponent Heading="@Localizer["Title"]">
<h2 class="text-2xl lg:text-4xl mb-3">@Localizer["Title"]</h2> <label class="form-control w-full">
<label class="form-control w-full"> <div class="label">
<div class="label"> <span class="label-text">@Localizer["UserName_Label"]</span>
<span class="label-text">@Localizer["UserName_Label"]</span> </div>
</div> <input class="input input-bordered w-full" type="text" value="@UserName"
<input class="input input-bordered w-full" type="text" value="@UserName" placeholder="Please choose your username." disabled/>
placeholder="Please choose your username." disabled/> </label>
</label> @if (User is not null) {
@if (User is not null) { <ProfileFormPartial User="@User" />
<ProfileFormPartial User="@User" /> }
} </BoardCardComponent>
</section> <BoardCardComponent Heading="@Localizer["AboutMe"]">
<section class="w-80 max-w-xs"> @if (User is not null) {
<h2 class="text-2xl lg:text-4xl mb-3">@Localizer["AboutMe"]</h2> <AboutMeFormPartial User="@User" />
@if (User is not null) { }
<AboutMeFormPartial User="@User" /> </BoardCardComponent>
} <BoardCardComponent Heading="@Localizer["Permissions"]">
</section>
<section class="w-80 max-w-xs">
<h2 class="text-2xl lg:text-4xl mb-3">@Localizer["Permissions"]</h2>
<ul> <ul>
<li class="flex gap-2 content-center"> <li class="flex gap-2 content-center">
<AuthorizeView Policy="ArticleEditPermissions"> <AuthorizeView Policy="ArticleEditPermissions">
<Authorized> <Authorized>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-success"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-success">
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" /> <path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
</svg> </svg>
</Authorized> </Authorized>
<NotAuthorized> <NotAuthorized>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-error"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-error">
<path stroke-linecap="round" stroke-linejoin="round" d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" /> <path stroke-linecap="round" stroke-linejoin="round" d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
</svg> </svg>
</NotAuthorized> </NotAuthorized>
</AuthorizeView> </AuthorizeView>
@Localizer["Permission_ArticleEdit"] @Localizer["Permission_ArticleEdit"]
</li> </li>
<li class="flex gap-2 content-center"> <li class="flex gap-2 content-center">
<AuthorizeView Policy="ArticleReviewPermissions"> <AuthorizeView Policy="ArticleReviewPermissions">
<Authorized> <Authorized>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-success"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-success">
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" /> <path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
</svg> </svg>
</Authorized> </Authorized>
<NotAuthorized> <NotAuthorized>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-error"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-error">
<path stroke-linecap="round" stroke-linejoin="round" d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" /> <path stroke-linecap="round" stroke-linejoin="round" d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
</svg> </svg>
</NotAuthorized> </NotAuthorized>
</AuthorizeView> </AuthorizeView>
@Localizer["Permission_ArticleReview"] @Localizer["Permission_ArticleReview"]
</li> </li>
<li class="flex gap-2 content-center"> <li class="flex gap-2 content-center">
<AuthorizeView Policy="ArticleDeletePermissions"> <AuthorizeView Policy="ArticleDeletePermissions">
<Authorized> <Authorized>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-success"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-success">
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" /> <path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
</svg> </svg>
</Authorized> </Authorized>
<NotAuthorized> <NotAuthorized>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-error"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-error">
<path stroke-linecap="round" stroke-linejoin="round" d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" /> <path stroke-linecap="round" stroke-linejoin="round" d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
</svg> </svg>
</NotAuthorized> </NotAuthorized>
</AuthorizeView> </AuthorizeView>
@Localizer["Permission_ArticleDelete"] @Localizer["Permission_ArticleDelete"]
</li> </li>
<li class="flex gap-2 content-center"> <li class="flex gap-2 content-center">
<AuthorizeView Policy="RoleAssignPermissions"> <AuthorizeView Policy="RoleAssignPermissions">
<Authorized> <Authorized>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-success"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-success">
@ -94,10 +91,10 @@
</NotAuthorized> </NotAuthorized>
</AuthorizeView> </AuthorizeView>
@Localizer["Permission_RoleAssign"] @Localizer["Permission_RoleAssign"]
</li> </li>
</ul> </ul>
</section> </BoardCardComponent>
</div> </BoardComponent>
@code { @code {
private string? Message { get; set; } private string? Message { get; set; }

View file

@ -0,0 +1,13 @@
<section class="w-80 max-w-xs">
@if (!string.IsNullOrWhiteSpace(Heading)) {
<h2 class="text-2xl lg:text-4xl mb-3">@Heading</h2>
}
@ChildContent
</section>
@code {
[Parameter]
public string? Heading { get; set; }
[Parameter]
public required RenderFragment ChildContent { get; set; }
}

View file

@ -0,0 +1,8 @@
<div class="flex gap-4 flex-wrap">
@ChildContent
</div>
@code {
[Parameter]
public required RenderFragment ChildContent { get; set; }
}