CGM_Public/pretix_original
2
0
Fork 1
mirror of https://github.com/pretix/pretix.git synced 2026-05-08 15:44:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

[A11y] Widget: change calendar table aria-label to labelledby (#5217)

Browse Source
This commit is contained in:
Richard Schreiber
2025-06-10 20:40:33 +02:00
committed by GitHub
parent 80148a8435
commit 23489f50f8
1 changed files with 5 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/pretix/static/pretixpresale/js/widget/widget.js
View File

@@ -1571,14 +1571,14 @@ Vue.component('pretix-widget-event-calendar', {
+ '<a class="pretix-widget-event-calendar-previous-month" href="#" @click.prevent.stop="prevmonth">&laquo; ' + '<a class="pretix-widget-event-calendar-previous-month" href="#" @click.prevent.stop="prevmonth">&laquo; '
+ strings['previous_month'] + strings['previous_month']
+ '</a> ' + '</a> '
+ '<strong>{{ monthname }}</strong> ' + '<strong :id="aria_labelledby">{{ monthname }}</strong> '
+ '<a class="pretix-widget-event-calendar-next-month" href="#" @click.prevent.stop="nextmonth">' + '<a class="pretix-widget-event-calendar-next-month" href="#" @click.prevent.stop="nextmonth">'
+ strings['next_month'] + strings['next_month']
+ ' &raquo;</a>' + ' &raquo;</a>'
+ '</div>' + '</div>'
// Calendar // Calendar
+ '<table class="pretix-widget-event-calendar-table" :id="id" tabindex="0" v-bind:aria-label="monthname">' + '<table class="pretix-widget-event-calendar-table" :id="id" tabindex="0" v-bind:aria-labelledby="aria_labelledby">'
+ '<thead>' + '<thead>'
+ '<tr>' + '<tr>'
+ '<th aria-label="' + strings['days']['MONDAY'] + '">' + strings['days']['MO'] + '</th>' + '<th aria-label="' + strings['days']['MONDAY'] + '">' + strings['days']['MO'] + '</th>'
@@ -1605,6 +1605,9 @@ Vue.component('pretix-widget-event-calendar', {
id: function () { id: function () {
return this.$root.html_id + "-event-calendar-table"; return this.$root.html_id + "-event-calendar-table";
}, },
aria_labelledby: function () {
return this.$root.html_id + "-event-calendar-table-label";
},
}, },
methods: { methods: {
back_to_list: function () { back_to_list: function () {