Improve report modal accessibility

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2021-11-13 12:34:07 +01:00
parent 4a8284fa6d
commit 3dc8663c3e
No known key found for this signature in database
GPG key ID: A061B9DDE0CA0773

View file

@ -1,7 +1,7 @@
<template> <template>
<div class="modal-card"> <div class="modal-card">
<header class="modal-card-head" v-if="title"> <header class="modal-card-head" v-if="title">
<p class="modal-card-title">{{ title }}</p> <h2 class="modal-card-title">{{ title }}</h2>
</header> </header>
<section <section
@ -17,7 +17,7 @@
<article class="media"> <article class="media">
<div class="media-left"> <div class="media-left">
<figure class="image is-48x48" v-if="comment.actor.avatar"> <figure class="image is-48x48" v-if="comment.actor.avatar">
<img :src="comment.actor.avatar.url" alt="Image" /> <img :src="comment.actor.avatar.url" alt="" />
</figure> </figure>
<b-icon <b-icon
class="media-left" class="media-left"
@ -45,12 +45,16 @@
</p> </p>
<div class="control"> <div class="control">
<b-field
:label="$t('Additional comments')"
label-for="additonal-comments"
>
<b-input <b-input
v-model="content" v-model="content"
type="textarea" type="textarea"
@keyup.enter="confirm" id="additonal-comments"
:placeholder="$t('Additional comments')"
/> />
</b-field>
</div> </div>
<div class="control" v-if="outsideDomain"> <div class="control" v-if="outsideDomain">
@ -73,7 +77,12 @@
<button class="button" ref="cancelButton" @click="close"> <button class="button" ref="cancelButton" @click="close">
{{ translatedCancelText }} {{ translatedCancelText }}
</button> </button>
<button class="button is-primary" ref="confirmButton" @click="confirm"> <button
class="button is-primary"
ref="confirmButton"
@click="confirm"
@keyup.enter="confirm"
>
{{ translatedConfirmText }} {{ translatedConfirmText }}
</button> </button>
</footer> </footer>