Add proper labels for site customization texts
We were rendering one label and many textarea fields for that label. This meant that, when switching to a different language, the label wasn't correctly associated with the textarea. So we're now rendering one label for each textarea. We could use `aria-label` or `aria-labelledby` instead, but using a label offers some advantages like the fact that clicking on the label makes the textarea take the focus.
This commit is contained in:
@@ -6,7 +6,6 @@
|
||||
<% end %>
|
||||
<% contents.each do |group| %>
|
||||
<% group.each do |content| %>
|
||||
<b><%= content.key %></b>
|
||||
<%= hidden_field_tag "contents[content_#{content.key}][id]", content.key %>
|
||||
<% (content.globalize_locales & enabled_locales.map(&:to_sym)).each do |locale| %>
|
||||
<%= render Admin::SiteCustomization::InformationTexts::FormFieldComponent.new(content, locale: locale) %>
|
||||
|
||||
@@ -1,8 +1,6 @@
|
||||
<% globalize(locale) do %>
|
||||
<%= text_area_tag "contents[content_#{i18n_key}]values[value_#{locale}]",
|
||||
text,
|
||||
rows: 5,
|
||||
class: "js-globalize-attribute",
|
||||
style: site_customization_display_translation_style,
|
||||
data: { locale: locale } %>
|
||||
<div class="js-globalize-attribute" data-locale="<%= locale %>" style="<%= display_style %>">
|
||||
<%= label_tag html_id, i18n_key %>
|
||||
<%= text_area_tag html_name, text, id: html_id, rows: 5 %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
@@ -27,7 +27,15 @@ class Admin::SiteCustomization::InformationTexts::FormFieldComponent < Applicati
|
||||
i18n_content.key
|
||||
end
|
||||
|
||||
def site_customization_display_translation_style
|
||||
def html_id
|
||||
html_name.tr("[", "_").tr("]", "")
|
||||
end
|
||||
|
||||
def html_name
|
||||
"contents[content_#{i18n_key}]values[value_#{locale}]"
|
||||
end
|
||||
|
||||
def display_style
|
||||
site_customization_enable_translation?(locale) ? "" : "display: none;"
|
||||
end
|
||||
end
|
||||
|
||||
Reference in New Issue
Block a user