Add aria labels

This commit is contained in:
supercolbat 2023-08-05 14:48:27 -05:00
parent 4871b83850
commit df312d3c55
No known key found for this signature in database
GPG Key ID: 4C9B319E75DD8072
2 changed files with 38 additions and 13 deletions

View File

@ -49,28 +49,38 @@
</div> </div>
<div class="children:text-text flex flex-row items-center gap-4 text-lg"> <div class="children:text-text flex flex-row items-center gap-4 text-lg">
{#if user.email} {#if user.email}
<a href="mailto:{user.email}"><div class="i-ic:outline-email" /></a> <a
href="mailto:{user.email}"
aria-label="Email"><div class="i-ic:outline-email" /></a
>
{/if} {/if}
{#if user.matrix} {#if user.matrix}
<a href="https://matrix.to/#/{user.matrix}" <a
><div class="i-simple-icons:matrix" /></a href="https://matrix.to/#/{user.matrix}"
aria-label="Matrix"><div class="i-simple-icons:matrix" /></a
> >
{/if} {/if}
{#if user.fediverse} {#if user.fediverse}
<a href="https://{user.fediverse}" <a
href="https://{user.fediverse}"
aria-label="Fediverse"
><div class="i-simple-icons:mastodon" /></a ><div class="i-simple-icons:mastodon" /></a
> >
{/if} {/if}
{#if user.website} {#if user.website}
<a href={user.website}><div class="i-ic:outline-language" /></a> <a
href={user.website}
aria-label="Website"><div class="i-ic:outline-language" /></a
>
{/if} {/if}
{#if user.capsule} {#if user.capsule}
<a <a
href="https://geminiproxy.p.projectsegfau.lt/gemini/{user.capsule}" href="https://geminiproxy.p.projectsegfau.lt/gemini/{user.capsule}"
aria-label="Gemini"
class="no-underline text-base">Gemini</a class="no-underline text-base">Gemini</a
> >
{/if} {/if}

View File

@ -20,40 +20,55 @@
</div> </div>
<div class="children:text-text flex flex-row gap-4 text-lg"> <div class="children:text-text flex flex-row gap-4 text-lg">
{#if member.website} {#if member.website}
<a href={member.website} <a
href={member.website}
aria-label="Website"
><div class="i-ic:outline-language" /></a ><div class="i-ic:outline-language" /></a
> >
{/if} {/if}
{#if member.matrix} {#if member.matrix}
<a href={member.matrix} <a
href={member.matrix}
aria-label="Matrix"
><div class="i-simple-icons:matrix" /></a ><div class="i-simple-icons:matrix" /></a
> >
{/if} {/if}
{#if member.xmpp} {#if member.xmpp}
<a href={member.xmpp}><div class="i-simple-icons:xmpp" /></a <a
href={member.xmpp}
aria-label="XMPP"><div class="i-simple-icons:xmpp" /></a
> >
{/if} {/if}
{#if member.fedi} {#if member.fedi}
<a href={member.fedi} <a
href={member.fedi}
aria-label="Fediverse"
><div class="i-simple-icons:mastodon" /></a ><div class="i-simple-icons:mastodon" /></a
> >
{/if} {/if}
{#if member.git} {#if member.git}
<a href={member.git}><div class="i-simple-icons:git" /></a> <a
href={member.git}
aria-label="Git"><div class="i-simple-icons:git" /></a
>
{/if} {/if}
{#if member.email} {#if member.email}
<a href="mailto:{member.email}" <a
><div class="i-ic:outline-email" /></a href="mailto:{member.email}"
aria-label="Email"><div class="i-ic:outline-email" /></a
> >
{/if} {/if}
{#if member.pgp} {#if member.pgp}
<a href={member.pgp}><div class="i-ic:outline-vpn-key" /></a <a
href={member.pgp}
aria-label="PGP key"
><div class="i-ic:outline-vpn-key" /></a
> >
{/if} {/if}
</div> </div>