47 lines
2.0 KiB
Plaintext
47 lines
2.0 KiB
Plaintext
@page "/posts/{Slug}"
|
|
|
|
@if (_unavailable)
|
|
{
|
|
<PageTitle>Vorübergehend nicht erreichbar</PageTitle>
|
|
<p>Der Beitrag ist gerade nicht erreichbar. Bitte später erneut versuchen.</p>
|
|
}
|
|
else if (_post is not null)
|
|
{
|
|
<PageTitle>@_post.Title</PageTitle>
|
|
@* A plain link, not a <nav>: one link is no navigation block, and an unlabelled
|
|
second <nav> next to the main menu would only add noise for screen readers. *@
|
|
<a class="btn btn-quiet" href="/posts"><Icon Name="arrow-left" Size="18" />Alle Beiträge</a>
|
|
|
|
<article class="post">
|
|
<header class="post-header">
|
|
<p class="post-meta"><Icon Name="calendar" Size="16" /><PostDate Value="_post.Date" /></p>
|
|
<h1>@_post.Title</h1>
|
|
</header>
|
|
<div class="markdown-body post-body">@Body</div>
|
|
</article>
|
|
|
|
@if (_neighbors.Previous is not null || _neighbors.Next is not null)
|
|
{
|
|
@* Older post on the left, newer on the right, like a timeline. A missing side
|
|
leaves its cell empty, so the remaining link keeps its place. *@
|
|
<nav class="post-pager" aria-label="Weitere Beiträge">
|
|
@if (_neighbors.Previous is { } previous)
|
|
{
|
|
<a class="post-pager-link post-pager-previous" href="/posts/@previous.Slug" rel="prev">
|
|
<span class="post-pager-label"><Icon Name="arrow-left" Size="16" />Vorheriger Beitrag</span>
|
|
<span class="post-pager-title">@previous.Title</span>
|
|
</a>
|
|
}
|
|
@if (_neighbors.Next is { } next)
|
|
{
|
|
<a class="post-pager-link post-pager-next" href="/posts/@next.Slug" rel="next">
|
|
<span class="post-pager-label">Nächster Beitrag<Icon Name="arrow-right" Size="16" /></span>
|
|
<span class="post-pager-title">@next.Title</span>
|
|
</a>
|
|
}
|
|
</nav>
|
|
}
|
|
}
|
|
@* No post and not unavailable: the slug was unknown; NavigationManager.NotFound()
|
|
already ran in OnParametersSetAsync and renders the not-found page. *@
|