Files
Elternbeirat/Elternbeirat.Web/Features/Home/Home.razor
T

80 lines
2.9 KiB
Plaintext

@page "/"
@using Elternbeirat.Web.Features.Events
<PageTitle>Elternbeirat der IGMH</PageTitle>
@* The hero spans the full window width (see Home.razor.css). Its text is the "home"
page's body, taken apart by HomeIntro; the card beside it shows the next event. *@
<section class="hero">
<div class="hero-inner">
<div class="hero-text">
<h1>@_intro.Title</h1>
@if (_intro.IntroHtml.Length > 0)
{
<div class="hero-intro">@((MarkupString)_intro.IntroHtml)</div>
}
@if (_intro.Links.Count > 0)
{
<p class="hero-actions">
@for (var i = 0; i < _intro.Links.Count; i++)
{
var link = _intro.Links[i];
<a class="btn @(i == 0 ? "btn-primary" : "btn-secondary")" href="@link.Href">@link.Text</a>
}
</p>
}
</div>
@if (_nextEvent is not null)
{
@* The calendar sheet repeats the date as decoration, so it is hidden from
screen readers; <EventDate> carries the full date for everyone. *@
<a class="next-event" href="/events">
<span class="next-event-label">Nächster Termin</span>
<span class="next-event-row">
<span class="calendar-sheet" aria-hidden="true">
<span class="calendar-month">@NextEventMonth</span>
<span class="calendar-day">@NextEventDay</span>
</span>
<span class="next-event-details">
<span class="next-event-title">@_nextEvent.Title</span>
<EventDate Value="_nextEvent" />
@if (!string.IsNullOrWhiteSpace(_nextEvent.Location))
{
<span class="next-event-location"><Icon Name="map-pin" Size="16" /> @_nextEvent.Location</span>
}
</span>
</span>
</a>
}
</div>
</section>
@if (_tiles.Count > 0)
{
<section class="home-tiles" aria-labelledby="home-tiles-title">
<h2 id="home-tiles-title">Bereiche im Überblick</h2>
<ul>
@foreach (var tile in _tiles)
{
<li>
<a class="tile-link" href="@tile.Href">
<span class="tile-icon"><Icon Name="@tile.Icon" Size="24" /></span>
<span class="tile-title">@tile.Title</span>
@if (tile.Description.Length > 0)
{
<span class="tile-text">@tile.Description</span>
}
</a>
</li>
}
</ul>
</section>
}
<div class="home-embeds">
<PageEmbeds Embed="_embed" />
</div>