minor UI improvements

This commit is contained in:
Mia Rose Winter 2024-08-21 15:39:09 +02:00
parent 69a5d51214
commit ade03f28b9
Signed by: miawinter
GPG key ID: 4B6F6A83178F595E
3 changed files with 52 additions and 28 deletions

View file

@ -1,7 +1,15 @@
@using Wave.Data
@if (Articles.Count < 1) {
<p>No Articles</p>
<div class="flex space-x-3 bg-base-200 text-base-content p-2 rounded">
<div class="skeleton h-32 w-32 max-lg:hidden"></div>
<div class="flex flex-col space-y-1 p-2">
<h2 class="card-title line-clamp-1">No Articles</h2>
<div class="skeleton h-4 w-28"></div>
<div class="skeleton h-4 w-28"></div>
<div class="skeleton h-4 w-20"></div>
</div>
</div>
} else {
<div class="flex flex-col gap-4">
@foreach (var article in Articles.OrderByDescending(a => a.PublishDate)) {

View file

@ -47,37 +47,52 @@
</header>
</SectionContent>
@if (Article.Headings.Count > 0) {
<section class="mb-3 p-2 bg-base-200 rounded-box w-80 float-start mr-2 mb-2" data-nosnippet>
<h2 class="text-xl font-bold mb-3">@Localizer["TableOfContents"]</h2>
<ul class="menu p-0 [&_li>*]:rounded-none">
@{
int level = 1;
foreach (var heading in Article.Headings.OrderBy(h => h.Order)) {
int headingLevel = heading.Order % 10;
@if (Article.Headings.Count > 1) {
<section class="p-2 bg-base-200 max-w-[28rem] rounded-box" data-nosnippet>
<details class="group" open>
<summary class="list-none">
<div class="flex gap-2 mb-2">
<div class="cursor-pointer grid place-content-center">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-4 block group-open:hidden">
<path stroke-linecap="round" stroke-linejoin="round" d="m8.25 4.5 7.5 7.5-7.5 7.5" />
</svg>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-4 hidden group-open:block">
<path stroke-linecap="round" stroke-linejoin="round" d="m19.5 8.25-7.5 7.5-7.5-7.5" />
</svg>
</div>
<h2 class="cursor-pointer text-xl font-bold select-none">@Localizer["TableOfContents"]</h2>
</div>
</summary>
<ul class="menu p-0 pl-4 [&_li>*]:rounded-none">
@{
int level = 1;
foreach (var heading in Article.Headings.OrderBy(h => h.Order)) {
int headingLevel = heading.Order % 10;
while (headingLevel < level) {
level--;
@(new MarkupString("</ul></li>"))
while (headingLevel < level) {
level--;
@(new MarkupString("</ul></li>"))
}
while (headingLevel > level) {
level++;
@(new MarkupString("<li><ul>"))
}
<li>
<a href="/@Navigation.ToBaseRelativePath(Navigation.Uri)#@heading.Anchor">@((MarkupString)heading.Label)</a>
</li>
}
while (headingLevel > level) {
level++;
while (level > 1) {
level--;
@(new MarkupString("<li><ul>"))
}
<li>
<a href="/@Navigation.ToBaseRelativePath(Navigation.Uri)#@heading.Anchor">@((MarkupString)heading.Label)</a>
</li>
}
while (level > 1) {
level--;
@(new MarkupString("<li><ul>"))
}
}
</ul>
</ul>
</details>
</section>
<hr class="my-6" />
}
<article class="mb-6">

View file

@ -1,7 +1,6 @@
@page "/article/new"
@page "/article/{id:guid}/edit"
@using System.ComponentModel.DataAnnotations
@using Vite.AspNetCore
@using Wave.Data
@using Wave.Utilities
@ -22,8 +21,10 @@
<h1 class="text-3xl lg:text-5xl font-light mb-6 text-primary">@Localizer["EditorTitle"]</h1>
<div id="editor">
<div class="flex place-content-center">
<p>Loading Interactive Editor </p>
<span class="loading loading-spinner loading-lg"></span>
<div class="flex flex-col gap-2 items-center">
<span class="loading loading-spinner loading-lg"></span>
<p>Loading Interactive Editor </p>
</div>
</div>
</div>