consul/nairobi
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Change Foundation text direction in RTL languages

Browse Source 
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.
This commit is contained in:
Javi Martín
2021-06-21 23:49:39 +02:00
parent 8991d93bd1
commit a868a5ff35
4 changed files with 13 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
app/assets/stylesheets/application-rtl.scss Normal file
View File

@@ -0,0 +1,3 @@
$global-text-direction: rtl;
@import "application";

4
app/helpers/application_helper.rb
View File

@@ -6,6 +6,10 @@ module ApplicationHelper
url_for(request.query_parameters.merge(query_parameters).merge(only_path: true)) url_for(request.query_parameters.merge(query_parameters).merge(only_path: true))
end end
def rtl?
%i[ar fa he].include?(I18n.locale)
end
def markdown(text) def markdown(text)
return text if text.blank? return text if text.blank?

4
app/views/layouts/_common_head.html.erb
View File

@@ -2,7 +2,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title><%= content_for?(:title) ? yield(:title) : default_title %></title> <title><%= content_for?(:title) ? yield(:title) : default_title %></title>
<% if rtl? %>
<%= stylesheet_link_tag "application-rtl" %>
<% else %>
<%= stylesheet_link_tag "application" %> <%= stylesheet_link_tag "application" %>
<% end %>
<%= javascript_include_tag "application", "data-turbolinks-track" => "reload" %> <%= javascript_include_tag "application", "data-turbolinks-track" => "reload" %>
<%= csrf_meta_tags %> <%= csrf_meta_tags %>
<%= favicon_link_tag "favicon.ico" %> <%= favicon_link_tag "favicon.ico" %>

1
config/initializers/assets.rb
View File

@@ -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[ckeditor/config.js]
Rails.application.config.assets.precompile += %w[stat_graphs.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[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[print.css]
Rails.application.config.assets.precompile += %w[pdf_fonts.css] Rails.application.config.assets.precompile += %w[pdf_fonts.css]
Rails.application.config.assets.precompile += %w[sdg/*.png] Rails.application.config.assets.precompile += %w[sdg/*.png]