winter-software/Wave
winter-software/Wave
1
0
Fork 0
Code Issues Wiki Activity

improved document structure for accessability

Browse source
This commit is contained in:
Mia Rose Winter 2024-02-06 20:25:10 +01:00
parent a21049747c
commit 7850d293da
Signed by: miawinter
GPG key ID: 4B6F6A83178F595E
4 changed files with 84 additions and 82 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
Wave/Components/ArticleComponent.razor
View file

@ -5,7 +5,7 @@
@inject IStringLocalizer<Pages.ArticleView> Localizer @inject IStringLocalizer<Pages.ArticleView> Localizer
<SectionContent SectionName="GlobalHeader"> <SectionContent SectionName="GlobalHeader">
<div class="bg-secondary text-secondary-content border-b-2 border-current py-6 px-12"> <header class="bg-secondary text-secondary-content border-b-2 border-current py-6 px-4 md:px-12">
<h1 class="text-3xl lg:text-5xl font-light"> <h1 class="text-3xl lg:text-5xl font-light">
@Article.Title @Article.Title
</h1> </h1>
@ -35,7 +35,7 @@
} }
</p> </p>
} }
</div> </header>
</SectionContent> </SectionContent>
<article class="mb-6"> <article class="mb-6">
<div class="prose prose-neutral max-w-none hyphens-auto text-justify"> <div class="prose prose-neutral max-w-none hyphens-auto text-justify">

20
Wave/Components/Layout/MainLayout.razor
View file

@ -14,7 +14,7 @@
<input id="main-drawer" type="checkbox" class="drawer-toggle" /> <input id="main-drawer" type="checkbox" class="drawer-toggle" />
<div class="drawer-content"> <div class="drawer-content">
<div class="flex flex-col h-screen overflow-x-auto"> <div class="flex flex-col h-screen overflow-x-auto">
<header class="md:hidden p-4 flex justify-between bg-base-200"> <div class="md:hidden p-4 flex justify-between bg-base-200">
<div class="h-12"> <div class="h-12">
<LogoPartial/> <LogoPartial/>
</div> </div>
@ -23,10 +23,12 @@
<path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" /> <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" />
</svg> </svg>
</label> </label>
</header> </div>
<SectionOutlet SectionName="GlobalHeader" /> <main class="flex-1">
<main class="flex-1 container mx-auto px-12 py-8"> <SectionOutlet SectionName="GlobalHeader" />
@Body <div class="container mx-auto px-4 md:px-12 py-8">
@Body
</div>
</main> </main>
<footer class="flex flex-col md:flex-row items-center justify-center p-4 gap-y-3 gap-x-4 bg-base-300 text-base-content"> <footer class="flex flex-col md:flex-row items-center justify-center p-4 gap-y-3 gap-x-4 bg-base-300 text-base-content">
<span class="flex-1 text-center md:text-left"> <span class="flex-1 text-center md:text-left">
@ -38,12 +40,12 @@
} }
</span> </span>
<div class="join w-56" title="@Localizer["Language_Label"]"> <div class="join w-56" title="@Localizer["Language_Label"]">
<button type="button" class="btn btn-sm btn-neutral btn-square no-animation join-item"> <button type="button" class="btn btn-sm btn-neutral btn-square no-animation join-item" aria-hidden="true" tabindex="-1">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="w-6 h-6"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="w-6 h-6">
<path d="M21.721 12.752a9.711 9.711 0 0 0-.945-5.003 12.754 12.754 0 0 1-4.339 2.708 18.991 18.991 0 0 1-.214 4.772 17.165 17.165 0 0 0 5.498-2.477ZM14.634 15.55a17.324 17.324 0 0 0 .332-4.647c-.952.227-1.945.347-2.966.347-1.021 0-2.014-.12-2.966-.347a17.515 17.515 0 0 0 .332 4.647 17.385 17.385 0 0 0 5.268 0ZM9.772 17.119a18.963 18.963 0 0 0 4.456 0A17.182 17.182 0 0 1 12 21.724a17.18 17.18 0 0 1-2.228-4.605ZM7.777 15.23a18.87 18.87 0 0 1-.214-4.774 12.753 12.753 0 0 1-4.34-2.708 9.711 9.711 0 0 0-.944 5.004 17.165 17.165 0 0 0 5.498 2.477ZM21.356 14.752a9.765 9.765 0 0 1-7.478 6.817 18.64 18.64 0 0 0 1.988-4.718 18.627 18.627 0 0 0 5.49-2.098ZM2.644 14.752c1.682.971 3.53 1.688 5.49 2.099a18.64 18.64 0 0 0 1.988 4.718 9.765 9.765 0 0 1-7.478-6.816ZM13.878 2.43a9.755 9.755 0 0 1 6.116 3.986 11.267 11.267 0 0 1-3.746 2.504 18.63 18.63 0 0 0-2.37-6.49ZM12 2.276a17.152 17.152 0 0 1 2.805 7.121c-.897.23-1.837.353-2.805.353-.968 0-1.908-.122-2.805-.353A17.151 17.151 0 0 1 12 2.276ZM10.122 2.43a18.629 18.629 0 0 0-2.37 6.49 11.266 11.266 0 0 1-3.746-2.504 9.754 9.754 0 0 1 6.116-3.985Z" /> <path d="M21.721 12.752a9.711 9.711 0 0 0-.945-5.003 12.754 12.754 0 0 1-4.339 2.708 18.991 18.991 0 0 1-.214 4.772 17.165 17.165 0 0 0 5.498-2.477ZM14.634 15.55a17.324 17.324 0 0 0 .332-4.647c-.952.227-1.945.347-2.966.347-1.021 0-2.014-.12-2.966-.347a17.515 17.515 0 0 0 .332 4.647 17.385 17.385 0 0 0 5.268 0ZM9.772 17.119a18.963 18.963 0 0 0 4.456 0A17.182 17.182 0 0 1 12 21.724a17.18 17.18 0 0 1-2.228-4.605ZM7.777 15.23a18.87 18.87 0 0 1-.214-4.774 12.753 12.753 0 0 1-4.34-2.708 9.711 9.711 0 0 0-.944 5.004 17.165 17.165 0 0 0 5.498 2.477ZM21.356 14.752a9.765 9.765 0 0 1-7.478 6.817 18.64 18.64 0 0 0 1.988-4.718 18.627 18.627 0 0 0 5.49-2.098ZM2.644 14.752c1.682.971 3.53 1.688 5.49 2.099a18.64 18.64 0 0 0 1.988 4.718 9.765 9.765 0 0 1-7.478-6.816ZM13.878 2.43a9.755 9.755 0 0 1 6.116 3.986 11.267 11.267 0 0 1-3.746 2.504 18.63 18.63 0 0 0-2.37-6.49ZM12 2.276a17.152 17.152 0 0 1 2.805 7.121c-.897.23-1.837.353-2.805.353-.968 0-1.908-.122-2.805-.353A17.151 17.151 0 0 1 12 2.276ZM10.122 2.43a18.629 18.629 0 0 0-2.37 6.49 11.266 11.266 0 0 1-3.746-2.504 9.754 9.754 0 0 1 6.116-3.985Z" />
</svg> </svg>
</button> </button>
<select class="select select-bordered select-sm md:text-center join-item min-w-0 flex-1" <select class="select select-bordered select-sm md:text-center join-item min-w-0 flex-1" aria-label="@Localizer["Language_Label"]"
onchange="window.location = `/language/${this.value}?returnUrl=@WebUtility.UrlEncode("/" + Navigation.ToBaseRelativePath(Navigation.Uri))`"> onchange="window.location = `/language/${this.value}?returnUrl=@WebUtility.UrlEncode("/" + Navigation.ToBaseRelativePath(Navigation.Uri))`">
@foreach (var culture in LocalizationOptions.Value.SupportedCultures ?? new List<CultureInfo>()) { @foreach (var culture in LocalizationOptions.Value.SupportedCultures ?? new List<CultureInfo>()) {
<option value="@culture" <option value="@culture"
@ -54,13 +56,13 @@
</select> </select>
</div> </div>
<div class="join w-56" title="@Localizer["Theme_Label"]"> <div class="join w-56" title="@Localizer["Theme_Label"]">
<button type="button" class="btn btn-square btn-sm btn-neutral no-animation join-item"> <button type="button" class="btn btn-square btn-sm btn-neutral no-animation join-item" aria-hidden="true" tabindex="-1">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="w-6 h-6"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="w-6 h-6">
<path fill-rule="evenodd" d="M2.25 4.125c0-1.036.84-1.875 1.875-1.875h5.25c1.036 0 1.875.84 1.875 1.875V17.25a4.5 4.5 0 1 1-9 0V4.125Zm4.5 14.25a1.125 1.125 0 1 0 0-2.25 1.125 1.125 0 0 0 0 2.25Z" clip-rule="evenodd" /> <path fill-rule="evenodd" d="M2.25 4.125c0-1.036.84-1.875 1.875-1.875h5.25c1.036 0 1.875.84 1.875 1.875V17.25a4.5 4.5 0 1 1-9 0V4.125Zm4.5 14.25a1.125 1.125 0 1 0 0-2.25 1.125 1.125 0 0 0 0 2.25Z" clip-rule="evenodd" />
<path d="M10.719 21.75h9.156c1.036 0 1.875-.84 1.875-1.875v-5.25c0-1.036-.84-1.875-1.875-1.875h-.14l-8.742 8.743c-.09.089-.18.175-.274.257ZM12.738 17.625l6.474-6.474a1.875 1.875 0 0 0 0-2.651L15.5 4.787a1.875 1.875 0 0 0-2.651 0l-.1.099V17.25c0 .126-.003.251-.01.375Z" /> <path d="M10.719 21.75h9.156c1.036 0 1.875-.84 1.875-1.875v-5.25c0-1.036-.84-1.875-1.875-1.875h-.14l-8.742 8.743c-.09.089-.18.175-.274.257ZM12.738 17.625l6.474-6.474a1.875 1.875 0 0 0 0-2.651L15.5 4.787a1.875 1.875 0 0 0-2.651 0l-.1.099V17.25c0 .126-.003.251-.01.375Z" />
</svg> </svg>
</button> </button>
<select id="theme-select" class="select select-bordered select-sm md:text-center join-item min-w-0 flex-1" <select id="theme-select" class="select select-bordered select-sm md:text-center join-item min-w-0 flex-1" aria-label="@Localizer["Theme_Label"]"
onchange="window.location = `/theme/${this.value}?returnUrl=@WebUtility.UrlEncode("/" + Navigation.ToBaseRelativePath(Navigation.Uri))`"> onchange="window.location = `/theme/${this.value}?returnUrl=@WebUtility.UrlEncode("/" + Navigation.ToBaseRelativePath(Navigation.Uri))`">
<option selected="@(UserTheme is null)" value="">@Localizer["Theme_Default"]</option> <option selected="@(UserTheme is null)" value="">@Localizer["Theme_Default"]</option>
<option selected="@(UserTheme is "wave-light")" value="wave-light">@Localizer["Theme_WaveLight"]</option> <option selected="@(UserTheme is "wave-light")" value="wave-light">@Localizer["Theme_WaveLight"]</option>

140
Wave/Components/Layout/NavMenu.razor
View file

@ -4,83 +4,83 @@
@inject NavigationManager NavigationManager @inject NavigationManager NavigationManager
@inject IStringLocalizer<NavMenu> Localizer @inject IStringLocalizer<NavMenu> Localizer
<header class="h-12 hidden md:block"> <div class="h-12 hidden md:block" role="banner" aria-label="logo">
<LogoPartial /> <LogoPartial />
</header> </div>
<nav class="flex-1"> <nav class="flex-1 flex flex-col justify-between" aria-label="Main">
<ul class="menu"> <ul class="menu" aria-label="site navigation">
<li><NavLink href="" Match="NavLinkMatch.All">@Localizer["Home_Label"]</NavLink></li> <li><NavLink href="" Match="NavLinkMatch.All">@Localizer["Home_Label"]</NavLink></li>
<AuthorizeView Policy="ArticleEditPermissions"> <AuthorizeView Policy="ArticleEditPermissions">
<Authorized> <Authorized>
<li><NavLink href="article/new" data-enhance-nav="false">@Localizer["ArticleNew_Label"]</NavLink></li> <li><NavLink href="article/new" data-enhance-nav="false">@Localizer["ArticleNew_Label"]</NavLink></li>
<li><NavLink href="drafts">@Localizer["Drafts_Label"]</NavLink></li> <li><NavLink href="drafts">@Localizer["Drafts_Label"]</NavLink></li>
</Authorized>
</AuthorizeView>
<AuthorizeView Policy="ArticleReviewPermissions">
<Authorized>
<li><NavLink href="review">@Localizer["Review_Label"]</NavLink></li>
</Authorized> </Authorized>
</AuthorizeView> </AuthorizeView>
<AuthorizeView Policy="ArticleDeletePermissions"> <AuthorizeView Policy="ArticleReviewPermissions">
<Authorized> <Authorized>
<li><NavLink href="future">@Localizer["Future_Label"]</NavLink></li> <li><NavLink href="review">@Localizer["Review_Label"]</NavLink></li>
</Authorized> </Authorized>
</AuthorizeView> </AuthorizeView>
<AuthorizeView Policy="CategoryManagePermissions"> <AuthorizeView Policy="ArticleDeletePermissions">
<Authorized> <Authorized>
<li><NavLink href="manage/categories">@Localizer["ManageCategories_Label"]</NavLink></li> <li><NavLink href="future">@Localizer["Future_Label"]</NavLink></li>
</Authorized> </Authorized>
</AuthorizeView> </AuthorizeView>
<AuthorizeView Policy="RoleAssignPermissions"> <AuthorizeView Policy="CategoryManagePermissions">
<Authorized> <Authorized>
<li><NavLink href="manage/users">@Localizer["ManageUsers_Label"]</NavLink></li> <li><NavLink href="manage/categories">@Localizer["ManageCategories_Label"]</NavLink></li>
</Authorized> </Authorized>
</AuthorizeView> </AuthorizeView>
<AuthorizeView Policy="RoleAssignPermissions">
<Authorized>
<li><NavLink href="manage/users">@Localizer["ManageUsers_Label"]</NavLink></li>
</Authorized>
</AuthorizeView>
</ul>
<ul class="menu gap-2" aria-label="Account">
<AuthorizeView>
<Authorized>
<li class="flex gap-2">
<NavLink href="Account/Manage">
<span class="line-clamp-2">@context.User.FindFirst("FullName")!.Value</span>
<div class="w-8">
<ProfilePictureComponent Size="100" ProfileId="@context.User.FindFirst("Id")!.Value" />
</div>
</NavLink>
</li>
<li class="">
<form action="Account/Logout" method="post">
<AntiforgeryToken />
<input type="hidden" name="ReturnUrl" value="@_currentUrl" />
<button type="submit" class="flex gap-2">
@Localizer["Logout_Label"]
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="w-5 h-5">
<path fill-rule="evenodd" d="M3 4.25A2.25 2.25 0 0 1 5.25 2h5.5A2.25 2.25 0 0 1 13 4.25v2a.75.75 0 0 1-1.5 0v-2a.75.75 0 0 0-.75-.75h-5.5a.75.75 0 0 0-.75.75v11.5c0 .414.336.75.75.75h5.5a.75.75 0 0 0 .75-.75v-2a.75.75 0 0 1 1.5 0v2A2.25 2.25 0 0 1 10.75 18h-5.5A2.25 2.25 0 0 1 3 15.75V4.25Z" clip-rule="evenodd" />
<path fill-rule="evenodd" d="M6 10a.75.75 0 0 1 .75-.75h9.546l-1.048-.943a.75.75 0 1 1 1.004-1.114l2.5 2.25a.75.75 0 0 1 0 1.114l-2.5 2.25a.75.75 0 1 1-1.004-1.114l1.048-.943H6.75A.75.75 0 0 1 6 10Z" clip-rule="evenodd" />
</svg>
</button>
</form>
</li>
</Authorized>
<NotAuthorized>
<li>
<NavLink href="Account/Login">
@Localizer["Login_Label"]
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="w-5 h-5">
<path fill-rule="evenodd" d="M17 4.25A2.25 2.25 0 0 0 14.75 2h-5.5A2.25 2.25 0 0 0 7 4.25v2a.75.75 0 0 0 1.5 0v-2a.75.75 0 0 1 .75-.75h5.5a.75.75 0 0 1 .75.75v11.5a.75.75 0 0 1-.75.75h-5.5a.75.75 0 0 1-.75-.75v-2a.75.75 0 0 0-1.5 0v2A2.25 2.25 0 0 0 9.25 18h5.5A2.25 2.25 0 0 0 17 15.75V4.25Z" clip-rule="evenodd" />
<path fill-rule="evenodd" d="M1 10a.75.75 0 0 1 .75-.75h9.546l-1.048-.943a.75.75 0 1 1 1.004-1.114l2.5 2.25a.75.75 0 0 1 0 1.114l-2.5 2.25a.75.75 0 1 1-1.004-1.114l1.048-.943H1.75A.75.75 0 0 1 1 10Z" clip-rule="evenodd" />
</svg>
</NavLink>
</li>
<li>
<NavLink href="Account/Register">
@Localizer["SignUp_Label"]
</NavLink>
</li>
</NotAuthorized>
</AuthorizeView>
</ul> </ul>
</nav> </nav>
<ul class="menu gap-2">
<AuthorizeView>
<Authorized>
<li class="flex gap-2">
<NavLink href="Account/Manage">
<span class="line-clamp-2">@context.User.FindFirst("FullName")!.Value</span>
<div class="w-8">
<ProfilePictureComponent Size="100" ProfileId="@context.User.FindFirst("Id")!.Value" />
</div>
</NavLink>
</li>
<li class="">
<form action="Account/Logout" method="post">
<AntiforgeryToken />
<input type="hidden" name="ReturnUrl" value="@_currentUrl" />
<button type="submit" class="flex gap-2">
@Localizer["Logout_Label"]
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="w-5 h-5">
<path fill-rule="evenodd" d="M3 4.25A2.25 2.25 0 0 1 5.25 2h5.5A2.25 2.25 0 0 1 13 4.25v2a.75.75 0 0 1-1.5 0v-2a.75.75 0 0 0-.75-.75h-5.5a.75.75 0 0 0-.75.75v11.5c0 .414.336.75.75.75h5.5a.75.75 0 0 0 .75-.75v-2a.75.75 0 0 1 1.5 0v2A2.25 2.25 0 0 1 10.75 18h-5.5A2.25 2.25 0 0 1 3 15.75V4.25Z" clip-rule="evenodd" />
<path fill-rule="evenodd" d="M6 10a.75.75 0 0 1 .75-.75h9.546l-1.048-.943a.75.75 0 1 1 1.004-1.114l2.5 2.25a.75.75 0 0 1 0 1.114l-2.5 2.25a.75.75 0 1 1-1.004-1.114l1.048-.943H6.75A.75.75 0 0 1 6 10Z" clip-rule="evenodd" />
</svg>
</button>
</form>
</li>
</Authorized>
<NotAuthorized>
<li>
<NavLink href="Account/Login">
@Localizer["Login_Label"]
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="w-5 h-5">
<path fill-rule="evenodd" d="M17 4.25A2.25 2.25 0 0 0 14.75 2h-5.5A2.25 2.25 0 0 0 7 4.25v2a.75.75 0 0 0 1.5 0v-2a.75.75 0 0 1 .75-.75h5.5a.75.75 0 0 1 .75.75v11.5a.75.75 0 0 1-.75.75h-5.5a.75.75 0 0 1-.75-.75v-2a.75.75 0 0 0-1.5 0v2A2.25 2.25 0 0 0 9.25 18h5.5A2.25 2.25 0 0 0 17 15.75V4.25Z" clip-rule="evenodd" />
<path fill-rule="evenodd" d="M1 10a.75.75 0 0 1 .75-.75h9.546l-1.048-.943a.75.75 0 1 1 1.004-1.114l2.5 2.25a.75.75 0 0 1 0 1.114l-2.5 2.25a.75.75 0 1 1-1.004-1.114l1.048-.943H1.75A.75.75 0 0 1 1 10Z" clip-rule="evenodd" />
</svg>
</NavLink>
</li>
<li>
<NavLink href="Account/Register">
@Localizer["SignUp_Label"]
</NavLink>
</li>
</NotAuthorized>
</AuthorizeView>
</ul>
@code { @code {
private string? _currentUrl; private string? _currentUrl;

2
Wave/wwwroot/css/main.min.css vendored
View file

File diff suppressed because one or more lines are too long