From 70cce5f74a0703d9d8ac3c1dc3bcefeb90864582 Mon Sep 17 00:00:00 2001
From: kolaente <k@knt.li>
Date: Wed, 22 Jan 2025 10:35:44 +0100
Subject: [PATCH] fix(a11y): add task input label

---
 frontend/src/components/tasks/AddTask.vue | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/frontend/src/components/tasks/AddTask.vue b/frontend/src/components/tasks/AddTask.vue
index cd39114aa..d4e28a8a8 100644
--- a/frontend/src/components/tasks/AddTask.vue
+++ b/frontend/src/components/tasks/AddTask.vue
@@ -5,7 +5,14 @@
 	>
 		<div class="add-task__field field is-grouped">
 			<p class="control has-icons-left has-icons-right is-expanded">
+				<label
+					class="tw-sr-only"
+					:for="textareaId"
+				>
+					{{ $t('project.list.addPlaceholder') }}
+				</label>
 				<textarea
+					:id="textareaId"
 					ref="newTaskInput"
 					v-model="newTaskTitle"
 					v-focus
@@ -78,6 +85,8 @@ const props = withDefaults(defineProps<{
 
 const emit = defineEmits(['taskAdded'])
 
+const textareaId = computed(() => `task-add-textarea-${Math.random().toString(36).substr(2, 9)}`)
+
 const newTaskTitle = ref('')
 const {textarea: newTaskInput} = useAutoHeightTextarea(newTaskTitle)