Updates to RTL clearing and RTL section.js

diff --git a/docs/components/section.html.erb b/docs/components/section.html.erb
index c48cfa52b0834379e0aa0038e60eccd5fd3f3b71..2472f31191112dff5b5745672410cb3ea80d4736 100644 (file)
--- a/docs/components/section.html.erb
+++ b/docs/components/section.html.erb
@@ -64,6 +64,30 @@
                   </ul>
                 </div>
               </section>
+              <section class="section">
+                <p class="title"><a href="#">Section 3</a></p>
+                <div class="content">
+                  <ul class="side-nav">
+                    <li><a href="#">Link 2</a></li>
+                    <li><a href="#">Link 2</a></li>
+                    <li><a href="#">Link 3</a></li>
+                    <li class="divider"></li>
+                    <li><a href="#">Link 1</a></li>
+                  </ul>
+                </div>
+              </section>
+              <section class="section">
+                <p class="title"><a href="#">Section 4</a></p>
+                <div class="content">
+                  <ul class="side-nav">
+                    <li><a href="#">Link 2</a></li>
+                    <li><a href="#">Link 2</a></li>
+                    <li><a href="#">Link 3</a></li>
+                    <li class="divider"></li>
+                    <li><a href="#">Link 1</a></li>
+                  </ul>
+                </div>
+              </section>
             </div>
             <div class="section-container auto" data-section data-options="deep_linking: true;">
               <section class="section">

diff --git a/js/foundation/foundation.clearing.js b/js/foundation/foundation.clearing.js
index b96d430d718725618332d3e65ecf140cd7db3aa6..0918784e760cc8bccbfac4184f0a93eb365a71bd 100644 (file)
--- a/js/foundation/foundation.clearing.js
+++ b/js/foundation/foundation.clearing.js
@@ -278,7 +278,6 @@
     },
 
     center : function (target) {
-      console.log(this.rtl)
       if (!this.rtl) {
         target.css({
           marginLeft : -(this.outerWidth(target) / 2),

diff --git a/js/foundation/foundation.section.js b/js/foundation/foundation.section.js
index 7bffee6b982355e8e75cd9d4eba47f278f3430bb..78a0cea26b16d1ac1dde126e5aa63be3a37a31ec 100644 (file)
--- a/js/foundation/foundation.section.js
+++ b/js/foundation/foundation.section.js
@@ -6,7 +6,7 @@
   Foundation.libs.section = {
     name: 'section',
 
-    version : '4.0.9',
+    version : '4.1.0',
 
     settings : {
       deep_linking: false,
@@ -16,9 +16,8 @@
 
     init : function (scope, method, options) {
       var self = this;
-
-      this.scope = scope || this.scope;
-      Foundation.inherit(this, 'throttle data_options');
+      Foundation.inherit(this, 'throttle data_options position_right offset_right');
+      console.log(this)
 
       if (typeof method != 'string') {
         this.set_active_from_hash();
@@ -214,7 +213,11 @@
 
       } else {
         titles.each(function () {
-          $(this).css('left', previous_width);
+          if (!self.rtl) {
+            $(this).css('left', previous_width);
+          } else {
+            $(this).css('right', previous_width);
+          }
           previous_width += self.outerWidth($(this));
         });
       }
@@ -232,8 +235,11 @@
         section.find('section, .section').each(function () {
           var title = $(this).find('.title'),
               content = $(this).find('.content');
-
-          content.css({left: title.position().left - 1, top: self.outerHeight(title) - 2});
+          if (!self.rtl) {
+            content.css({left: title.position().left - 1, top: self.outerHeight(title) - 2});
+          } else {
+            content.css({right: self.position_right(title) + 1, top: self.outerHeight(title) - 2});
+          }
         });
 
         // temporary work around for Zepto outerheight calculation issues.
@@ -246,6 +252,13 @@
 
     },
 
+    position_right : function (el) {
+      var section = el.closest('[data-section]'),
+          section_width = el.closest('[data-section]').width(),
+          offset = section.find('.title').length;
+      return (section_width - el.position().left - el.width() * (el.index() + 1) - offset);
+    },
+
     small : function (el) {
       var settings = $.extend({}, this.settings, this.data_options(el));
       if (this.is_tabs(el)) {