Merge branch 'more-accessibility' into fix/more-accessibility

packages/client/src/components/MkModalWindow.vue

@@ -26,6 +26,7 @@
 				<div ref="headerEl" class="header">
 					<button
 						v-if="withOkButton"
+						:aria-label="i18n.t('close')"
 						class="_button"
 						@click="$emit('close')"
 					>
@@ -36,6 +37,7 @@
 					</span>
 					<button
 						v-if="!withOkButton"
+						:aria-label="i18n.t('close')"
 						class="_button"
 						@click="$emit('close')"
 					>
@@ -43,6 +45,7 @@
 					</button>
 					<button
 						v-if="withOkButton"
+						:aria-label="i18n.t('ok')"
 						class="_button"
 						:disabled="okButtonDisabled"
 						@click="$emit('ok')"
@@ -61,6 +64,7 @@
 <script lang="ts" setup>
 import { FocusTrap } from "focus-trap-vue";
 import MkModal from "./MkModal.vue";
+import { i18n } from "@/i18n";
 
 const props = withDefaults(
 	defineProps<{

packages/client/src/pages/messaging/messaging-room.form.vue

@@ -17,16 +17,17 @@
 				{{ file.name }}
 			</div>
 			<div class="buttons">
-				<button class="_button" @click="chooseFile">
+				<button class="_button" @click="chooseFile" :aria-label="i18n.t('attachFile')">
 					<i class="ph-upload ph-bold ph-lg"></i>
 				</button>
-				<button class="_button" @click="insertEmoji">
+				<button class="_button" @click="insertEmoji" :aria-label="i18n.t('chooseEmoji')">
 					<i class="ph-smiley ph-bold ph-lg"></i>
 				</button>
 				<button
 					class="send _button"
 					:disabled="!canSend || sending"
 					:title="i18n.ts.send"
+					:aria-label="i18n.ts.send"
 					@click="send"
 				>
 					<template v-if="!sending"

packages/client/src/pages/messaging/messaging-room.vue

@@ -28,6 +28,7 @@
 							#default="{ items: messages, fetching: pFetching }"
 						>
 							<XList
+								aria-live="polite"
 								v-if="messages.length > 0"
 								v-slot="{ item: message }"
 								:class="{
@@ -48,7 +49,7 @@
 					</MkPagination>
 				</div>
 				<footer>
-					<div v-if="typers.length > 0" class="typers">
+					<div v-if="typers.length > 0" class="typers" aria-live="polite">
 						<I18n
 							:src="i18n.ts.typingUsers"
 							text-tag="span"