Merge branch 'master' of github.com:zurb/foundation

foundation · Apr 2, 2013 · af97022 · af97022
2 parents 585a06c + b0a87cb
commit af97022
Show file tree

Hide file tree

Showing 8 changed files with 62 additions and 5 deletions.
diff --git a/Gemfile.lock b/Gemfile.lock
@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    zurb-foundation (4.0.9)
+    zurb-foundation (4.1.0)
       sass (>= 3.2.0)
 
 GEM

diff --git a/docs/_sidebar-components.html.erb b/docs/_sidebar-components.html.erb
@@ -9,6 +9,7 @@
         <li><a href="../rails.html">Rails</a></li>
         <li><a href="../media-queries.html">Media Queries</a></li>
         <li><a class="<%= @page_title == 'Visibility Classes' ? 'active': '' %>" href="visibility.html">Visibility Classes</a></li>
+        <li><a href="../rtl.html">Right-to-Left Support</a></li>
       </ul>
     </div>
   </section>

diff --git a/docs/_sidebar.html.erb b/docs/_sidebar.html.erb
@@ -9,6 +9,7 @@
         <li><a class="<%= @page_title == 'Rails' ? 'active': '' %>" href="rails.html">Rails</a></li>
         <li><a class="<%= @page_title == 'Media Queries' ? 'active': '' %>" href="media-queries.html">Media Queries</a></li>
         <li><a href="components/visibility.html">Visibility Classes</a></li>
+        <li><a class="<%= @page_title == 'Right-to-Left Support' ? 'active': '' %>" href="rtl.html">Right-to-Left Support</a></li>
       </ul>
     </div>
   </section>

diff --git a/docs/css/docs.scss b/docs/css/docs.scss
@@ -7,6 +7,8 @@
 /* Coderay styles */
 .html, .css, .scss, .js { position: relative; }
 
+ul, ol, dl { list-style-position: inside; }
+
 .CodeRay:before {
   position: absolute;
   top: 6px;

diff --git a/docs/rtl.html.erb b/docs/rtl.html.erb
@@ -0,0 +1,53 @@
+<% @side_nav = "using" %>
+<div class="row">
+  <div class="large-9 push-3 columns">
+
+    <% @page_title = "Right-to-Left Support" %>
+    <div class="row">
+      <div class="large-12 columns">
+        <h2><%= @page_title %></h2>
+        <h4 class="subheader">Right-to-left text direction support in Foundation allows you to easily switch text direction for all components.<h4>
+      </div>
+    </div>
+
+    <div class="row">
+      <div class="large-12 columns">
+        <h3>Setup</h3>
+        <p>Foundation 4 was built to support right-to-left text direction out of the box, but you'll need to make a couple of adjustments to your markup and SCSS to get everything up and running.</p>
+
+        <h4>Markup Changes for Right-to-Left Layouts</h4>
+        <p>You'll need to make a few changes to your markup to get the javascript components working nice and smooth. In the <code>html</code> tag, you'll need to add a <code>dir</code> attribute with a value of <code>rtl</code>. Here's what your <code>html</code> tag should look like:</p>
+<%= code_example '
+<!-- This example is for a right-to-left Arabic layout -->
+<html class="no-js" lang="ar" dir="rtl">
+', :html %>
+        <h5>Change the Language Too</h5>
+        <p>You'll need to change your <code>lang</code> attribute value to match your language. Here's a handy list of common right-to-left languages and their html codes:</p>
+        <ul>
+          <li><strong>Arabic:</strong> ar</li>
+          <li><strong>Chinese:</strong> zh</li>
+          <li><strong>Farsi:</strong> fa</li>
+          <li><strong>Hebrew:</strong> he, iw</li>
+          <li><strong>Japanese:</strong> ja</li>
+          <li><strong>Urdu:</strong> ur</li>
+          <li><strong>Yiddish:</strong> yi, ji</li>
+        </ul>
+        <hr>
+        <h4>A Single SCSS Adjustment</h4>
+        <p>We made it really easy to switch the entire Foundation grid to right-to-left by changing the <code>$text-direction</code> SCSS variable. Here's what the variable should look like:</p>
+<%= code_example '
+$text-direction: rtl;
+', :css %>
+        <p>By changing this single variable, the entire grid and all the Foundation components will be switched to right-to-left orientation.</p>
+        <div class="panel">
+          <h6>Using CSS</h6>
+          <p>If you downloaded a static version of Foundation using the customizer to get a right-to-left support, your download should be ready to use without any of the steps mentioned above.</p>
+          <a href="http://foundation.zurb.com/download.php#customizeFoundation">Download Right-to-Left Foundation 4 &raquo;</a>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="large-3 pull-9 columns">
+    <%= render "_sidebar.html.erb" %>
+  </div>
+</div>
diff --git a/js/foundation/foundation.orbit.js b/js/foundation/foundation.orbit.js
@@ -306,7 +306,7 @@
           $slides = $slides_container.children(),
           $active_slide = $slides_container.find('.' + self.settings.active_slide_class),
           active_index = $active_slide.index(),
-          margin_position = Foundation.rtl ? 'marginRight' : 'marginRight';
+          margin_position = Foundation.rtl ? 'marginRight' : 'marginLeft';
 
       if ($container.hasClass(self.settings.orbit_transition_class)) {
         return false;

diff --git a/lib/foundation/version.rb b/lib/foundation/version.rb
@@ -1,3 +1,3 @@
 module Foundation
-  VERSION = "4.0.9"
+  VERSION = "4.1.0"
 end
diff --git a/templates/project/index.html b/templates/project/index.html
@@ -1,7 +1,7 @@
 <% template = @template if defined?(@template) %>
 <!DOCTYPE html>
-<!--[if IE 8]> 				 <html class="no-js lt-ie9" lang="en"> <![endif]-->
-<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
+<!--[if IE 8]> 				 <html class="no-js lt-ie9" lang="en" <% if template[:options][:rtl] %>dir="rtl"<% end %>> <![endif]-->
+<!--[if gt IE 8]><!--> <html class="no-js" lang="en" <% if template[:options][:rtl] %>dir="rtl"<% end %>> <!--<![endif]-->
 
 <head>
 	<meta charset="utf-8" />