DGNum/demarches-normaliennes
13
1
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity

Merge pull request #11003 from demarches-simplifiees/a11y-improve-hint-restitution

Browse source 
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:
Corinne Durrmeyer 2024-11-05 10:01:20 +00:00 • committed by GitHub
commit d61078d01a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 13 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
app/components/editable_champ/champ_label_content_component/champ_label_content_component.html.haml
View file

@ -20,5 +20,5 @@
- if @champ.description.present? - if @champ.description.present?
%span.fr-hint-text= render SimpleFormatComponent.new(@champ.description, allow_a: true) %span.fr-hint-text= render SimpleFormatComponent.new(@champ.description, allow_a: true)
- if @champ.textarea? - if @champ.textarea? && @champ.character_limit_base&.positive?
%span.sr-only= t('.recommended_size', size: @champ.character_limit_base) %span.fr-hint-text= t('.recommended_size', size: @champ.character_limit_base)

2
app/components/editable_champ/textarea_component/textarea_component.en.yml
View file

@ -1,3 +1,3 @@
en: en:
remaining_characters: You have %{remaining_words} characters remaining. 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.

2
app/components/editable_champ/textarea_component/textarea_component.fr.yml
View file

@ -1,3 +1,3 @@
fr: fr:
remaining_characters: Il vous reste %{remaining_words} caractères. 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.

3
app/components/editable_champ/textarea_component/textarea_component.html.haml
View file

@ -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' })) ~ @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' }))
%div{ role: 'status' }
- if @champ.character_limit_info? - if @champ.character_limit_info?
%p.fr-info-text %p.fr-info-text
= t('.remaining_characters', remaining_words: @champ.remaining_characters) = t('.remaining_characters', remaining_words: @champ.remaining_characters)
- if @champ.character_limit_warning? - 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 %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) = t('.excess_characters', excess_words: @champ.excess_characters)

2
config/locales/models/champs/decimal_number_champ/en.yml
View file

@ -3,4 +3,4 @@ en:
attributes: attributes:
champs/decimal_number_champ: champs/decimal_number_champ:
hints: 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"

2
config/locales/models/champs/decimal_number_champ/fr.yml
View file

@ -3,4 +3,4 @@ fr:
attributes: attributes:
champs/decimal_number_champ: champs/decimal_number_champ:
hints: 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>"