From a868a5ff35d3c1509043b7f1cac5a3e80592895a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Javi=20Mart=C3=ADn?= Date: Mon, 21 Jun 2021 23:49:39 +0200 Subject: [PATCH] Change Foundation text direction in RTL languages This way, when the language is written form right-to-left, elements using Foundation mixins/classes will float to the opposite direction as they do in left-to-right languages. The same will apply to text alignment. To offer full support for RTL languages, we need to change every single reference to `float: left`, `float: right`, `text-align: left`, `text-align: right`, and possible adjust other properties like `left`, `margin-left`, `padding-left` or `border-left`. In the meantime, we at least partially support these languages. Replacing `float` with `flex` when possible would also improve RTL support. --- app/assets/stylesheets/application-rtl.scss | 3 +++ app/helpers/application_helper.rb | 4 ++++ app/views/layouts/_common_head.html.erb | 6 +++++- config/initializers/assets.rb | 1 + 4 files changed, 13 insertions(+), 1 deletion(-) create mode 100644 app/assets/stylesheets/application-rtl.scss diff --git a/app/assets/stylesheets/application-rtl.scss b/app/assets/stylesheets/application-rtl.scss new file mode 100644 index 000000000..99d12603a --- /dev/null +++ b/app/assets/stylesheets/application-rtl.scss @@ -0,0 +1,3 @@ +$global-text-direction: rtl; + +@import "application"; diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb index b14baa148..e57d06576 100644 --- a/app/helpers/application_helper.rb +++ b/app/helpers/application_helper.rb @@ -6,6 +6,10 @@ module ApplicationHelper url_for(request.query_parameters.merge(query_parameters).merge(only_path: true)) end + def rtl? + %i[ar fa he].include?(I18n.locale) + end + def markdown(text) return text if text.blank? diff --git a/app/views/layouts/_common_head.html.erb b/app/views/layouts/_common_head.html.erb index d4c0d4daf..abed78d19 100644 --- a/app/views/layouts/_common_head.html.erb +++ b/app/views/layouts/_common_head.html.erb @@ -2,7 +2,11 @@ <%= content_for?(:title) ? yield(:title) : default_title %> -<%= stylesheet_link_tag "application" %> +<% if rtl? %> + <%= stylesheet_link_tag "application-rtl" %> +<% else %> + <%= stylesheet_link_tag "application" %> +<% end %> <%= javascript_include_tag "application", "data-turbolinks-track" => "reload" %> <%= csrf_meta_tags %> <%= favicon_link_tag "favicon.ico" %> diff --git a/config/initializers/assets.rb b/config/initializers/assets.rb index 1afb578ff..6630e63f6 100644 --- a/config/initializers/assets.rb +++ b/config/initializers/assets.rb @@ -12,6 +12,7 @@ Rails.application.config.assets.version = "1.0" Rails.application.config.assets.precompile += %w[ckeditor/config.js] Rails.application.config.assets.precompile += %w[stat_graphs.js] Rails.application.config.assets.precompile += %w[dashboard_graphs.js] +Rails.application.config.assets.precompile += %w[application-rtl.css] Rails.application.config.assets.precompile += %w[print.css] Rails.application.config.assets.precompile += %w[pdf_fonts.css] Rails.application.config.assets.precompile += %w[sdg/*.png]