zurb-foundation 4.2.2 → 4.2.3

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    zurb-foundation (4.2.2)
+    zurb-foundation (4.2.3)
       sass (>= 3.2.0)
 
 GEM

data/README.md

@@ -74,6 +74,7 @@ MODX
 Middleman
 
 * [Middleman Skeleton](https://github.com/axyz/middleman-zurb-foundation) by [Andrea Moretti](https://twitter.com/axyz)
+* [Middleman Foundation 4.x Template](https://github.com/mattolson/middleman-zurb-template) by [Matt Olson](http://mattolson.com)
 
 Magento
 * [Magento & Foundation](https://github.com/nandroid/MagentoFoundation) by Nandroid
@@ -93,6 +94,10 @@ Shopify
 
 * [Foundationify Shopify Theme](https://github.com/lukebussey/foundationify) by Luke Bussey
 
+Silverstripe
+
+* [Foundation Silverstripe Theme](https://github.com/ryanwachtl/silverstripe-foundation) by [Ryan Wachtl](https://github.com/ryanwachtl)
+
 Orchard
 
   * [Foundation Theme for Orchard CMS](https://foundationorchardcms.codeplex.com/)

data/docs/CHANGELOG.md

@@ -1,3 +1,13 @@
+### 4.2.3- June 26, 2013
+* Made it to where custom switches work inside custom forms.
+* Small update to breadcrumb styling so that defaults don't get overridden.
+* Fixed bugs with height of Top Bar.
+* Added Middleman template to README
+* Fixed a wrong selector in forms.js
+* Bug fixes
+
+You can compare the commits [here](https://github.com/zurb/foundation/compare/v4.2.2...v4.2.3).
+
 ### 4.2.2- June 11, 2013
 * Added touch events to zepto core.
 * Fixed a topbar scroll issue.

data/docs/_sidebar-components.html.erb

@@ -111,6 +111,6 @@
 
 <div class="jobs hide-for-small">
   <h5>Awesome product jobs:</h5>
-  <script type="text/javascript" src="http://www.zurb.com/jobs/widgets/jobs.js?limit=3&variation=foundation-sidebar"></script>
+  <div id="zurbJobsWidget"></div>
   <a id="via" href="http://zurbjobs.com">via&nbsp;<span class="jobs-link">ZURBjobs</span></a>
 </div>

data/docs/_sidebar.html.erb

@@ -111,6 +111,6 @@
 
 <div class="jobs hide-for-small">
   <h5>Awesome product jobs:</h5>
-  <script type="text/javascript" src="http://www.zurb.com/jobs/widgets/jobs.js?limit=3&variation=foundation-sidebar"></script>
+  <div id="zurbJobsWidget"></div>
   <a id="via" href="http://zurbjobs.com">via&nbsp;<span class="jobs-link">ZURBjobs</span></a>
 </div>

data/docs/components/custom-forms.html.erb

@@ -13,9 +13,7 @@
 
     <div class="row">
       <div class="large-12 columns">
-
         <form class="custom">
-
           <div class="row">
             <div class="large-4 columns">
               <label for="radio1"><input name="radio1" type="radio" id="radio1" style="display:none;" CHECKED><span class="custom radio checked"></span> Radio Button 1</label>

data/docs/components/forms.html.erb

@@ -344,7 +344,7 @@
 <form>
   <div class="row collapse">
     <span class="your-prefix-class">Label</span>
-    <input type="text" class="your-label-class" placeholder="Value">
+    <input type="text" class="your-input-class" placeholder="Value">
   </div>
 </form>', :html %>
 

data/docs/components/pagination.html.erb

@@ -132,10 +132,11 @@
         <p>Just like with the CSS, we've made it easy to center the pagination element using the quick mixin.</p>
 
 <%= code_example '
+.container-class-name { @include pagination-container(true); }
 .your-class-name { @include pagination($centered, $base-styles); }
 
-/* Setting this to true will add styles to the parent of your pagination element for centering */
-$centered: false
+/* Setting this to true will remove floats on li elements and display them as inline-block */
+$centered: true
 
 /* This controls whether or not the base styles come across. Useful when applying the centered option. */
 $base-style: true
@@ -180,4 +181,4 @@ $pagination-link-current-active-bg: $primary-color;', :css %>
   <div class="large-3 pull-9 columns">
     <%= render "_sidebar-components.html.erb" %>
   </div>
-</div>
+</div>

data/docs/components/thumbnails.html.erb

@@ -34,7 +34,7 @@
         <p>We've included SCSS mixins used to style labels. To use the mixin, you'll need to have the <a href="../sass.html">extension installed</a> or grab <a href="https://github.com/zurb/foundation/blob/master/scss/foundation/_variables.scss">_variables.scss</a>, <a href="https://github.com/zurb/foundation/blob/master/scss/foundation/components/_global.scss">_global.scss</a> and <a href="https://github.com/zurb/foundation/blob/master/scss/foundation/components/_thumbs.scss">_thumbs.scss</a> from Github and throw them into a Foundation folder in your project directory. From there, you can import the files at the top of your own SCSS stylesheet, like so:</p>
 
 <%= code_example '
-@import "foundation/variables", "foundation/components/global", "foundation/components/labels";
+@import "foundation/variables", "foundation/components/global", "foundation/components/thumbs";
 ', :css %>
 
         <h5>Quick Mixin</h5>

data/docs/components/top-bar.html.erb

@@ -12,7 +12,7 @@
           <ul class="title-area">
             <!-- Title Area -->
             <li class="name">
-              <h1><a href="/">Top Bar</a></h1>
+
             </li>
             <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
             <li class="toggle-topbar menu-icon"><a href=""><span>Menu</span></a></li>
@@ -79,7 +79,7 @@
         <p>The top bar is a pretty complex piece of magical UI goodness, which makes it really difficult to create a mixin from it. We rely on many presentational classes to accomplish the styles and there's a lot happening in the JS. The top bar is hoverable by default but can be changed to a click event by adding a simple <code>data-options="is_hover:false"</code> to the <code>&lt;nav&gt;</code> element. <a href="#clickable">See an example below</a>.</p>
 
         <h5>Basic Needs</h5>
-        <p>The top bar has four main elements, three of which are needed for proper functionality: <code>ul.title-area</code>, a <code>ul class="right/left</code> element enclosed in a <code>section class="top-bar-section"</code>, and the <code>li.toggle-topbar</code> element that will expand the menu in the mobile layout. <!-- You can leave out the li class="name" as long as you include the .toggle-topbar element. --></p>
+        <p>The top bar has four main elements, three of which are needed for proper functionality: <code>ul.title-area</code>, a <code>ul class="right/left</code> element enclosed in a <code>section class="top-bar-section"</code>, and the <code>li.toggle-topbar</code> element that will expand the menu in the mobile layout.</p>
 
         <h5>Positioning the Bar</h5>
         <p>The top bar is built with a single <code>nav</code> element with a class of <code>top-bar</code>. It will take on full-browser width by default. To make the top bar stay fixed as you scroll, wrap it in <code>div class="fixed"</code>. If you want your navigation to be set to your grid width, wrap it in <code>div class="contain-to-grid"</code>. You may use <code>fixed</code> and <code>contain-to-grid</code> together.</p>
@@ -90,6 +90,16 @@
         <h5>Other Elements</h5>
         <p>To make this navigation nice and flexible, we've included patterns for elements like buttons, inputs and dividers. To create dividers between your navigation, just add an empty <code>li.divider</code> and you'll get some separation. You can use a small Foundation button in the nav, just include <code>has-form</code> as a class for its parent li. You can include two different input types: search and text. To use these, add a class of search to the parent li.</p>
 
+        <h5>Remove the Title</h5>
+        <p>If you want a bar that doesn't include a title, just take out the content within the list item, like so:</p>
+<%= code_example '
+<nav class="top-bar">
+  <ul class="title-area">
+    <li class="name"><!-- Leave this empty --></li>
+    ...
+  </ul>
+</nav>', :html %>
+
         <h5>Sticky Top Bar</h5>
         <p>You may also wrap your top bar in <code>div class="contain-to-grid sticky"</code> and put it anywhere within your markup. When the navigation hits the top of the browser, it will act like the fixed top bar and stick to the top as users continue to scroll. <strong>Note:</strong> If you are using Scss, you can control the default <code>sticky</code> class by adjusting the <code>$topbar-sticky-class</code> variable. <strong>Make sure the JS variable for <code>stickyClass</code> matches whatever class you use in the variable.</strong></p>
 

data/docs/css/_coderay.scss

@@ -12,9 +12,10 @@
 
 .CodeRay pre {
   margin: 0px;
-  font-size: .9em;
+  font-size: .7em;
   line-height: 1.4em;
-  white-space: pre;
+  white-space: pre-wrap;
+  @media only screen and (min-width: 768px) { font-size: .9em; white-space: pre; }
 }
 
 table.CodeRay { border-collapse: collapse; width: 100%; padding: 2px }

data/docs/javascript.html.erb

@@ -108,7 +108,7 @@ $(document)
 
         <h2>Calling Internal Methods</h2>
 
-        <p>Foundation 4 JavaScript allows you call call internal plugin methods by passing the method name as the second argument. This is necessary for plugins like Joyride, since they are not initialized on page load by default.</p>
+        <p>Foundation 4 JavaScript allows you call internal plugin methods by passing the method name as the second argument. This is necessary for plugins like Joyride, since they are not initialized on page load by default.</p>
 
         <p>This will fire the <code>start</code> method on Joyride:</p>
 

data/docs/layout.html.erb

@@ -128,6 +128,24 @@
         .foundation();
       <% end %>
 
+      $.ajax({
+        url: '//zurb.com/jobs/widgets/jobs.json?limit=3',
+        dataType: 'jsonp',
+        success: function(data) {
+          var list = $("<ul></ul>");
+          $.each(data.jobs, function(idx, job) {
+            var item = "<li><a href='"+job.url+"' target='_blank'>" +
+              "<span class='positionTitle'>"+job.title+"</span>" +
+              "<span class='location'><span class='companyName'>"+job.company_name+"</span> in "+job.location+"</span>" +
+              "</a>" +
+              "</li>";
+            list.append(item);
+          });
+            // Customize This
+          $("#zurbJobsWidget").html(list);
+        }
+      });
+
       // For Kitchen Sink Page
       $('#start-jr').on('click', function() {
         $(document).foundation('joyride','start');

data/docs/rails.html.erb

@@ -18,6 +18,7 @@ group :assets do
   gem 'coffee-rails', '~> 3.2.1'
   gem 'uglifier', '>= 1.0.3'
   # Add Foundation Here
+  gem 'compass-rails' # you need this or you get an err
   gem 'zurb-foundation', '~> 4.0.0'
 end
 ", :ruby %>

data/js/foundation/foundation.forms.js

@@ -4,7 +4,7 @@
   Foundation.libs.forms = {
     name: 'forms',
 
-    version: '4.2.2',
+    version: '4.2.3',
 
     cache: {},
 
@@ -63,7 +63,7 @@
           self.toggle_radio($(this));
         })
         .on('change.fndtn.forms', 'form.custom select', function (e, force_refresh) {
-          if (!$(this).not('[data-customforms="disabled"])')) return;
+          if ($(this).is('[data-customforms="disabled"]')) return;
           self.refresh_custom_select($(this), force_refresh);
         })
         .on('click.fndtn.forms', 'form.custom label', function (e) {

data/js/foundation/foundation.js

@@ -166,7 +166,7 @@ if (typeof jQuery === "undefined" &&
   window.Foundation = {
     name : 'Foundation',
 
-    version : '4.2.2',
+    version : '4.2.3',
 
     cache : {},
 
@@ -267,7 +267,7 @@ if (typeof jQuery === "undefined" &&
     },
 
     random_str : function (length) {
-      var chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz'.split('');
+      var chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('');
 
       if (!length) {
         length = Math.floor(Math.random() * chars.length);

data/js/foundation/foundation.section.js

@@ -6,7 +6,7 @@
   Foundation.libs.section = {
     name: 'section',
 
-    version : '4.2.2',
+    version : '4.2.3',
 
     settings : {
       deep_linking: false,
@@ -306,6 +306,11 @@
       if (typeof off === 'boolean') {
         content.attr('style', '');
         section.attr('style', '');
+
+        // Reset the minHeight and maxWidth values (only applicable to
+        // vertical tabs)
+        content.css('minHeight', '');
+        content.css('maxWidth', '');
       } else {
         if (self.is_vertical_tabs(section)
             && !self.small(section)) {

data/js/foundation/foundation.topbar.js

@@ -6,7 +6,7 @@
   Foundation.libs.topbar = {
     name : 'topbar',
 
-    version : '4.2.2',
+    version : '4.2.3',
 
     settings : {
       index : 0,
@@ -86,7 +86,7 @@
 
             topbar
               .toggleClass('expanded')
-              .css('max-height', '');
+              .css('height', '');
           }
 
           if (!topbar.hasClass('expanded')) {
@@ -164,14 +164,14 @@
               section.find('>.name').css({right: 100 * topbar.data('index') + '%'});
             }
 
-            topbar.css('max-height', self.height($this.siblings('ul')) + self.outerHeight(titlebar, true));
+            topbar.css('height', self.outerHeight($this.siblings('ul'), true) + self.outerHeight(titlebar, true));
           }
         });
 
       $(window).on('resize.fndtn.topbar', function () {
         if (!self.breakpoint()) {
           $('.top-bar, [data-topbar]')
-            .css('max-height', '')
+            .css('height', '')
             .removeClass('expanded')
             .find('li')
             .removeClass('hover');
@@ -210,9 +210,9 @@
         }
 
         if (topbar.data('index') === 0) {
-          topbar.css('max-height', '');
+          topbar.css('height', '');
         } else {
-          topbar.css('max-height', self.height($previousLevelUl) + self.outerHeight(titlebar, true));
+          topbar.css('height', self.outerHeight($previousLevelUl, true) + self.outerHeight(titlebar, true));
         }
 
         setTimeout(function () {
@@ -272,14 +272,20 @@
         var distance = $(klass).length ? $(klass).offset().top: 0,
             $window = $(window);
             var offst = this.outerHeight($('.top-bar'));
-
+        //Whe resize elements of the page on windows resize. Must recalculate distance
+		$(window).resize(function() {
+            clearTimeout(t_top);
+			t_top = setTimeout (function() {
+				distance = $(klass).offset().top;
+			},105);
+		});
           $window.scroll(function() {
-            if ($window.scrollTop() >= (distance)) {
+            if ($window.scrollTop() > (distance)) {
               $(klass).addClass("fixed");
               $('body').css('padding-top',offst);
             }
 
-            else if ($window.scrollTop() < distance) {
+            else if ($window.scrollTop() <= distance) {
               $(klass).removeClass("fixed");
               $('body').css('padding-top','0');
             }

data/lib/foundation/version.rb

@@ -1,3 +1,3 @@
 module Foundation
-  VERSION = "4.2.2"
+  VERSION = "4.2.3"
 end

data/lib/zurb-foundation.rb

@@ -1,12 +1,12 @@
 root = File.join(File.dirname(__FILE__), "..")
 require "foundation/version"
 
-if defined?(Rails)
+if defined?(Rails::Generators::Base)
   require "foundation/generators/install_generator"
 end
 
 module Foundation
-  if defined?(Rails)
+  if defined?(Rails::Engine)
     require "foundation/engine"
   elsif defined?(Sprockets)
     require "foundation/sprockets"

data/scss/foundation/_variables.scss

@@ -65,6 +65,7 @@ $default-float: left;
 // $include-html-classes: true;
 // $include-print-styles: true;
 // $include-html-global-classes: $include-html-classes;
+// $include-html-inline-list-classes: $include-html-classes;
 // $include-html-type-classes: $include-html-classes;
 // $include-html-grid-classes: $include-html-classes;
 // $include-html-visibility-classes: $include-html-classes;

data/scss/foundation/components/_breadcrumbs.scss

@@ -56,7 +56,6 @@ $crumb-slash: "/" !default;
   float: $default-float;
   font-size: $crumb-font-size;
   text-transform: $crumb-font-transform;
-  color: $crumb-font-color;
 
   &:hover a, &:focus a { text-decoration: $crumb-link-decor; }
 

data/scss/foundation/components/_inline-lists.scss

@@ -1,7 +1,7 @@
 //
 // Inline List Variables
 //
-$include-html-global-classes: $include-html-classes !default;
+$include-html-inline-list-classes: $include-html-classes !default;
 
 // We use this to control the margins and padding of the inline list.
 $inline-list-top-margin: 0 !default;
@@ -43,11 +43,11 @@ $inline-list-children-display: block !default;
 }
 
 
-@if $include-html-global-classes != false {
+@if $include-html-inline-list-classes != false {
 
   /* Inline Lists */
   .inline-list {
     @include inline-list();
   }
 
-}
+}

data/scss/foundation/components/_pagination.scss

@@ -35,8 +35,47 @@ $pagination-link-current-active-bg: $primary-color !default;
 // Pagination Mixin
 //
 
+// Style the pagination container. Currently only used when centering elements.
+@mixin pagination-container($center:false) {
+  @if $center { text-align: center; }
+}
+
+// Style unavailable list items
+@mixin pagination-unavailable-item() {
+  a {
+    cursor: $pagination-link-unavailable-cursor;
+    color: $pagination-link-unavailable-font-color;
+  }
+  &:hover a,
+  & a:focus { background: $pagination-link-unavailable-bg-active; }
+}
+
+// Style the current list item. Do not assume that the current item has
+// an anchor <a> element.
+@mixin pagination-current-item($has-anchor: true) {
+  @if $has-anchor {
+    a {
+      background: $pagination-link-current-background;
+      color: $pagination-link-current-font-color;
+      font-weight: $pagination-link-current-font-weight;
+      cursor: $pagination-link-current-cursor;
+
+      &:hover,
+      &:focus { background: $pagination-link-current-active-bg; }
+    }
+  } @else {
+    background: $pagination-link-current-background;
+    color: $pagination-link-current-font-color;
+    font-weight: $pagination-link-current-font-weight;
+    cursor: $pagination-link-current-cursor;
+
+    &:hover,
+    &:focus { background: $pagination-link-current-active-bg; }
+  }
+}
+
 // We use this mixin to set the properties for the creating Foundation pagination
-@mixin pagination($center:false, $base-style:true) {
+@mixin pagination($center:false, $base-style:true, $use-default-classes:true) {
 
   @if $base-style {
     display: block;
@@ -44,8 +83,6 @@ $pagination-link-current-active-bg: $primary-color !default;
     margin-#{$default-float}: $pagination-margin;
 
     li {
-      display: block;
-      float: $pagination-li-float;
       height: $pagination-li-height;
       color: $pagination-li-font-color;
       font-size: $pagination-li-font-size;
@@ -60,41 +97,42 @@ $pagination-link-current-active-bg: $primary-color !default;
       &:hover a,
       a:focus { background: $pagination-link-active-bg; }
 
-      &.unavailable a {
-        cursor: $pagination-link-unavailable-cursor;
-        color: $pagination-link-unavailable-font-color;
-      }
-
-      &.unavailable:hover a, &.unavailable a:focus { background: $pagination-link-unavailable-bg-active; }
-
-      &.current a {
-        background: $pagination-link-current-background;
-        color: $pagination-link-current-font-color;
-        font-weight: $pagination-link-current-font-weight;
-        cursor: $pagination-link-current-cursor;
-
-        &:hover,
-        &:focus { background: $pagination-link-current-active-bg; }
+      @if $use-default-classes {
+        &.unavailable { @include pagination-unavailable-item(); }
+        &.current { @include pagination-current-item(); }
       }
     }
   }
 
-  @if $center {
-    & { text-align: center;
-      ul > li {
-        float: none;
-        display: inline-block;
-      }
+  // Left or center align the li elements
+  li {
+    @if $center {
+      float: none;
+      display: inline-block;
+    } @else {
+      float: $pagination-li-float;
+      display: block;
     }
   }
 }
 
+@if $include-html-nav-classes != false {
 
+  // Detach the nested class selectors from the containing
+  // ul and div elements in order to support more flexibility
+  // for external code that uses the Sass mixins.
 
+  /* Default Pagination */
+  ul.pagination {
+    @include pagination;
+  }
 
-@if $include-html-nav-classes != false {
+  /* Pagination centred wrapper */
+  .pagination-centered {
+    @include pagination-container(true);
 
-  /* Pagination */
-  .pagination { @include pagination; }
-  .pagination-centered { @include pagination(true,false); }
-}
+    ul.pagination {
+      @include pagination(true, false);
+    }
+  }
+}

data/scss/foundation/components/_switch.scss

@@ -89,7 +89,7 @@ $switch-label-outline:            1px dotted #888 !default;
   }
 
   // The toggle area for radio switches. We call is a paddle.
-  & > span {
+  span:last-child {
     position: absolute;
     top: -1px;
     #{$default-float}: -1px;
@@ -129,6 +129,11 @@ $switch-label-outline:            1px dotted #888 !default;
   // http://css-tricks.com/webkit-sibling-bug/
   @if $experimental { -webkit-animation: webkitSiblingBugfix infinite 1s; }
 
+  form.custom & .hidden-field {
+    margin-left: auto;
+    position: absolute;
+    visibility: visible;
+  }
 }
 
 // We use this mixin to create the size styles for switches.
@@ -144,13 +149,13 @@ $switch-label-outline:            1px dotted #888 !default;
 
   input {
     // Move the paddle to the right position
-    &:first-of-type:checked ~ span {
+    &:first-of-type:checked ~ span:last-child {
       #{$default-float}: 100%;
       margin-#{$default-float}: emCalc(-$height + 1px);
     }
   }
 
-  & > span {
+  span:last-child {
     width: emCalc($height);
     height: emCalc($height);
   }
@@ -164,7 +169,7 @@ $switch-label-outline:            1px dotted #888 !default;
     background: $switch-bg;
     border-color: $switch-border-color;
 
-    & > span {
+    span:last-child {
       border-color: darken($paddle-bg, 30%);
       background: $paddle-bg;
       @if $experimental {
@@ -188,7 +193,7 @@ $switch-label-outline:            1px dotted #888 !default;
 
     &:hover,
     &:focus {
-      & > span {
+      span:last-child {
         background: $paddle-bg;
         @if $experimental {
           background: -moz-linear-gradient(top, $paddle-bg 0%, darken($paddle-bg, 10%) 100%);
@@ -204,11 +209,11 @@ $switch-label-outline:            1px dotted #888 !default;
   // Setting up the radius for switches
   @if $radius == true {
     @include radius(4px);
-    & > span { @include radius(3px); }
+    span:last-child { @include radius(3px); }
   }
   @else if $radius {
     @include radius($radius);
-    & > span { @include radius($radius - 1px); }
+    span:last-child { @include radius($radius - 1px); }
   }
 
 }
@@ -240,12 +245,12 @@ $switch-label-outline:            1px dotted #888 !default;
 
       // Add a radius to the switch
       &.radius { @include radius(4px);
-        & > span { @include radius(3px); }
+        span:last-child{ @include radius(3px); }
       }
 
       // Make the switch completely round, like a pill
       &.round { @include radius(1000px);
-        & > span { @include radius(999px); }
+        span:last-child { @include radius(999px); }
         label { padding: 0 emCalc($switch-label-side-padding + 3px); }
       }
 

data/scss/foundation/components/_top-bar.scss

@@ -243,12 +243,6 @@ $topbar-sticky-class: ".sticky" !default;
         font-weight: $topbar-link-weight;
         background: $topbar-dropdown-bg;
 
-        &.hover {
-          background: $topbar-link-bg-hover;
-          color: $topbar-link-color-hover;
-        }
-
-
         &.button {
           background: $primary-color;
           font-size: $topbar-link-font-size;
@@ -277,6 +271,12 @@ $topbar-sticky-class: ".sticky" !default;
 
       }
 
+      // Apply the hover link color when it has that class
+      &.hover > a {
+        background: $topbar-link-bg-hover;
+        color: $topbar-link-color-hover;
+      }
+
       // Apply the active link color when it has that class
       &.active > a {
         background: $topbar-link-bg-active;
@@ -496,9 +496,33 @@ $topbar-sticky-class: ".sticky" !default;
           li .dropdown { right: 100%; }
         }
       }
-
     }
+    
+    // Degrade gracefully when Javascript is disabled. Displays dropdown and changes 
+    // background & text color on hover.
+    .no-js .top-bar-section {
+	  ul li {    
+        // Apply the hover link color when it has that class
+        &:hover > a {
+          background: $topbar-link-bg-hover;
+          color: $topbar-link-color-hover;
+        }
 
+        // Apply the active link color when it has that class
+        &:active > a {
+          background: $topbar-link-bg-active;
+          color: $topbar-link-color-active;
+        }
+      }    
+      
+	  .has-dropdown {
+        &:hover {
+          & > .dropdown {
+            visibility: visible;
+          }
+        }
+	  }
+	}    
   }
 
 }

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: zurb-foundation
 version: !ruby/object:Gem::Version
-  version: 4.2.2
+  version: 4.2.3
   prerelease: 
 platform: ruby
 authors:
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-06-11 00:00:00.000000000 Z
+date: 2013-06-26 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sass
@@ -243,7 +243,7 @@ required_ruby_version: !ruby/object:Gem::Requirement
       version: '0'
       segments:
       - 0
-      hash: -541920394098296033
+      hash: 2423571560475878438
 required_rubygems_version: !ruby/object:Gem::Requirement
   none: false
   requirements:
@@ -252,7 +252,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
       segments:
       - 0
-      hash: -541920394098296033
+      hash: 2423571560475878438
 requirements: []
 rubyforge_project: 
 rubygems_version: 1.8.23