diff --git a/resources/vue/components/MyCoursesTables.vue b/resources/vue/components/MyCoursesTables.vue index 80d04dd36681bdad6aabfee826d25e17d89c215c..1c39d95dddebc0eea6e0a5cfabe8fc0e585f7fe9 100644 --- a/resources/vue/components/MyCoursesTables.vue +++ b/resources/vue/components/MyCoursesTables.vue @@ -12,7 +12,11 @@ </colgroup> <thead> <tr class="sortable"> - <th></th> + <th> + <span class="sr-only"> + {{ $gettext('Zugeordnete Farbgruppe') }} + </span> + </th> <th></th> <th v-if="getConfig('sem_number') && !responsiveDisplay" :class="getOrderClasses('number')"> <a href="#" @click.prevent="changeOrder('number')"> @@ -37,7 +41,14 @@ <th v-if="!responsiveDisplay" class="dont-hide" colspan="2"></th> </tr> <tr v-for="course in getOrderedCourses(subgroup.ids)" :data-course-id="course.id" :class="getCourseClasses(course)" :key="course.id"> - <td :class="`gruppe${course.group}`"></td> + <td :class="`gruppe${course.group}`"> + <span class="sr-only"> + {{ $gettextInterpolate( + $gettext('Diese Veranstaltung gehört zur Farbgruppe %{group}'), + course + ) }} + </span> + </td> <td :class="{'subcourse-indented': isChild(course)}"> <span :style="{backgroundImage: `url(${course.avatar}`}" class="my-courses-avatar course-avatar-small" :title="course.name" alt=""></span> </td>