From c1f74ae9dc649f8407d8ee564be84956dd7024d8 Mon Sep 17 00:00:00 2001
From: kolaente <k@knt.li>
Date: Sun, 12 Apr 2026 14:19:38 +0200
Subject: [PATCH] feat(a11y): add labels to color picker and sort select

Adds aria-label to the color input and sort select elements
so screen readers announce their purpose.

Fixes WCAG 3.3.2 (Labels or Instructions).
---
 frontend/src/components/input/ColorPicker.vue          | 1 +
 frontend/src/components/project/partials/SortPopup.vue | 5 ++++-
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/input/ColorPicker.vue b/frontend/src/components/input/ColorPicker.vue
index c7128cc97..224adfd6b 100644
--- a/frontend/src/components/input/ColorPicker.vue
+++ b/frontend/src/components/input/ColorPicker.vue
@@ -15,6 +15,7 @@
 				type="color"
 				:list="colorListID"
 				:class="{'is-empty': isEmpty}"
+				:aria-label="$t('input.projectColor')"
 			>
 			<svg
 				v-show="isEmpty"
diff --git a/frontend/src/components/project/partials/SortPopup.vue b/frontend/src/components/project/partials/SortPopup.vue
index eb636de39..5dcbc5664 100644
--- a/frontend/src/components/project/partials/SortPopup.vue
+++ b/frontend/src/components/project/partials/SortPopup.vue
@@ -16,7 +16,10 @@
 				</p>
 				<div class="field">
 					<div class="select is-fullwidth">
-						<select v-model="selected">
+						<select
+							v-model="selected"
+							:aria-label="$t('misc.sortBy')"
+						>
 							<option
 								v-for="o in options"
 								:key="o.value"