Merge pull request #11003 from demarches-simplifiees/a11y-improve-hint-restitution
ETQ usager, utilisant un lecteur d'écran je veux être informé du nombre de caractères restants ou en trop dans un textarea
This commit is contained in:
commit
d61078d01a
6 changed files with 13 additions and 12 deletions
|
@ -20,5 +20,5 @@
|
|||
- if @champ.description.present?
|
||||
%span.fr-hint-text= render SimpleFormatComponent.new(@champ.description, allow_a: true)
|
||||
|
||||
- if @champ.textarea?
|
||||
%span.sr-only= t('.recommended_size', size: @champ.character_limit_base)
|
||||
- if @champ.textarea? && @champ.character_limit_base&.positive?
|
||||
%span.fr-hint-text= t('.recommended_size', size: @champ.character_limit_base)
|
||||
|
|
|
@ -1,3 +1,3 @@
|
|||
en:
|
||||
remaining_characters: You have %{remaining_words} characters remaining.
|
||||
excess_characters: You have %{excess_words} characters too many.
|
||||
excess_characters: You have exceeded the recommended size of %{excess_words} characters. Please reduce the number of characters.
|
||||
|
|
|
@ -1,3 +1,3 @@
|
|||
fr:
|
||||
remaining_characters: Il vous reste %{remaining_words} caractères.
|
||||
excess_characters: Vous avez dépassé la taille conseillée de %{excess_words} caractères. Réduire le nombre de caractères.
|
||||
excess_characters: Vous avez dépassé la taille conseillée de %{excess_words} caractères. Veuillez réduire le nombre de caractères.
|
||||
|
|
|
@ -1,9 +1,10 @@
|
|||
~ @form.text_area(:value, input_opts(id: @champ.input_id, aria: { describedby: @champ.describedby_id }, rows: 6, required: @champ.required?, value: html_to_string(@champ.value), data: { controller: 'autoresize' }))
|
||||
|
||||
- if @champ.character_limit_info?
|
||||
%p.fr-info-text
|
||||
= t('.remaining_characters', remaining_words: @champ.remaining_characters)
|
||||
%div{ role: 'status' }
|
||||
- if @champ.character_limit_info?
|
||||
%p.fr-info-text
|
||||
= t('.remaining_characters', remaining_words: @champ.remaining_characters)
|
||||
|
||||
- if @champ.character_limit_warning?
|
||||
%p.fr-icon--sm.fr-mt-4v.fr-mb-0.fr-hint-text.fr-icon-warning-fill.fr-text-default--warning.characters-count
|
||||
= t('.excess_characters', excess_words: @champ.excess_characters)
|
||||
- if @champ.character_limit_warning?
|
||||
%p.fr-icon--sm.fr-mt-4v.fr-mb-0.fr-hint-text.fr-icon-warning-fill.fr-text-default--warning
|
||||
= t('.excess_characters', excess_words: @champ.excess_characters)
|
||||
|
|
|
@ -3,4 +3,4 @@ en:
|
|||
attributes:
|
||||
champs/decimal_number_champ:
|
||||
hints:
|
||||
value: "You can enter up to 3 decimal places after the decimal point. Example: 3.141"
|
||||
value_html: "You can enter up to 3 decimal places after the decimal point. Example: 3.141"
|
||||
|
|
|
@ -3,4 +3,4 @@ fr:
|
|||
attributes:
|
||||
champs/decimal_number_champ:
|
||||
hints:
|
||||
value: "Vous pouvez saisir jusqu’à 3 décimales après le point. Exemple: 3.141"
|
||||
value_html: "Vous pouvez saisir jusqu’à 3 décimales après le point. Exemple: <span aria-hidden='true'>3.141</span><span class='sr-only'>3 point 141</span>"
|
||||
|
|
Loading…
Reference in a new issue