feat: add aria-label to buttons and links

This commit is contained in:
trafficlunar 2025-07-18 22:40:24 +01:00
parent 029c7eb84a
commit a37759622a
33 changed files with 113 additions and 69 deletions

View file

@ -49,7 +49,7 @@ export default function PunishmentDeletionDialog({ punishmentId }: Props) {
return (
<>
<button onClick={() => setIsOpen(true)} className="text-red-500 cursor-pointer hover:text-red-600 text-lg">
<button onClick={() => setIsOpen(true)} aria-label="Delete Punishment" className="text-red-500 cursor-pointer hover:text-red-600 text-lg">
<Icon icon="material-symbols:close-rounded" />
</button>
@ -70,7 +70,7 @@ export default function PunishmentDeletionDialog({ punishmentId }: Props) {
>
<div className="flex justify-between items-center mb-2">
<h2 className="text-xl font-bold">Punishment Deletion</h2>
<button onClick={close} className="text-red-400 hover:text-red-500 text-2xl cursor-pointer">
<button onClick={close} aria-label="Close" className="text-red-400 hover:text-red-500 text-2xl cursor-pointer">
<Icon icon="material-symbols:close-rounded" />
</button>
</div>

View file

@ -108,10 +108,11 @@ export default async function Reports() {
<button
type="submit"
aria-label="Open"
className="cursor-pointer text-orange-400 flex items-center gap-1 p-1.5 rounded-lg transition-colors hover:bg-orange-400/15"
>
<Icon icon="mdi:alert-circle" className="text-xl" />
<span className="text-sm">Open</span>{" "}
<span className="text-sm">Open</span>
</button>
</form>
<form action={updateStatus}>
@ -120,6 +121,7 @@ export default async function Reports() {
<button
type="submit"
aria-label="Resolve"
className="cursor-pointer text-green-500 flex items-center gap-1 p-1.5 rounded-lg transition-colors hover:bg-green-500/15"
>
<Icon icon="mdi:check-circle" className="text-xl" />
@ -132,6 +134,7 @@ export default async function Reports() {
<button
type="submit"
aria-label="Dismiss"
className="cursor-pointer text-zinc-400 flex items-center gap-1 p-1.5 rounded-lg transition-colors hover:bg-zinc-400/15"
>
<Icon icon="mdi:close-circle" className="text-xl" />

View file

@ -44,7 +44,7 @@ export default function ReturnToIsland({ hasExpired }: Props) {
<hr className="border-zinc-300 mt-3 mb-4" />
{error && <span className="text-red-400 font-bold mb-2.5">Error: {error}</span>}
<button disabled={!isChecked} onClick={handleClick} className="pill button gap-2 w-fit self-center">
<button disabled={!isChecked} aria-label="Travel Back Home" onClick={handleClick} className="pill button gap-2 w-fit self-center">
<Icon icon="ic:round-home" fontSize={24} />
Travel Back
</button>

View file

@ -274,7 +274,7 @@ export default function Punishments() {
value={newMii.reason}
onChange={(e) => setNewMii({ ...newMii, reason: e.target.value })}
/>
<button type="button" onClick={addMiiToList} className="pill button aspect-square !p-2.5">
<button type="button" aria-label="Add Mii" onClick={addMiiToList} className="pill button aspect-square !p-2.5">
<Icon icon="ic:baseline-plus" className="size-4" />
</button>
</div>
@ -295,6 +295,7 @@ export default function Punishments() {
</div>
<button
type="button"
aria-label="Remove Mii"
onClick={() => removeMiiFromList(index)}
className="cursor-pointer text-red-500 hover:text-red-700 transition-colors"
>