thepra/decePubClient
1
0 Fork 0
Code Issues Pull Requests Actions Projects Releases 1 Wiki Activity

Move the app's markup to the D components and Tailwind 4

Browse Source 
The pages and components now use the daisyUI wrappers and the neo-* utilities
instead of Bulma and the neomorph classes:
- buttons are DButton, with pressed states as Active;
- nav links are btn / btn-active;
- the filter and composer selects are DSelect with a prefix icon;
- the composer's fields are DInput and DTextarea;
- the message options and scope pickers are DDropdown, which now close on an
  outside click and on Escape;
- the settings and admin sections are DCollapse;
- the dark-mode switch is a DToggle with sun and moon icons;
- the hue slider is a DRange on the rainbow track.

DropdownButton, OpenDownContainer and LoadingData are gone. The loader is
DLoading, whose animation runs; the old one's keyframes were never defined.
Icons coloured with Bulma's has-text-* now get daisyUI's text-info, success,
warning and error, which had no rules before.

Tailwind 3 to 4 fixes:
- space-x/y become gap, which also handles the flex-col-reverse feeds;
- !rounded-lg becomes rounded-lg!;
- drop-shadow becomes drop-shadow-sm;
- text-md becomes text-base.
The thread page marks its message with Content's new Highlighted parameter
rather than a second shadow size.

neo.css: a select's prefix icon gets the room daisyUI leaves for a span.label,
and the inner select lets the well show through.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01LsXgEaXee4GCU1hwYgPJXw
This commit is contained in:
thepraandClaude Opus 5.5 committed 2026-10-03 12:08:11 +02:00
1 parent 90e4b9200c
commit 3ad4f55b11
17 files changed
+333 -512
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

Components/ActionBar.razor
+20 -27
View File
@@ -1,51 +1,47 @@
@inherits LocalizableComponentBase @inherits LocalizableComponentBase
<section class="flex flex-col space-y-4"> <section class="flex flex-col gap-4">
@if (isPosting) @if (isPosting)
{ {
<div class="block p-3 md:p-4 neomorph rounded-xl is-nxsmall"> <div class="block p-3 md:p-4 rounded-xl neo-raised neo-xs">
<MessageUpsertForm OnMessageSubmit="OnMessageSubmit" /> <MessageUpsertForm OnMessageSubmit="OnMessageSubmit" />
</div> </div>
} }
<div class="flex justify-between space-x-3"> <div class="flex justify-between gap-3">
<EditForm Model="Filters"> <EditForm Model="Filters">
<div class="field flex flex-row space-x-3"> <div class="flex flex-row gap-3">
@if (OnTimelineChanged.HasDelegate) @if (OnTimelineChanged.HasDelegate)
{ {
<div class="control has-icons-left"> <DSelect TValue="TimelineType" class="w-auto" Value="Filters.TimelineType"
<span class="icon is-left">
<i class="@Filters.TimelineType.GetTimelineTypeIcon()"></i>
</span>
<span class="select is-rounded neoSelect">
<InputSelect TValue="TimelineType" Value="Filters.TimelineType"
ValueChanged="async v => await OnTimelineChange(v)" ValueExpression="() => Filters.TimelineType"> ValueChanged="async v => await OnTimelineChange(v)" ValueExpression="() => Filters.TimelineType">
<Prefix>
<i class="@Filters.TimelineType.GetTimelineTypeIcon()"></i>
</Prefix>
<ChildContent>
@foreach (var timelineType in Enum.GetValues<TimelineType>()) @foreach (var timelineType in Enum.GetValues<TimelineType>())
{ {
<option value="@timelineType">@Localizer[timelineType.ToString()]</option> <option value="@timelineType">@Localizer[timelineType.ToString()]</option>
} }
</InputSelect> </ChildContent>
</span> </DSelect>
</div>
} }
@if (OnTimeSortingChanged.HasDelegate) @if (OnTimeSortingChanged.HasDelegate)
{ {
<div class="control has-icons-left"> <DSelect TValue="TimeSortingType" class="w-auto" Value="Filters.TimeSortingType"
<span class="icon is-left">
<i class="ion-md-funnel"></i>
</span>
<span class="select is-rounded neoSelect">
<InputSelect TValue="TimeSortingType" Value="Filters.TimeSortingType"
ValueChanged="async v => await OnTimeSortChange(v)" ValueExpression="() => Filters.TimeSortingType"> ValueChanged="async v => await OnTimeSortChange(v)" ValueExpression="() => Filters.TimeSortingType">
<Prefix>
<i class="ion-md-funnel"></i>
</Prefix>
<ChildContent>
@foreach (var timeSortingType in Enum.GetValues<TimeSortingType>()) @foreach (var timeSortingType in Enum.GetValues<TimeSortingType>())
{ {
<option value="@timeSortingType">@Localizer[timeSortingType.ToString()]</option> <option value="@timeSortingType">@Localizer[timeSortingType.ToString()]</option>
} }
</InputSelect> </ChildContent>
</span> </DSelect>
</div>
} }
</div> </div>
</EditForm> </EditForm>
@@ -53,13 +49,10 @@
@if (OnMessageSubmit.HasDelegate) @if (OnMessageSubmit.HasDelegate)
{ {
<div> <div>
<button class="button is-rounded @SUtility.IfTrueThen(isPosting, "neoBtnInsetPlain", "neoBtn")" <DButton Active="isPosting" OnClick="OpenCloseMessageForm">
@onclick="OpenCloseMessageForm">
<span class="icon is-left">
<i class="ion-md-create"></i> <i class="ion-md-create"></i>
</span>
<span>@Localizer["Post"]</span> <span>@Localizer["Post"]</span>
</button> </DButton>
</div> </div>
} }
else else
Components/Content.razor
+50 -80
View File
@@ -1,29 +1,29 @@
@inherits LocalizableComponentBase @inherits LocalizableComponentBase
<div class="flex space-x-3 w-full neomorph is-nxxsmall rounded-xl @CssContainer"> <div class="flex gap-3 w-full rounded-xl neo-raised @(Highlighted ? "neo-sm" : "neo-2xs") @CssContainer">
<div class="flex flex-col py-3 pl-3 md:py-4 md:pl-4 flex-none rounded-l-xl bg-cover bg-no-repeat bg-center" <div class="flex flex-col py-3 pl-3 md:py-4 md:pl-4 flex-none rounded-l-xl bg-cover bg-no-repeat bg-center"
style="background-image:linear-gradient(to left, var(--background), transparent), url('@(Message.User?.BackgroundUrl)');"> style="background-image:linear-gradient(to left, var(--color-base-100), transparent), url('@(Message.User?.BackgroundUrl)');">
<a class="block h-12 w-12 md:h-16 md:w-16" href="@Message.User.ProfileUrl" title="@Message.User.UserName"> <a class="block h-12 w-12 md:h-16 md:w-16" href="@Message.User.ProfileUrl" title="@Message.User.UserName">
<img alt="@Message.User.UserName" class="h-12 w-12 md:h-16 md:w-16 object-cover rounded-full neomorph is-nxxsmall" src="@(Message.User.PictureUrl ?? "/imgs/icon-192.png")" /> <img alt="@Message.User.UserName" class="h-12 w-12 md:h-16 md:w-16 object-cover rounded-full neo-raised neo-2xs" src="@(Message.User.PictureUrl ?? "/imgs/icon-192.png")" />
</a> </a>
</div> </div>
<div class="flex flex-col space-y-3 flex-1 py-3 pr-3 md:py-4 md:pr-4 min-w-0"> <div class="flex flex-col gap-3 flex-1 py-3 pr-3 md:py-4 md:pr-4 min-w-0">
<div class="flex flex-col space-y-1 flex-1 min-w-0"> <div class="flex flex-col gap-1 flex-1 min-w-0">
@if (Message.BoostingUser != null) @if (Message.BoostingUser != null)
{ {
<p class="inline-flex flex-1 space-x-2 min-w-0 text-xs text-xs"> <p class="inline-flex flex-1 gap-2 min-w-0 text-xs">
<a class="font-bold" href="@Message.BoostingUser.ProfileUrl" title="@Message.BoostingUser.UserName">@Message.BoostingUser.DisplayName</a> <a class="font-bold" href="@Message.BoostingUser.ProfileUrl" title="@Message.BoostingUser.UserName">@Message.BoostingUser.DisplayName</a>
<i class="ion-md-repeat has-text-info" aria-hidden="true"></i> <i class="ion-md-repeat text-info" aria-hidden="true"></i>
<span>@Localizer["boosted"]</span> <span>@Localizer["boosted"]</span>
</p> </p>
} }
<p class="inline-flex flex-1 space-x-2 min-w-0 justify-between text-xs md:text-sm"> <p class="inline-flex flex-1 gap-2 min-w-0 justify-between text-xs md:text-sm">
<span class="inline-flex space-x-2 min-w-0"> <span class="inline-flex gap-2 min-w-0">
<b class="shrink truncate max-w-[80%]" title="@Message.User.DisplayName"> <b class="shrink truncate max-w-[80%]" title="@Message.User.DisplayName">
@Message.User.DisplayName @Message.User.DisplayName
</b> </b>
@@ -31,11 +31,11 @@
@Message.User.UserName @Message.User.UserName
</a> </a>
</span> </span>
<span class="flex-none inline-flex space-x-1 items-center"> <span class="flex-none inline-flex gap-1 items-center">
<span title="@Message.CreatedAt.ToLocalTime().ToString("📅dd/MM/yy 🕒HH:mm")"> <span title="@Message.CreatedAt.ToLocalTime().ToString("📅dd/MM/yy 🕒HH:mm")">
@Message.CreatedAt.GetPassedTime(Localizer._pLocalizer) @Message.CreatedAt.GetPassedTime(Localizer._pLocalizer)
</span> </span>
<i aria-hidden="true" class="@Message.MessageType.GetMessageTypeIcon() text-md" <i aria-hidden="true" class="@Message.MessageType.GetMessageTypeIcon() text-base"
title="@Localizer[Message.MessageType.ToString()]"> title="@Localizer[Message.MessageType.ToString()]">
</i> </i>
</span> </span>
@@ -65,7 +65,7 @@
} }
else if (media.ContentType.StartsWith("video")) else if (media.ContentType.StartsWith("video"))
{ {
<video class="w-full max-h-[50vh] aspect-video rounded-lg mx-auto neomorphInset is-nxxsmall" controls="controls" playsinline="playsinline" preload="metadata" title="@media.FileName"> <video class="w-full max-h-[50vh] aspect-video rounded-lg mx-auto neo-inset neo-2xs" controls="controls" playsinline="playsinline" preload="metadata" title="@media.FileName">
<source src="@media.Url" type="@media.ContentType" /> <source src="@media.Url" type="@media.ContentType" />
</video> </video>
} }
@@ -77,11 +77,11 @@
} }
else else
{ {
<div class="flex items-center space-x-3 align-center rounded-lg p-3 md:p-4 neomorph is-nxxsmall"> <div class="flex items-center gap-3 rounded-lg p-3 md:p-4 neo-raised neo-2xs">
<span> <span>
<i class="text-2xl ion-md-document"></i> <i class="text-2xl ion-md-document"></i>
</span> </span>
<div class="flex flex-col w-full space-y-1"> <div class="flex flex-col w-full gap-1">
<p class="text-xs md:text-sm break-all"> <p class="text-xs md:text-sm break-all">
<b>@media.FileName</b> <b>@media.FileName</b>
</p> </p>
@@ -89,11 +89,9 @@
<i class="ion-md-code"></i> @media.ContentType <i class="ion-md-code"></i> @media.ContentType
</p> </p>
</div> </div>
<button class="button is-small is-rounded neoBtnSmall" @onclick="async () => await OnMessageMediaDownload.InvokeAsync(media)" type="button"> <DButton Size="DSize.Sm" OnClick="async () => await OnMessageMediaDownload.InvokeAsync(media)">
<span class="icon">
<i class="ion-md-download text-base"></i> <i class="ion-md-download text-base"></i>
</span> </DButton>
</button>
</div> </div>
} }
} }
@@ -102,106 +100,76 @@
</div> </div>
<div class="flex space-x-3 mt-3 justify-between"> <div class="flex gap-3 mt-3 justify-between">
<div class="flex space-x-3"> <div class="flex gap-3">
@if (OnMessageReply.HasDelegate) @if (OnMessageReply.HasDelegate)
{ {
<button class="button is-small is-rounded @(isAnswering ? "neoBtnSmallInsetPlain" : "neoBtnSmall")" @onclick="Reply" <DButton Size="DSize.Sm" Active="isAnswering" OnClick="Reply" title="@Localizer[isAnswering ? "Close" : "Reply"]">
title="@Localizer[isAnswering ? "Close" : "Reply"]"> <i aria-hidden="true" class="@SUtility.IfTrueThen(isAnswering, "ion-md-close-circle", "ion-md-text") text-lg text-success"></i>
<span class="icon"> </DButton>
<i aria-hidden="true" class="@SUtility.IfTrueThen(isAnswering, "ion-md-close-circle", "ion-md-text") text-lg has-text-success"></i>
</span>
</button>
} }
@if (OnMessageBoost.HasDelegate) @if (OnMessageBoost.HasDelegate)
{ {
<button class="button is-small is-rounded @SUtility.IfTrueThen(Message.IsBoostedByCurrentUser,"neoBtnSmallInsetPlain","neoBtnSmall") @SUtility.IfTrueThen(Message.BoostsCounter != 0, "has-icons-left")" @onclick="() => OnMessageBoost.InvokeAsync(Message)" <DButton Size="DSize.Sm" Active="Message.IsBoostedByCurrentUser" OnClick="() => OnMessageBoost.InvokeAsync(Message)"
title="@Localizer["Boost"]"> title="@Localizer["Boost"]">
<span class="icon is-left"> <i aria-hidden="true" class="ion-md-repeat @SUtility.IfTrueThen(Message.BoostsCounter != 0, null, "text-lg") text-info"></i>
<i aria-hidden="true" class="ion-md-repeat @SUtility.IfTrueThen(Message.BoostsCounter != 0,null,"text-lg") has-text-info"></i>
</span>
@if (Message.BoostsCounter != 0) @if (Message.BoostsCounter != 0)
{ {
<span>@Message.BoostsCounter</span> <span>@Message.BoostsCounter</span>
} }
</button> </DButton>
} }
@if (OnMessageFavourite.HasDelegate) @if (OnMessageFavourite.HasDelegate)
{ {
<button class="button is-small is-rounded @SUtility.IfTrueThen(Message.IsFavourite, "neoBtnSmallInsetPlain", "neoBtnSmall")" @onclick="() => OnMessageFavourite.InvokeAsync(Message)" <DButton Size="DSize.Sm" Active="Message.IsFavourite" OnClick="() => OnMessageFavourite.InvokeAsync(Message)"
title="@Localizer["Favourite"]"> title="@Localizer["Favourite"]">
<span class="icon">
<i aria-hidden="true" class="@SUtility.IfTrueThen(Message.IsFavourite, "ion-md-heart-dislike", "ion-md-heart") text-lg text-pink-300"></i> <i aria-hidden="true" class="@SUtility.IfTrueThen(Message.IsFavourite, "ion-md-heart-dislike", "ion-md-heart") text-lg text-pink-300"></i>
</span> </DButton>
</button>
} }
</div> </div>
<div class="flex space-x-3"> <div class="flex gap-3">
<DropdownButton IsOpen="Message.IsOptionsOpen"> <DDropdown @bind-IsOpen="Message.IsOptionsOpen" Align="DDropdownAlign.End" CloseOnContentClick="true"
<DropdownTrigger> TriggerClass="@(Message.IsOptionsOpen ? "btn btn-sm btn-active" : "btn btn-sm")"
<button class="button is-small is-rounded neoBtnSmall" @onclick="() => Message.IsOptionsOpen = !Message.IsOptionsOpen" ContentClass="mt-2 flex flex-col gap-2 p-2 rounded-box" title="@Localizer["Other"]">
title="@Localizer["Other"]"> <Trigger>
<span class="icon">
<i aria-hidden="true" class="ion-md-more text-lg"></i> <i aria-hidden="true" class="ion-md-more text-lg"></i>
</span> </Trigger>
</button> <ChildContent>
</DropdownTrigger>
<DropdownContent>
@if (OnUserDirectMessage.HasDelegate) @if (OnUserDirectMessage.HasDelegate)
{ {
<div class="dropdown-item"> <DButton Size="DSize.Sm" class="justify-start whitespace-nowrap" OnClick="() => OnUserDirectMessage.InvokeAsync(Message)">
<button class="button is-small is-rounded has-icons-left neoBtnSmall" @onclick="() => OnUserDirectMessage.InvokeAsync(Message)"> <i aria-hidden="true" class="ion-md-paper-plane text-base text-success"></i>
<span class="icon is-left">
<i aria-hidden="true" class="ion-md-paper-plane text-base has-text-success"></i>
</span>
<span>@Localizer["Direct message"]</span> <span>@Localizer["Direct message"]</span>
</button> </DButton>
</div>
} }
@if (OnUserSilence.HasDelegate) @if (OnUserSilence.HasDelegate)
{ {
<div class="dropdown-item"> <DButton Size="DSize.Sm" class="justify-start whitespace-nowrap" OnClick="() => OnUserSilence.InvokeAsync(Message.User)">
<button class="button is-small is-rounded has-icons-left neoBtnSmall" @onclick="() => OnUserSilence.InvokeAsync(Message.User)"> <i aria-hidden="true" class="ion-md-eye-off text-base drop-shadow-sm text-warning"></i>
<span class="icon is-left">
<i aria-hidden="true" class="ion-md-eye-off text-base drop-shadow has-text-warning"></i>
</span>
<span>@Localizer["Mute"]</span> <span>@Localizer["Mute"]</span>
</button> </DButton>
</div>
} }
@if (OnUserBlock.HasDelegate) @if (OnUserBlock.HasDelegate)
{ {
<div class="dropdown-item"> <DButton Size="DSize.Sm" class="justify-start whitespace-nowrap" OnClick="() => OnUserBlock.InvokeAsync(Message.User)">
<button class="button is-small is-rounded has-icons-left neoBtnSmall" @onclick="() => OnUserBlock.InvokeAsync(Message.User)"> <i aria-hidden="true" class="ion-md-remove-circle text-base text-error"></i>
<span class="icon is-left">
<i aria-hidden="true" class="ion-md-remove-circle text-base has-text-danger"></i>
</span>
<span>@Localizer["Block"]</span> <span>@Localizer["Block"]</span>
</button> </DButton>
</div>
} }
@if (@*Message.User.UserName == CurrentUserName &&*@ OnMessageDelete.HasDelegate) @if (@*Message.User.UserName == CurrentUserName &&*@ OnMessageDelete.HasDelegate)
{ {
<div class="dropdown-item"> <DButton Size="DSize.Sm" class="justify-start whitespace-nowrap" OnClick="DeleteMessage" title="@Localizer["Delete"]">
<button class="button is-small has-icons-left is-rounded neoBtnSmall" @onclick="DeleteMessage" <i aria-hidden="true" class="ion-md-trash text-lg text-error"></i>
title="@Localizer["Delete"]">
<span class="icon is-left">
<i aria-hidden="true" class="ion-md-trash text-lg has-text-danger"></i>
</span>
<span>@Localizer["Delete"]</span> <span>@Localizer["Delete"]</span>
</button> </DButton>
</div>
} }
</DropdownContent> </ChildContent>
</DropdownButton> </DDropdown>
@if (IncludeExpand) @if (IncludeExpand)
{ {
<NavLink class="button is-small is-rounded neoBtnSmall" href="@($"expand/{Message.MessageId}")" <NavLink class="btn btn-sm" href="@($"expand/{Message.MessageId}")" title="@Localizer["Expand"]">
title="@Localizer["Expand"]">
<span class="icon">
<i aria-hidden="true" class="ion-md-expand text-lg"></i> <i aria-hidden="true" class="ion-md-expand text-lg"></i>
</span>
</NavLink> </NavLink>
} }
</div> </div>
@@ -228,6 +196,8 @@
[Parameter] public EventCallback<MessageUser> OnUserBlock { get; set; } [Parameter] public EventCallback<MessageUser> OnUserBlock { get; set; }
[Parameter] public EventCallback<MessageUser> OnUserSilence { get; set; } [Parameter] public EventCallback<MessageUser> OnUserSilence { get; set; }
[Parameter] public string CssContainer { get; set; } [Parameter] public string CssContainer { get; set; }
/// <summary>Deeper shadow, for the message a thread page is about.</summary>
[Parameter] public bool Highlighted { get; set; }
[Parameter] public bool IncludeExpand { get; set; } = true; [Parameter] public bool IncludeExpand { get; set; } = true;
bool isAnswering { get; set; } = false; bool isAnswering { get; set; } = false;
Components/DropdownButton.razor
-23
View File
@@ -1,23 +0,0 @@
<div class="dropdown @CssDirection @(IsOpen ? "is-active" : default)">
<div class="dropdown-trigger">
@DropdownTrigger
</div>
<div class="dropdown-menu min-w-full pt-2" id="dropdown-menu6" role="menu">
<div class="dropdown-content text-right background neomorph is-nxsmall rounded-lg">
@DropdownContent
</div>
</div>
</div>
@code {
[Parameter] public RenderFragment DropdownTrigger { get; set; }
[Parameter] public RenderFragment DropdownContent { get; set; }
[Parameter] public bool IsOpen { get; set; } = false;
[Parameter] public string CssDirection { get; set; } = "is-right";
void OpenCloseOptions()
{
IsOpen = !IsOpen;
}
}
Components/LoadingData.razor
-10
View File
@@ -1,10 +0,0 @@
@inherits LocalizableComponentBase
<p class="w-full loadAnimation text-center">
<span>.</span>
<span>.</span>
<span>.</span>
@Localizer["loading"]
<span>.</span>
<span>.</span>
<span>.</span>
</p>
Components/MessageUpsertForm.razor
+75 -123
View File
@@ -3,24 +3,21 @@
<EditForm Model="MessageForm" OnValidSubmit="OnValidSubmit"> <EditForm Model="MessageForm" OnValidSubmit="OnValidSubmit">
<DataAnnotationsValidator /> <DataAnnotationsValidator />
<div class="field mb-3"> <div class="flex flex-col mb-3">
<div class="control"> <DInput TValue="string" class="w-full rounded-t-[1.4rem] rounded-b-lg" maxlength="64"
<InputText class="input rounded-t-[1.4rem] rounded-b-lg neoInput" maxlength="64"
placeholder="@Localizer["Title (optional)"]" Value="@MessageForm.Title" placeholder="@Localizer["Title (optional)"]" Value="@MessageForm.Title"
ValueChanged="(v) => OnTitleChanged(v)" ValueChanged="(v) => OnTitleChanged(v)"
ValueExpression="() => MessageForm.Title" /> ValueExpression="() => MessageForm.Title" />
</div> <div class="relative mt-1">
<div class="control relative mt-1"> <DTextarea TValue="string" @bind-Value="MessageForm.Content" Immediate="true"
<textarea @bind="@MessageForm.Content" @bind:event="oninput" class="w-full rounded-b-[1.4rem] rounded-t-lg" maxlength="5000"
class="textarea rounded-b-[1.4rem] rounded-t-lg neoInput" placeholder="@Localizer["oh shit... here we go again"]" rows="3" />
maxlength="5000"
placeholder="@Localizer["oh shit... here we go again"]" rows="3"></textarea>
<span class="absolute text-xs opacity-50 right-2 bottom-1">@(MessageForm.Content?.Length ?? 0)/5000</span> <span class="absolute text-xs opacity-50 right-2 bottom-1">@(MessageForm.Content?.Length ?? 0)/5000</span>
</div> </div>
@if (showPreviewButton && isPreviewOpen && MessageForm.Content is { Length: > 0 }) @if (showPreviewButton && isPreviewOpen && MessageForm.Content is { Length: > 0 })
{ {
<div class="control relative mt-1 px-8"> <div class="relative mt-1 px-8">
<div class="neomorphInset rounded-t-lg rounded-b-[1.4rem] px-2 py-1 md:px-3 md:py-2 text-xs md:text-sm"> <div class="neo-inset neo-xs rounded-t-lg rounded-b-[1.4rem] px-2 py-1 md:px-3 md:py-2 text-xs md:text-sm">
@switch (MessageForm.ContentType) @switch (MessageForm.ContentType)
{ {
case ContentType.Markdown: case ContentType.Markdown:
@@ -33,22 +30,22 @@
</div> </div>
</div> </div>
} }
<div class="help is-danger"> <div class="text-error text-sm">
<ValidationMessage For="() => MessageForm.Content" /> <ValidationMessage For="() => MessageForm.Content" />
@contentError @contentError
</div> </div>
</div> </div>
<div class="flex flex-col space-y-3 mb-3 @SUtility.IfTrueThen(MessageForm.Media.Count == 0, "hidden")"> <div class="flex flex-col gap-3 mb-3 @SUtility.IfTrueThen(MessageForm.Media.Count == 0, "hidden")">
@foreach (var media in MessageForm.Media) @foreach (var media in MessageForm.Media)
{ {
switch (MessageForm.MediaType) switch (MessageForm.MediaType)
{ {
case MediaType.Images: case MediaType.Images:
<div class="flex w-full items-center space-x-3 rounded-xl p-3 md:p-4 neomorph is-nxxsmall"> <div class="flex w-full items-center gap-3 rounded-xl p-3 md:p-4 neo-raised neo-2xs">
<img alt="@media.AltText" class="object-cover rounded-lg neomorph is-nxxsmall max-h-24 md:max-h-40 max-w-[6rem] md:max-w-[12rem]" src="@media.Base64Preview" /> <img alt="@media.AltText" class="object-cover rounded-lg neo-raised neo-2xs max-h-24 md:max-h-40 max-w-[6rem] md:max-w-[12rem]" src="@media.Base64Preview" />
<div class="flex w-full self-start flex-col justify-between space-y-2"> <div class="flex w-full self-start flex-col justify-between gap-2">
<div class="flex w-full space-x-3"> <div class="flex w-full gap-3">
<div class="flex-1"> <div class="flex-1">
<p class="text-xs md:text-sm break-all"> <p class="text-xs md:text-sm break-all">
<i class="ion-md-image"></i> <b>@media.FileName</b> <i class="ion-md-image"></i> <b>@media.FileName</b>
@@ -57,28 +54,22 @@
<i class="ion-md-code"></i> @media.ContentType <i class="ion-md-fitness"></i> @media.Size.GetFileSize(Localizer._pLocalizer) <i class="ion-md-code"></i> @media.ContentType <i class="ion-md-fitness"></i> @media.Size.GetFileSize(Localizer._pLocalizer)
</p> </p>
</div> </div>
<button class="button is-small is-rounded self-start neoBtnSmall" @onclick="() => RemoveFile(media)" type="button"> <DButton Size="DSize.Sm" class="self-start" OnClick="() => RemoveFile(media)">
<span class="icon">
<i class="ion-md-trash text-base text-red-400"></i> <i class="ion-md-trash text-base text-red-400"></i>
</span> </DButton>
</button>
</div> </div>
<div class="field w-full"> <DTextarea TValue="string" @bind-Value="media.AltText" Size="DSize.Sm" class="w-full rounded-lg!"
<div class="control w-full">
<InputTextArea @bind-Value="media.AltText" class="textarea w-full is-small !rounded-lg neoInput"
placeholder="@Localizer["Alternative text"]" rows="1" /> placeholder="@Localizer["Alternative text"]" rows="1" />
</div> </div>
</div> </div>
</div>
</div>
break; break;
case MediaType.Video: case MediaType.Video:
case MediaType.Documents: case MediaType.Documents:
<div class="flex items-center space-x-3 align-center rounded-xl p-3 md:p-4 neomorph is-nxxsmall"> <div class="flex items-center gap-3 rounded-xl p-3 md:p-4 neo-raised neo-2xs">
<span> <span>
<i class="text-2xl @MessageForm.MediaType.GetMediaTypeIcon()"></i> <i class="text-2xl @MessageForm.MediaType.GetMediaTypeIcon()"></i>
</span> </span>
<div class="flex flex-col w-full space-y-1"> <div class="flex flex-col w-full gap-1">
<p class="text-xs md:text-sm break-all"> <p class="text-xs md:text-sm break-all">
<b>@media.FileName</b> <b>@media.FileName</b>
</p> </p>
@@ -86,19 +77,17 @@
<i class="ion-md-code"></i> @media.ContentType <i class="ion-md-fitness"></i> @media.Size.GetFileSize(Localizer._pLocalizer) <i class="ion-md-code"></i> @media.ContentType <i class="ion-md-fitness"></i> @media.Size.GetFileSize(Localizer._pLocalizer)
</p> </p>
</div> </div>
<button class="button is-small is-rounded neoBtnSmall" @onclick="() => RemoveFile(media)" type="button"> <DButton Size="DSize.Sm" OnClick="() => RemoveFile(media)">
<span class="icon">
<i class="ion-md-trash text-base text-red-400"></i> <i class="ion-md-trash text-base text-red-400"></i>
</span> </DButton>
</button>
</div> </div>
break; break;
case MediaType.Audio: case MediaType.Audio:
<div class="flex items-center space-x-3 align-center rounded-xl p-3 md:p-4 neomorph is-nxxsmall"> <div class="flex items-center gap-3 rounded-xl p-3 md:p-4 neo-raised neo-2xs">
<span> <span>
<i class="text-2xl @MessageForm.MediaType.GetMediaTypeIcon()"></i> <i class="text-2xl @MessageForm.MediaType.GetMediaTypeIcon()"></i>
</span> </span>
<div class="flex flex-col w-full space-y-1"> <div class="flex flex-col w-full gap-1">
<p class="text-xs md:text-sm break-all"> <p class="text-xs md:text-sm break-all">
<b>@media.FileName</b> <b>@media.FileName</b>
</p> </p>
@@ -109,11 +98,9 @@
<source src="@media.Base64Preview" type="@media.ContentType"> <source src="@media.Base64Preview" type="@media.ContentType">
</audio> </audio>
</div> </div>
<button class="button is-small is-rounded neoBtnSmall" @onclick="() => RemoveFile(media)" type="button"> <DButton Size="DSize.Sm" OnClick="() => RemoveFile(media)">
<span class="icon">
<i class="ion-md-trash text-base text-red-400"></i> <i class="ion-md-trash text-base text-red-400"></i>
</span> </DButton>
</button>
</div> </div>
break; break;
} }
@@ -123,124 +110,94 @@
@if (fileInputErrorMessage is { Length: > 0 }) @if (fileInputErrorMessage is { Length: > 0 })
{ {
<div class="help is-danger p-1 md:p-2 mb-3 rounded-xl neomorphInset is-nxxsmall"> <div class="text-error text-sm p-1 md:p-2 mb-3 rounded-xl neo-inset neo-2xs">
@((MarkupString)fileInputErrorMessage) @((MarkupString)fileInputErrorMessage)
</div> </div>
} }
<div class="flex justify-between space-x-3 h-[30px]"> <div class="flex flex-wrap items-start justify-between gap-3">
<div class="flex space-x-3"> <div class="flex flex-wrap items-start gap-3">
<DropdownButton CssDirection="is-left" IsOpen="MessageForm.IsScopeOptionsOpen"> <DDropdown @bind-IsOpen="MessageForm.IsScopeOptionsOpen"
<DropdownTrigger> TriggerClass="@(MessageForm.IsScopeOptionsOpen ? "btn btn-sm btn-active" : "btn btn-sm")"
<button class="button is-small is-rounded @SUtility.IfTrueThen(MessageForm.IsScopeOptionsOpen, "neoBtnSmallInsetPlain", "neoBtnSmall")" @onclick="OpenCloseMessageType" ContentClass="mt-2 flex gap-2 p-2 rounded-box"
title="@string.Format(Localizer["Message scope type: {0}"], Localizer[MessageType.Direct.ToString()])" type="button"> title="@string.Format(Localizer["Message scope type: {0}"], Localizer[MessageForm.MessageType.ToString()])">
<span class="icon"> <Trigger>
<i class="@MessageForm.MessageType.GetMessageTypeIcon() text-base"></i> <i class="@MessageForm.MessageType.GetMessageTypeIcon() text-base"></i>
</span> </Trigger>
</button> <ChildContent>
</DropdownTrigger> <DButton Size="DSize.Sm" Active="MessageForm.MessageType is MessageType.Direct" OnClick="() => UpdateMessageType(MessageType.Direct)"
<DropdownContent> title="@Localizer[MessageType.Direct.ToString()]">
<div class="flex space-x-3 px-2">
<button class="button is-small is-rounded @SUtility.IfTrueThen(MessageForm.MessageType is MessageType.Direct, "neoBtnSmallInsetPlain", "neoBtnSmall")" @onclick="() => UpdateMessageType(MessageType.Direct)"
title="@Localizer[MessageType.Direct.ToString()]" type="button">
<span class="icon">
<i class="ion-md-paper-plane text-base"></i> <i class="ion-md-paper-plane text-base"></i>
</span> </DButton>
</button> <DButton Size="DSize.Sm" Active="MessageForm.MessageType is MessageType.FollowersOnly" OnClick="() => UpdateMessageType(MessageType.FollowersOnly)"
<button class="button is-small is-rounded @SUtility.IfTrueThen(MessageForm.MessageType is MessageType.FollowersOnly, "neoBtnSmallInsetPlain", "neoBtnSmall")" @onclick="() => UpdateMessageType(MessageType.FollowersOnly)" title="@Localizer[MessageType.FollowersOnly.ToString()]">
title="@Localizer[MessageType.FollowersOnly.ToString()]" type="button">
<span class="icon">
<i class="ion-md-lock text-base"></i> <i class="ion-md-lock text-base"></i>
</span> </DButton>
</button> <DButton Size="DSize.Sm" Active="MessageForm.MessageType is MessageType.Unlisted" OnClick="() => UpdateMessageType(MessageType.Unlisted)"
<button class="button is-small is-rounded @SUtility.IfTrueThen(MessageForm.MessageType is MessageType.Unlisted, "neoBtnSmallInsetPlain", "neoBtnSmall")" @onclick="() => UpdateMessageType(MessageType.Unlisted)" title="@Localizer[MessageType.Unlisted.ToString()]">
title="@Localizer[MessageType.Unlisted.ToString()]" type="button">
<span class="icon">
<i class="ion-md-unlock text-base"></i> <i class="ion-md-unlock text-base"></i>
</span> </DButton>
</button> <DButton Size="DSize.Sm" Active="MessageForm.MessageType is MessageType.Public" OnClick="() => UpdateMessageType(MessageType.Public)"
<button class="button is-small is-rounded @SUtility.IfTrueThen(MessageForm.MessageType is MessageType.Public, "neoBtnSmallInsetPlain", "neoBtnSmall")" @onclick="() => UpdateMessageType(MessageType.Public)" title="@Localizer[MessageType.Public.ToString()]">
title="@Localizer[MessageType.Public.ToString()]" type="button">
<span class="icon">
<i class="ion-md-globe text-base"></i> <i class="ion-md-globe text-base"></i>
</span> </DButton>
</button> </ChildContent>
</div> </DDropdown>
</DropdownContent>
</DropdownButton>
<div class="file is-small"> @* A label styled as a button opens the hidden file input. *@
<label class="file-label overflow-visible rounded-full neoBtnSmall h-[30px]"> <label class="btn btn-sm @SUtility.IfTrueThen(ShouldDisableUpload(), "btn-disabled")">
<InputFile accept="@acceptedFilesTypes" class="file-input" multiple="@ShouldHaveMultipleUpload()" OnChange="OnFileChange" disabled="@ShouldDisableUpload()" /> <InputFile accept="@acceptedFilesTypes" class="hidden" multiple="@ShouldHaveMultipleUpload()" OnChange="OnFileChange" disabled="@ShouldDisableUpload()" />
<span class="file-cta">
<span class="file-icon @SUtility.IfTrueThen(MessageForm.Media.Count == 0, "mr-0")">
<i class="ion-md-attach text-base"></i> <i class="ion-md-attach text-base"></i>
</span>
@if (MessageForm.Media.Count != 0) @if (MessageForm.Media.Count != 0)
{ {
<span class="file-label">+@MessageForm.Media.Count</span> <span>+@MessageForm.Media.Count</span>
} }
</span>
</label> </label>
</div>
<div class="field"> <DSelect TValue="MediaType" Size="DSize.Sm" class="w-auto" Value="MessageForm.MediaType" ValueChanged="v => OnMediaTypeChanged(v)"
<div class="control has-icons-left"> ValueExpression="() => MessageForm.MediaType" disabled="@(MessageForm.Media.Count > 0)">
<div class="select is-small is-rounded neoSelect"> <Prefix>
<InputSelect TValue="MediaType" Value="MessageForm.MediaType" ValueChanged="v => OnMediaTypeChanged(v)" ValueExpression="() => MessageForm.MediaType" disabled="@(MessageForm.Media.Count > 0)"> <i class="@MessageForm.MediaType.GetMediaTypeIcon()"></i>
</Prefix>
<ChildContent>
@foreach (var mediaType in Enum.GetValues<MediaType>()) @foreach (var mediaType in Enum.GetValues<MediaType>())
{ {
<option value="@mediaType">@Localizer[mediaType.ToString()]</option> <option value="@mediaType">@Localizer[mediaType.ToString()]</option>
} }
</InputSelect> </ChildContent>
</div> </DSelect>
<span class="icon is-small is-left">
<i class="@MessageForm.MediaType.GetMediaTypeIcon()"></i>
</span>
</div>
</div>
<div class="field"> <div class="flex flex-col">
<div class="control has-icons-left"> <DSelect TValue="ContentType" Size="DSize.Sm" class="w-auto" Value="MessageForm.ContentType" ValueChanged="v => OnContentTypeChanged(v)"
<div class="select is-small is-rounded neoSelect"> ValueExpression="() => MessageForm.ContentType">
<InputSelect TValue="ContentType" Value="MessageForm.ContentType" ValueChanged="v => OnContentTypeChanged(v)" ValueExpression="() => MessageForm.ContentType"> <Prefix>
<i class="@MessageForm.ContentType.GetContentTypeIcon()"></i>
</Prefix>
<ChildContent>
@foreach (var contentType in Enum.GetValues<ContentType>()) @foreach (var contentType in Enum.GetValues<ContentType>())
{ {
<option value="@contentType">@Localizer[contentType.ToString()]</option> <option value="@contentType">@Localizer[contentType.ToString()]</option>
} }
</InputSelect> </ChildContent>
</div> </DSelect>
<span class="icon is-small is-left"> <div class="text-error text-sm">
<i class="@MessageForm.ContentType.GetContentTypeIcon()"></i>
</span>
<div class="help is-danger">
<ValidationMessage For="() => MessageForm.ContentType" /> <ValidationMessage For="() => MessageForm.ContentType" />
</div> </div>
</div> </div>
</div>
@if (showPreviewButton) @if (showPreviewButton)
{ {
<button class="button is-small is-rounded @SUtility.IfTrueThen(isPreviewOpen, "neoBtnSmallInsetPlain", "neoBtnSmall")" @onclick="OnOpenClosePreview" <DButton Size="DSize.Sm" Active="isPreviewOpen" OnClick="OnOpenClosePreview" title="@Localizer["Show preview"]">
title="@Localizer["Show preview"]" type="button">
<span class="icon">
<i class="@SUtility.IfTrueThen(isPreviewOpen, "ion-md-eye-off", "ion-md-eye") text-base"></i> <i class="@SUtility.IfTrueThen(isPreviewOpen, "ion-md-eye-off", "ion-md-eye") text-base"></i>
</span> </DButton>
</button>
} }
</div> </div>
<div class="flex space-x-3"> <DButton Size="DSize.Sm" Type="submit">
<button class="button is-small is-rounded has-icons-right neoBtnSmall" type="submit">
<span>@Localizer["Post"]</span> <span>@Localizer["Post"]</span>
<span class="icon is-right">
<i class="ion-md-send"></i> <i class="ion-md-send"></i>
</span> </DButton>
</button>
</div>
</div> </div>
@@ -258,11 +215,6 @@
bool showPreviewButton { get; set; } = false; bool showPreviewButton { get; set; } = false;
bool isPreviewOpen { get; set; } = false; bool isPreviewOpen { get; set; } = false;
void OpenCloseMessageType()
{
MessageForm.IsScopeOptionsOpen = !MessageForm.IsScopeOptionsOpen;
}
void UpdateMessageType(MessageType messageType) void UpdateMessageType(MessageType messageType)
{ {
MessageForm.MessageType = messageType; MessageForm.MessageType = messageType;
Components/OpenDownContainer.razor
-36
View File
@@ -1,36 +0,0 @@
<div class="flex flex-col w-full space-y-4">
<div class="flex w-full justify-between items-center py-2 md:py-3 px-3 md:px-4 space-x-2 rounded-lg neomorph is-nxsmall">
@TitleChildren
<button class="button is-rounded is-small @ButtonCss"
@onclick:preventDefault @onclick="OpenCloseInnerContent" disabled="@(!HasInnerContent)">
<span class="icon">
<i aria-hidden="true" class="@LeftIconCss"></i>
</span>
</button>
</div>
<div class="@InnerContentContainerCss @Hidden">
@InnerContent
</div>
</div>
@code {
[Parameter] public RenderFragment TitleChildren { get; set; }
[Parameter] public RenderFragment InnerContent { get; set; }
[Parameter] public bool HasInnerContent { get; set; } = true;
[Parameter] public string InnerContentContainerCss { get; set; } = "block w-auto ml-5 md:ml-10 rounded-lg neomorph is-nxsmall";
[Parameter]
public bool IsOpen { get; set; } = false;
string Hidden { get; set; } = VConstants.HideClass;
string ButtonCss => $"{(HasInnerContent ? default : "cursor-not-allowed")} neoBtnSmall";
string LeftIconCss => IsOpen ? "ion-md-arrow-dropup" : "ion-md-arrow-dropdown";
void OpenCloseInnerContent()
{
IsOpen = !IsOpen;
Hidden = IsOpen ? default : VConstants.HideClass;
}
}
Extensions/ExtensionMethods.cs
+6 -6
View File
@@ -1,4 +1,4 @@
using Blazored.LocalStorage; using Blazored.LocalStorage;
using collAnon.Client.Services; using collAnon.Client.Services;
@@ -85,11 +85,11 @@ namespace decePubClient.Extensions
public static string GetLogLevelClass(this string logType) => logType switch public static string GetLogLevelClass(this string logType) => logType switch
{ {
"Debug" => "has-text-grey", "Debug" => "text-base-content/60",
"Information" => "has-text-info", "Information" => "text-info",
"Warning" => "has-text-warning-dark", "Warning" => "text-warning",
"Error" => "has-text-danger", "Error" => "text-error",
"Fatal" => "has-text-danger-dark", "Fatal" => "text-error font-bold",
_ => string.Empty _ => string.Empty
}; };
Pages/Administration.razor
+79 -79
View File
@@ -3,174 +3,174 @@
<Title>@Localizer["Settings"]</Title> <Title>@Localizer["Settings"]</Title>
<section class="block relative w-full h-full neomorphInset is-nxsmall rounded-xl"> <section class="block relative w-full h-full neo-inset neo-xs rounded-xl">
<div class="flex flex-col space-y-4 p-4 md:p-5 w-full h-full absolute overflow-y-auto"> <div class="flex flex-col gap-4 p-4 md:p-5 w-full h-full absolute overflow-y-auto">
<OpenDownContainer> <DCollapse Icon="DCollapseIcon.Arrow">
<TitleChildren> <Header>
<p class="inline-flex items-center space-x-2"> <p class="inline-flex items-center gap-2">
<i class="ion-md-albums text-xl"></i> <span>@Localizer["Users"]</span> <i class="ion-md-albums text-xl"></i> <span>@Localizer["Users"]</span>
</p> </p>
</TitleChildren> </Header>
<InnerContent> <ChildContent>
<div class="block w-full p-3 md:p-4"> <div class="block w-full p-3 md:p-4">
<p class="w-full text-center text-lg"> <p class="w-full text-center text-lg">
<i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"] <i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"]
</p> </p>
</div> </div>
</InnerContent> </ChildContent>
</OpenDownContainer> </DCollapse>
<OpenDownContainer> <DCollapse Icon="DCollapseIcon.Arrow">
<TitleChildren> <Header>
<p class="inline-flex items-center space-x-2"> <p class="inline-flex items-center gap-2">
<i class="ion-md-albums text-xl"></i> <span>@Localizer["Reports"]</span> <i class="ion-md-albums text-xl"></i> <span>@Localizer["Reports"]</span>
</p> </p>
</TitleChildren> </Header>
<InnerContent> <ChildContent>
<div class="block w-full p-3 md:p-4"> <div class="block w-full p-3 md:p-4">
<p class="w-full text-center text-lg"> <p class="w-full text-center text-lg">
<i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"] <i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"]
</p> </p>
</div> </div>
</InnerContent> </ChildContent>
</OpenDownContainer> </DCollapse>
<OpenDownContainer> <DCollapse Icon="DCollapseIcon.Arrow">
<TitleChildren> <Header>
<p class="inline-flex items-center space-x-2"> <p class="inline-flex items-center gap-2">
<i class="ion-md-albums text-xl"></i> <span>@Localizer["ActivityPub?"]</span> <i class="ion-md-albums text-xl"></i> <span>@Localizer["ActivityPub?"]</span>
</p> </p>
</TitleChildren> </Header>
<InnerContent> <ChildContent>
<div class="block w-full p-3 md:p-4"> <div class="block w-full p-3 md:p-4">
<p class="w-full text-center text-lg"> <p class="w-full text-center text-lg">
<i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"] <i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"]
</p> </p>
</div> </div>
</InnerContent> </ChildContent>
</OpenDownContainer> </DCollapse>
<OpenDownContainer> <DCollapse Icon="DCollapseIcon.Arrow">
<TitleChildren> <Header>
<p class="inline-flex items-center space-x-2"> <p class="inline-flex items-center gap-2">
<i class="ion-md-albums text-xl"></i> <span>@Localizer["Authentication"]</span> <i class="ion-md-albums text-xl"></i> <span>@Localizer["Authentication"]</span>
</p> </p>
</TitleChildren> </Header>
<InnerContent> <ChildContent>
<div class="block w-full p-3 md:p-4"> <div class="block w-full p-3 md:p-4">
<p class="w-full text-center text-lg"> <p class="w-full text-center text-lg">
<i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"] <i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"]
</p> </p>
</div> </div>
</InnerContent> </ChildContent>
</OpenDownContainer> </DCollapse>
<OpenDownContainer> <DCollapse Icon="DCollapseIcon.Arrow">
<TitleChildren> <Header>
<p class="inline-flex items-center space-x-2"> <p class="inline-flex items-center gap-2">
<i class="ion-md-albums text-xl"></i> <span>@Localizer["Emoji?"]</span> <i class="ion-md-albums text-xl"></i> <span>@Localizer["Emoji?"]</span>
</p> </p>
</TitleChildren> </Header>
<InnerContent> <ChildContent>
<div class="block w-full p-3 md:p-4"> <div class="block w-full p-3 md:p-4">
<p class="w-full text-center text-lg"> <p class="w-full text-center text-lg">
<i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"] <i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"]
</p> </p>
</div> </div>
</InnerContent> </ChildContent>
</OpenDownContainer> </DCollapse>
<OpenDownContainer> <DCollapse Icon="DCollapseIcon.Arrow">
<TitleChildren> <Header>
<p class="inline-flex items-center space-x-2"> <p class="inline-flex items-center gap-2">
<i class="ion-md-albums text-xl"></i> <span>@Localizer["Frontend"]</span> <i class="ion-md-albums text-xl"></i> <span>@Localizer["Frontend"]</span>
</p> </p>
</TitleChildren> </Header>
<InnerContent> <ChildContent>
<div class="block w-full p-3 md:p-4"> <div class="block w-full p-3 md:p-4">
<p class="w-full text-center text-lg"> <p class="w-full text-center text-lg">
<i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"] <i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"]
</p> </p>
</div> </div>
</InnerContent> </ChildContent>
</OpenDownContainer> </DCollapse>
<OpenDownContainer> <DCollapse Icon="DCollapseIcon.Arrow">
<TitleChildren> <Header>
<p class="inline-flex items-center space-x-2"> <p class="inline-flex items-center gap-2">
<i class="ion-md-albums text-xl"></i> <span>@Localizer["Instance"]</span> <i class="ion-md-albums text-xl"></i> <span>@Localizer["Instance"]</span>
</p> </p>
</TitleChildren> </Header>
<InnerContent> <ChildContent>
<div class="block w-full p-3 md:p-4"> <div class="block w-full p-3 md:p-4">
<p class="w-full text-center text-lg"> <p class="w-full text-center text-lg">
<i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"] <i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"]
</p> </p>
</div> </div>
</InnerContent> </ChildContent>
</OpenDownContainer> </DCollapse>
<OpenDownContainer> <DCollapse Icon="DCollapseIcon.Arrow">
<TitleChildren> <Header>
<p class="inline-flex items-center space-x-2"> <p class="inline-flex items-center gap-2">
<i class="ion-md-albums text-xl"></i> <span>@Localizer["Link formatter"]</span> <i class="ion-md-albums text-xl"></i> <span>@Localizer["Link formatter"]</span>
</p> </p>
</TitleChildren> </Header>
<InnerContent> <ChildContent>
<div class="block w-full p-3 md:p-4"> <div class="block w-full p-3 md:p-4">
<p class="w-full text-center text-lg"> <p class="w-full text-center text-lg">
<i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"] <i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"]
</p> </p>
</div> </div>
</InnerContent> </ChildContent>
</OpenDownContainer> </DCollapse>
<OpenDownContainer> <DCollapse Icon="DCollapseIcon.Arrow">
<TitleChildren> <Header>
<p class="inline-flex items-center space-x-2"> <p class="inline-flex items-center gap-2">
<i class="ion-md-albums text-xl"></i> <span>@Localizer["Metadata"]</span> <i class="ion-md-albums text-xl"></i> <span>@Localizer["Metadata"]</span>
</p> </p>
</TitleChildren> </Header>
<InnerContent> <ChildContent>
<div class="block w-full p-3 md:p-4"> <div class="block w-full p-3 md:p-4">
<p class="w-full text-center text-lg"> <p class="w-full text-center text-lg">
<i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"] <i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"]
</p> </p>
</div> </div>
</InnerContent> </ChildContent>
</OpenDownContainer> </DCollapse>
<OpenDownContainer> <DCollapse Icon="DCollapseIcon.Arrow">
<TitleChildren> <Header>
<p class="inline-flex items-center space-x-2"> <p class="inline-flex items-center gap-2">
<i class="ion-md-albums text-xl"></i> <span>@Localizer["Policies"]</span> <i class="ion-md-albums text-xl"></i> <span>@Localizer["Policies"]</span>
</p> </p>
</TitleChildren> </Header>
<InnerContent> <ChildContent>
<div class="block w-full p-3 md:p-4"> <div class="block w-full p-3 md:p-4">
<p class="w-full text-center text-lg"> <p class="w-full text-center text-lg">
<i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"] <i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"]
</p> </p>
</div> </div>
</InnerContent> </ChildContent>
</OpenDownContainer> </DCollapse>
<OpenDownContainer> <DCollapse Icon="DCollapseIcon.Arrow">
<TitleChildren> <Header>
<p class="inline-flex items-center space-x-2"> <p class="inline-flex items-center gap-2">
<i class="ion-md-albums text-xl"></i> <span>@Localizer["Upload"]</span> <i class="ion-md-albums text-xl"></i> <span>@Localizer["Upload"]</span>
</p> </p>
</TitleChildren> </Header>
<InnerContent> <ChildContent>
<div class="block w-full p-3 md:p-4"> <div class="block w-full p-3 md:p-4">
<p class="w-full text-center text-lg"> <p class="w-full text-center text-lg">
<i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"] <i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"]
</p> </p>
</div> </div>
</InnerContent> </ChildContent>
</OpenDownContainer> </DCollapse>
</div> </div>
Pages/Authentication.razor
+2 -2
View File
@@ -2,9 +2,9 @@
@inherits PagesBase @inherits PagesBase
<section class="block relative w-full h-full neomorphInset is-nxsmall rounded-xl"> <section class="block relative w-full h-full neo-inset neo-xs rounded-xl">
<div class="flex flex-col space-y-4 p-4 md:p-5 w-full h-full absolute overflow-y-auto"> <div class="flex flex-col gap-4 p-4 md:p-5 w-full h-full absolute overflow-y-auto">
<RemoteAuthenticatorView Action="@Action" /> <RemoteAuthenticatorView Action="@Action" />
Pages/ExpandMessage.razor
+8 -5
View File
@@ -2,14 +2,17 @@
@page "/expand/{messageId}" @page "/expand/{messageId}"
@inherits LocalizableComponentBase @inherits LocalizableComponentBase
<div class="flex w-full h-full flex-col space-y-4"> <div class="flex w-full h-full flex-col gap-4">
<section class="block relative w-full h-full neomorphInset is-nxsmall rounded-xl"> <section class="block relative w-full h-full neo-inset neo-xs rounded-xl">
<div class="flex flex-col space-y-4 p-4 md:p-5 w-full h-full absolute overflow-y-auto @SUtility.IfTrueThen(TimeSortingType is TimeSortingType.Descending, "flex-col-reverse")"> <div class="flex flex-col gap-4 p-4 md:p-5 w-full h-full absolute overflow-y-auto @SUtility.IfTrueThen(TimeSortingType is TimeSortingType.Descending, "flex-col-reverse")">
@if (IsLoading) @if (IsLoading)
{ {
<LoadingData /> <p class="flex w-full items-center justify-center gap-2">
<DLoading Variant="DLoadingVariant.Dots" LabelText="@Localizer["loading"]" />
@Localizer["loading"]
</p>
} }
@foreach (var message in Ancestors) @foreach (var message in Ancestors)
@@ -21,7 +24,7 @@
OnUserBlock="async (u) => await OnUserBlock(u)" OnUserDirectMessage="async (u) => await OnUserDirectMessage(u)" OnUserSilence="async (u) => await OnUserSilence(u)" /> OnUserBlock="async (u) => await OnUserBlock(u)" OnUserDirectMessage="async (u) => await OnUserDirectMessage(u)" OnUserSilence="async (u) => await OnUserSilence(u)" />
} }
<Content CssContainer="is-nsmall" IncludeExpand="false" Message="CurrentMessage" <Content Highlighted="true" IncludeExpand="false" Message="CurrentMessage"
OnMessageBoost="async (m) => await OnMessageBoost(m)" OnMessageDelete="async (m) => await OnMessageDelete(m)" OnMessageBoost="async (m) => await OnMessageBoost(m)" OnMessageDelete="async (m) => await OnMessageDelete(m)"
OnMessageFavourite="async (m) => await OnMessageFavourite(m)" OnMessageReply="async (m) => await OnMessageReply(m)" OnMessageFavourite="async (m) => await OnMessageFavourite(m)" OnMessageReply="async (m) => await OnMessageReply(m)"
OnMessageMediaDownload="async (m) => await OnMessageMediaDownload(m)" OnMessageMediaDownload="async (m) => await OnMessageMediaDownload(m)"
Pages/Index.razor
+7 -4
View File
@@ -4,14 +4,17 @@
@inherits LocalizableComponentBase @inherits LocalizableComponentBase
<Title>@Localizer["Index"]</Title> <Title>@Localizer["Index"]</Title>
<div class="flex w-full h-full flex-col space-y-4"> <div class="flex w-full h-full flex-col gap-4">
<section class="block relative w-full h-full neomorphInset is-nxsmall rounded-xl"> <section class="block relative w-full h-full neo-inset neo-xs rounded-xl">
<div class="flex flex-col space-y-4 p-4 md:p-5 w-full h-full absolute overflow-y-auto @SUtility.IfTrueThen(TimeSortingType is TimeSortingType.Descending, "flex-col-reverse")"> <div class="flex flex-col gap-4 p-4 md:p-5 w-full h-full absolute overflow-y-auto @SUtility.IfTrueThen(TimeSortingType is TimeSortingType.Descending, "flex-col-reverse")">
@if (IsLoading) @if (IsLoading)
{ {
<LoadingData /> <p class="flex w-full items-center justify-center gap-2">
<DLoading Variant="DLoadingVariant.Dots" LabelText="@Localizer["loading"]" />
@Localizer["loading"]
</p>
} }
else if (Messages.Count == 0) else if (Messages.Count == 0)
{ {
Pages/Login.razor
+2 -2
View File
@@ -2,9 +2,9 @@
@inherits LocalizableComponentBase @inherits LocalizableComponentBase
<Title>@Localizer["Login"]</Title> <Title>@Localizer["Login"]</Title>
<section class="block relative w-full h-full neomorphInset is-nxsmall rounded-xl"> <section class="block relative w-full h-full neo-inset neo-xs rounded-xl">
<div class="flex flex-col space-y-4 p-4 md:p-5 w-full h-full absolute overflow-y-auto"> <div class="flex flex-col gap-4 p-4 md:p-5 w-full h-full absolute overflow-y-auto">
<LoginDisplay /> <LoginDisplay />
</div> </div>
Pages/Logout.razor
+2 -2
View File
@@ -2,9 +2,9 @@
@inherits LocalizableComponentBase @inherits LocalizableComponentBase
<Title>@Localizer["Logout"]</Title> <Title>@Localizer["Logout"]</Title>
<section class="block relative w-full h-full neomorphInset is-nxsmall rounded-xl"> <section class="block relative w-full h-full neo-inset neo-xs rounded-xl">
<div class="flex flex-col space-y-4 p-4 md:p-5 w-full h-full absolute overflow-y-auto"> <div class="flex flex-col gap-4 p-4 md:p-5 w-full h-full absolute overflow-y-auto">
<h1 class="text-center">@Localizer["Logging out..."]</h1> <h1 class="text-center">@Localizer["Logging out..."]</h1>
</div> </div>
Pages/Settings.razor
+30 -30
View File
@@ -2,69 +2,69 @@
@inherits LocalizableComponentBase @inherits LocalizableComponentBase
<Title>@Localizer["Settings"]</Title> <Title>@Localizer["Settings"]</Title>
<section class="block relative w-full h-full neomorphInset is-nxsmall rounded-xl"> <section class="block relative w-full h-full neo-inset neo-xs rounded-xl">
<div class="flex flex-col space-y-4 p-4 md:p-5 w-full h-full absolute overflow-y-auto"> <div class="flex flex-col gap-4 p-4 md:p-5 w-full h-full absolute overflow-y-auto">
<OpenDownContainer> <DCollapse Icon="DCollapseIcon.Arrow">
<TitleChildren> <Header>
<p class="inline-flex items-center space-x-2"> <p class="inline-flex items-center gap-2">
<i class="ion-md-cog text-xl"></i> <span>@Localizer["General"]</span> <i class="ion-md-cog text-xl"></i> <span>@Localizer["General"]</span>
</p> </p>
</TitleChildren> </Header>
<InnerContent> <ChildContent>
<div class="block w-full p-3 md:p-4"> <div class="block w-full p-3 md:p-4">
<p class="w-full text-center text-lg"> <p class="w-full text-center text-lg">
<i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"] <i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"]
</p> </p>
</div> </div>
</InnerContent> </ChildContent>
</OpenDownContainer> </DCollapse>
<OpenDownContainer> <DCollapse Icon="DCollapseIcon.Arrow">
<TitleChildren> <Header>
<p class="inline-flex items-center space-x-2"> <p class="inline-flex items-center gap-2">
<i class="ion-md-person text-xl"></i> <span>@Localizer["Profile"]</span> <i class="ion-md-person text-xl"></i> <span>@Localizer["Profile"]</span>
</p> </p>
</TitleChildren> </Header>
<InnerContent> <ChildContent>
<div class="block w-full p-3 md:p-4"> <div class="block w-full p-3 md:p-4">
<p class="w-full text-center text-lg"> <p class="w-full text-center text-lg">
<i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"] <i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"]
</p> </p>
</div> </div>
</InnerContent> </ChildContent>
</OpenDownContainer> </DCollapse>
<OpenDownContainer> <DCollapse Icon="DCollapseIcon.Arrow">
<TitleChildren> <Header>
<p class="inline-flex items-center space-x-2"> <p class="inline-flex items-center gap-2">
<i class="ion-md-archive text-xl"></i> <span>@Localizer["Data import/export"]</span> <i class="ion-md-archive text-xl"></i> <span>@Localizer["Data import/export"]</span>
</p> </p>
</TitleChildren> </Header>
<InnerContent> <ChildContent>
<div class="block w-full p-3 md:p-4"> <div class="block w-full p-3 md:p-4">
<p class="w-full text-center text-lg"> <p class="w-full text-center text-lg">
<i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"] <i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"]
</p> </p>
</div> </div>
</InnerContent> </ChildContent>
</OpenDownContainer> </DCollapse>
<OpenDownContainer> <DCollapse Icon="DCollapseIcon.Arrow">
<TitleChildren> <Header>
<p class="inline-flex items-center space-x-2"> <p class="inline-flex items-center gap-2">
<i class="ion-md-eye-off text-xl"></i> <span>@Localizer["Mutes/Blocks"]</span> <i class="ion-md-eye-off text-xl"></i> <span>@Localizer["Mutes/Blocks"]</span>
</p> </p>
</TitleChildren> </Header>
<InnerContent> <ChildContent>
<div class="block w-full p-3 md:p-4"> <div class="block w-full p-3 md:p-4">
<p class="w-full text-center text-lg"> <p class="w-full text-center text-lg">
<i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"] <i class="ion-ios-remove-circle-outline"></i> @Localizer["Empty"]
</p> </p>
</div> </div>
</InnerContent> </ChildContent>
</OpenDownContainer> </DCollapse>
</div> </div>
Shared/LoginDisplay.razor
+3 -3
View File
@@ -3,12 +3,12 @@
<AuthorizeView> <AuthorizeView>
<Authorized> <Authorized>
<button class="button" @onclick="BeginSignOut"> <DButton OnClick="BeginSignOut">
@Localizer["Logout"] @Localizer["Logout"]
</button> </DButton>
</Authorized> </Authorized>
<NotAuthorized> <NotAuthorized>
<NavLink ActiveClass="neoBtnSmallInsetPlain" class="button is-rounded neoBtnSmallPlain" href="authentication/login"> <NavLink ActiveClass="btn-active" class="btn" href="authentication/login">
@Localizer["Login"] @Localizer["Login"]
</NavLink> </NavLink>
</NotAuthorized> </NotAuthorized>
Shared/NavMenu.razor
+37 -80
View File
@@ -1,19 +1,19 @@
@inherits LocalizableComponentBase @inherits LocalizableComponentBase
<nav class="flex justify-between align-center pt-3 px-3 md:p-0"> <nav class="flex justify-between items-center md:items-start pt-3 px-3 md:p-0">
<div class="relative md:w-52"> <div class="relative md:w-52">
<button class="button is-rounded inline-flex is-small neoBtnSmall relative md:hidden" @onclick="ToggleNavMenu"> <DButton Size="DSize.Sm" class="md:hidden" OnClick="ToggleNavMenu">
<i class="ion-md-menu text-lg"></i> <i class="ion-md-menu text-lg"></i>
</button> </DButton>
<div class="absolute background md:relative top-full md:top-auto mt-2 w-52 md:w-full overflow-y-auto rounded-lg neomorph is-nsmall md:shadow-none z-50 @menuToggle md:block"> <div class="absolute bg-base-100 md:relative top-full md:top-auto mt-2 w-52 md:w-full overflow-y-auto rounded-lg neo-raised neo-sm md:shadow-none! z-50 @menuToggle md:block">
<div class="flex flex-col space-y-3 p-3 md:p-4"> <div class="flex flex-col gap-3 p-3 md:p-4">
<div class="flex space-x-3 p-3 md:p-4 neomorph is-nxsmall rounded-xl bg-cover bg-no-repeat bg-right" style="background-image:linear-gradient(to left, var(--background) 55%, transparent), url('@(CascadingState.User?.BackgroundUrl)');"> <div class="flex gap-3 p-3 md:p-4 neo-raised neo-xs rounded-xl bg-cover bg-no-repeat bg-right" style="background-image:linear-gradient(to left, var(--color-base-100) 55%, transparent), url('@(CascadingState.User?.BackgroundUrl)');">
<a class="block h-8 w-8 md:h-12 md:w-12 flex-none" href="@CascadingState.User?.ProfileUrl" title="@CascadingState.User?.UserName"> <a class="block h-8 w-8 md:h-12 md:w-12 flex-none" href="@CascadingState.User?.ProfileUrl" title="@CascadingState.User?.UserName">
<img alt="@CascadingState.User?.UserName" class="h-8 w-8 md:h-12 md:w-12 object-cover rounded-full neomorph is-nxxsmall" src="@(CascadingState.User?.PictureUrl ?? "/imgs/icon-192.png")" /> <img alt="@CascadingState.User?.UserName" class="h-8 w-8 md:h-12 md:w-12 object-cover rounded-full neo-raised neo-2xs" src="@(CascadingState.User?.PictureUrl ?? "/imgs/icon-192.png")" />
</a> </a>
<div class="flex flex-col w-full min-w-0 space-y-2"> <div class="flex flex-col w-full min-w-0 gap-2">
<p class="shrink truncate"> <p class="shrink truncate">
<b title="@CascadingState.User?.DisplayName"> <b title="@CascadingState.User?.DisplayName">
@CascadingState.User?.DisplayName @CascadingState.User?.DisplayName
@@ -27,87 +27,62 @@
</div> </div>
</div> </div>
<NavLink ActiveClass="neoBtnSmallInsetPlain" class="button has-icons-left is-rounded neoBtnSmallPlain" href="/" Match="NavLinkMatch.All"> <NavLink ActiveClass="btn-active" class="btn justify-start" href="/" Match="NavLinkMatch.All">
<span class="icon is-left">
<i class="ion-md-home"></i> <i class="ion-md-home"></i>
</span>
<span>@Localizer["Home"]</span> <span>@Localizer["Home"]</span>
</NavLink> </NavLink>
<NavLink ActiveClass="neoBtnSmallInsetPlain" class="button has-icons-left is-rounded neoBtnSmallPlain" href="settings"> <NavLink ActiveClass="btn-active" class="btn justify-start" href="settings">
<span class="icon is-left">
<i class="ion-md-settings"></i> <i class="ion-md-settings"></i>
</span>
<span>@Localizer["Settings"]</span> <span>@Localizer["Settings"]</span>
</NavLink> </NavLink>
@*<AuthorizeView> @*<AuthorizeView>
<Authorized> <Authorized>
<NavLink ActiveClass="neoBtnSmallInsetPlain" class="button is-rounded neoBtnSmallPlain" href="administration"> <NavLink ActiveClass="btn-active" class="btn justify-start" href="administration">
@Localizer["Administration"] @Localizer["Administration"]
</NavLink> </NavLink>
<NavLink ActiveClass="neoBtnSmallInsetPlain" class="button is-rounded neoBtnSmallPlain" href="logout"> <NavLink ActiveClass="btn-active" class="btn justify-start" href="logout">
@Localizer["Logout"] @Localizer["Logout"]
</NavLink> </NavLink>
</Authorized> </Authorized>
<NotAuthorized> <NotAuthorized>
<NavLink ActiveClass="neoBtnSmallInsetPlain" class="button is-rounded neoBtnSmallPlain" href="login"> <NavLink ActiveClass="btn-active" class="btn justify-start" href="login">
@Localizer["Login"] @Localizer["Login"]
</NavLink> </NavLink>
</NotAuthorized> </NotAuthorized>
</AuthorizeView>*@ </AuthorizeView>*@
<NavLink ActiveClass="neoBtnSmallInsetPlain" class="button has-icons-left is-rounded neoBtnSmallPlain" href="administration"> <NavLink ActiveClass="btn-active" class="btn justify-start" href="administration">
<span class="icon is-left has-text-danger"> <i class="ion-md-switch text-error"></i>
<i class="ion-md-switch"></i>
</span>
<span>@Localizer["Administration"]</span> <span>@Localizer["Administration"]</span>
</NavLink> </NavLink>
<NavLink ActiveClass="neoBtnSmallInsetPlain" class="button has-icons-left is-rounded neoBtnSmallPlain" href="login"> <NavLink ActiveClass="btn-active" class="btn justify-start" href="login">
<span class="icon is-left has-text-success"> <i class="ion-md-log-in text-success"></i>
<i class="ion-md-log-in"></i>
</span>
<span>@Localizer["Login"]</span> <span>@Localizer["Login"]</span>
</NavLink> </NavLink>
<NavLink ActiveClass="neoBtnSmallInsetPlain" class="button has-icons-left is-rounded neoBtnSmallPlain" href="logout"> <NavLink ActiveClass="btn-active" class="btn justify-start" href="logout">
<span class="icon is-left has-text-danger"> <i class="ion-md-log-out text-error"></i>
<i class="ion-md-log-out"></i>
</span>
<span>@Localizer["Logout"]</span> <span>@Localizer["Logout"]</span>
</NavLink> </NavLink>
<div class="field is-grouped is-align-items-center"> <div class="flex items-center gap-3">
<div class="control"> <DButton Size="DSize.Sm" Shape="DButtonShape.Circle" class="flex-none" OnClick="ResetToOriginalColour"
<button @onclick:stopPropagation @onclick:preventDefault @onclick="ResetToOriginalColour" class="button is-rounded has-icons-left is-small mb-0 ml-0 neoBtn" style="background:hsl(25,84%,88%) !important" title="@Localizer["Reset"]">
type="button"> <i class="ion-md-refresh"></i>
<span class="icon is-left"></span> </DButton>
</button> <DRange TValue="short" class="neo-hue-track w-full" Size="DSize.Xs" Min="0" Max="359" Step="1"
</div> Value="ThemeIndexColour" ValueChanged="UpdateThemeColour" ValueExpression="() => ThemeIndexColour" />
<div class="control is-expanded is-flex">
<input class="neoRange fullwidth" id="ColourIndex_@(RandomId)"
max="359" min="0" @onchange="UpdateThemeColour" step="1" type="range" value="@ThemeIndexColour">
</div>
</div> </div>
<EditForm class="field is-grouped is-grouped-right" Context="DarkModeForm" Model="ThemeIsDarkMode"> <div class="flex justify-end">
<div class="control"> <DToggle Value="ThemeIsDarkMode" ValueChanged="async v => await UpdateThemeDarkMode(v)" ValueExpression="() => ThemeIsDarkMode">
<label> <UncheckedIcon>
<InputCheckbox class="toggle-checkbox" <i class="ion-md-sunny"></i>
Value="ThemeIsDarkMode" ValueChanged="async v => await UpdateThemeDarkMode(v)" ValueExpression="() => ThemeIsDarkMode" /> </UncheckedIcon>
<div class="toggle-slot neomorph is-nxxsmall cursor-pointer"> <CheckedIcon>
<div class="sun-icon-wrapper"> <i class="ion-md-moon"></i>
<div class="sun-icon"> </CheckedIcon>
<i class="ion-md-sunny text-xs"></i> </DToggle>
</div> </div>
</div>
<div class="toggle-button"></div>
<div class="moon-icon-wrapper">
<div class="moon-icon">
<i class="ion-md-moon text-xs"></i>
</div>
</div>
</div>
</label>
</div>
</EditForm>
</div> </div>
</div> </div>
@@ -118,25 +93,10 @@
</div> </div>
<div class="md:hidden"> <div class="md:hidden">
<a class="neomorph is-nxxsmall" href="settings"> <a class="block rounded-full neo-raised neo-2xs" href="settings">
<img alt="@CascadingState.User?.UserName" class="object-cover w-[30px] h-[30px] rounded-full" <img alt="@CascadingState.User?.UserName" class="object-cover w-[30px] h-[30px] rounded-full"
src="@CascadingState.User?.PictureUrl"> src="@CascadingState.User?.PictureUrl">
</a> </a>
@* <button class="button is-rounded is-small has-icons-left neoBtnSmall "> *@
@* $1$ <AuthorizeView> #1# *@
@* $1$ <Authorized> #1# *@
@* $1$ <span class="icon is-left"> #1# *@
@* $1$ <img alt="@CascadingState.User.UserName" class="object-cover" src="@CascadingState.User.PictureUrl"> #1# *@
@* $1$ </span> #1# *@
@* $1$ </Authorized> #1# *@
@* $1$ <NotAuthorized> #1# *@
@* $1$ <span class="icon is-left"> #1# *@
@* $1$ <i class="ion-md-person"></i> #1# *@
@* $1$ </span> #1# *@
@* $1$ </NotAuthorized> #1# *@
@* $1$ </AuthorizeView> #1# *@
@* </button> *@
</div> </div>
</nav> </nav>
@@ -147,14 +107,12 @@
bool IsThemeChanging { get; set; } = false; bool IsThemeChanging { get; set; } = false;
bool ThemeIsDarkMode { get; set; } = false; bool ThemeIsDarkMode { get; set; } = false;
short ThemeIndexColour { get; set; } = 25; short ThemeIndexColour { get; set; } = 25;
int RandomId { get; set; }
protected override async Task OnInitializedAsync() protected override async Task OnInitializedAsync()
{ {
await Task.Run(() => await Task.Run(() =>
{ {
}); });
RandomId = Random.Shared.Next(0, int.MaxValue);
if (!CascadingState.Status.IsMobileMedia()) if (!CascadingState.Status.IsMobileMedia())
menuToggle = default; menuToggle = default;
@@ -186,10 +144,9 @@
IsThemeChanging = false; IsThemeChanging = false;
} }
protected async Task UpdateThemeColour(ChangeEventArgs eventArgs) protected async Task UpdateThemeColour(short indexColour)
{ {
IsThemeChanging = true; IsThemeChanging = true;
var indexColour = short.Parse(eventArgs.Value?.ToString());
CascadingState.PublicCacheData.PageSettings.LightThemeIndexColour = CascadingState.PublicCacheData.PageSettings.LightThemeIndexColour =
ThemeIndexColour = ThemeIndexColour =
indexColour; indexColour;
Styles/neo.css
+12
View File
@@ -145,6 +145,18 @@
&:not(:where(.select-ghost, .select-neutral, .select-primary, .select-secondary, .select-accent, .select-info, .select-success, .select-warning, .select-error, .validator:user-invalid, [aria-invalid="true"])) { &:not(:where(.select-ghost, .select-neutral, .select-primary, .select-secondary, .select-accent, .select-info, .select-success, .select-warning, .select-error, .validator:user-invalid, [aria-invalid="true"])) {
border-color: transparent; border-color: transparent;
} }
/* label.select: the inner select inherits the label's background and pulls itself .75rem to the left, which
daisyUI expects a span.label to absorb. Let the well show through and give any other prefix (an icon) the same
room. */
& > select {
background-color: transparent;
}
& > :first-child:not(select, .label) {
flex-shrink: 0;
margin-inline-end: .75rem;
}
} }
@utility textarea { @utility textarea {