Fix design for RTL

ai · Oct 29, 2015 · 3910ace · 3910ace
1 parent eb821bc
commit 3910ace
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 2 deletions.
diff --git a/styles/style.sass b/styles/style.sass
@@ -32,7 +32,7 @@ $easing-width: 120px + 4px
   position: relative
 
 .about
-  padding: 20px ($easing-width + 40px) 5px 0
+  padding: 20px ($easing-width + 50px) 5px 0
   line-height: 1.3
   p
     margin-bottom: 5px
@@ -483,6 +483,32 @@ footer
     position: relative
     top: 9px
 
+// RTL
+
+.rtl
+  direction: rtl
+
+  pre
+    direction: ltr
+
+  .easing.linear
+    right: auto
+    left: 25px
+
+  .easings
+    direction: ltr
+    left: 15px
+    .part-title
+      right: auto
+      left: -20px
+
+  .about
+    padding-right: 0
+    padding-left: $easing-width + 50px
+
+  .easing-description .back
+    float: left
+
 // Big screens
 
 @media (min-width: 1150px)

diff --git a/views/index.html.slim b/views/index.html.slim
@@ -22,7 +22,7 @@ html lang=r18n.locale.code
 
     - if production?
       = include_statistics
-  body
+  body class=('rtl' unless r18n.locale.ltr?)
     .centered
       .about
         = t.about