foundation-rails 5.5.2.1 → 5.5.3.1

data/vendor/assets/javascripts/foundation/foundation.tooltip.js

@@ -4,7 +4,7 @@
   Foundation.libs.tooltip = {
     name : 'tooltip',
 
-    version : '5.5.2',
+    version : '5.5.3',
 
     settings : {
       additional_inheritable_classes : [],
@@ -13,6 +13,8 @@
       touch_close_text : 'Tap To Close',
       disable_for_touch : false,
       hover_delay : 200,
+      fade_in_duration : 150,
+      fade_out_duration : 150,
       show_on : 'all',
       tip_template : function (selector, content) {
         return '<span data-selector="' + selector + '" id="' + selector + '" class="'
@@ -208,14 +210,14 @@
     },
 
     reposition : function (target, tip, classes) {
-      var width, nub, nubHeight, nubWidth, column, objPos;
+      var width, nub, nubHeight, nubWidth, objPos;
 
       tip.css('visibility', 'hidden').show();
 
       width = target.data('width');
       nub = tip.children('.nub');
       nubHeight = nub.outerHeight();
-      nubWidth = nub.outerHeight();
+      nubWidth = nub.outerWidth();
 
       if (this.small()) {
         tip.css({'width' : '100%'});
@@ -231,39 +233,46 @@
           'right' : (right) ? right : 'auto'
         }).end();
       };
+      
+      var o_top = target.offset().top;
+      var o_left = target.offset().left;
+      var outerHeight = target.outerHeight();
 
-      objPos(tip, (target.offset().top + target.outerHeight() + 10), 'auto', 'auto', target.offset().left);
+      objPos(tip, (o_top + outerHeight + 10), 'auto', 'auto', o_left);
 
       if (this.small()) {
-        objPos(tip, (target.offset().top + target.outerHeight() + 10), 'auto', 'auto', 12.5, $(this.scope).width());
+        objPos(tip, (o_top + outerHeight + 10), 'auto', 'auto', 12.5, $(this.scope).width());
         tip.addClass('tip-override');
-        objPos(nub, -nubHeight, 'auto', 'auto', target.offset().left);
+        objPos(nub, -nubHeight, 'auto', 'auto', o_left);
       } else {
-        var left = target.offset().left;
+        
         if (Foundation.rtl) {
           nub.addClass('rtl');
-          left = target.offset().left + target.outerWidth() - tip.outerWidth();
+          o_left = o_left + target.outerWidth() - tip.outerWidth();
         }
 
-        objPos(tip, (target.offset().top + target.outerHeight() + 10), 'auto', 'auto', left);
+        objPos(tip, (o_top + outerHeight + 10), 'auto', 'auto', o_left);
         // reset nub from small styles, if they've been applied
         if (nub.attr('style')) {
           nub.removeAttr('style');
         }
         
         tip.removeClass('tip-override');
+        
+        var tip_outerHeight = tip.outerHeight();
+        
         if (classes && classes.indexOf('tip-top') > -1) {
           if (Foundation.rtl) {
             nub.addClass('rtl');
           }
-          objPos(tip, (target.offset().top - tip.outerHeight()), 'auto', 'auto', left)
+          objPos(tip, (o_top - tip_outerHeight), 'auto', 'auto', o_left)
             .removeClass('tip-override');
         } else if (classes && classes.indexOf('tip-left') > -1) {
-          objPos(tip, (target.offset().top + (target.outerHeight() / 2) - (tip.outerHeight() / 2)), 'auto', 'auto', (target.offset().left - tip.outerWidth() - nubHeight))
+          objPos(tip, (o_top + (outerHeight / 2) - (tip_outerHeight / 2)), 'auto', 'auto', (o_left - tip.outerWidth() - nubHeight))
             .removeClass('tip-override');
           nub.removeClass('rtl');
         } else if (classes && classes.indexOf('tip-right') > -1) {
-          objPos(tip, (target.offset().top + (target.outerHeight() / 2) - (tip.outerHeight() / 2)), 'auto', 'auto', (target.offset().left + target.outerWidth() + nubHeight))
+          objPos(tip, (o_top + (outerHeight / 2) - (tip_outerHeight / 2)), 'auto', 'auto', (o_left + target.outerWidth() + nubHeight))
             .removeClass('tip-override');
           nub.removeClass('rtl');
         }
@@ -307,19 +316,19 @@
 
     show : function ($target) {
       var $tip = this.getTip($target);
-
       if ($target.data('tooltip-open-event-type') == 'touch') {
         this.convert_to_touch($target);
       }
 
       this.reposition($target, $tip, $target.attr('class'));
       $target.addClass('open');
-      $tip.fadeIn(150);
+      $tip.fadeIn(this.settings.fade_in_duration);
     },
 
     hide : function ($target) {
       var $tip = this.getTip($target);
-      $tip.fadeOut(150, function () {
+
+      $tip.fadeOut(this.settings.fade_out_duration, function () {
         $tip.find('.tap-to-close').remove();
         $tip.off('click.fndtn.tooltip.tapclose MSPointerDown.fndtn.tapclose');
         $target.removeClass('open');

data/vendor/assets/javascripts/foundation/foundation.topbar.js

@@ -4,7 +4,7 @@
   Foundation.libs.topbar = {
     name : 'topbar',
 
-    version : '5.5.2',
+    version : '5.5.3',
 
     settings : {
       index : 0,
@@ -165,17 +165,17 @@
           self.toggle(this);
         })
         .on('click.fndtn.topbar contextmenu.fndtn.topbar', '.top-bar .top-bar-section li a[href^="#"],[' + this.attr_name() + '] .top-bar-section li a[href^="#"]', function (e) {
-            var li = $(this).closest('li'),
-                topbar = li.closest('[' + self.attr_name() + ']'),
-                settings = topbar.data(self.attr_name(true) + '-init');
+          var li = $(this).closest('li'),
+              topbar = li.closest('[' + self.attr_name() + ']'),
+              settings = topbar.data(self.attr_name(true) + '-init');
 
-            if (settings.dropdown_autoclose && settings.is_hover) {
-              var hoverLi = $(this).closest('.hover');
-              hoverLi.removeClass('hover');
-            }
-            if (self.breakpoint() && !li.hasClass('back') && !li.hasClass('has-dropdown')) {
-              self.toggle();
-            }
+          if (settings.dropdown_autoclose && settings.is_hover) {
+            var hoverLi = $(this).closest('.hover');
+            hoverLi.removeClass('hover');
+          }
+          if (self.breakpoint() && !li.hasClass('back') && !li.hasClass('has-dropdown')) {
+            self.toggle();
+          }
 
         })
         .on('click.fndtn.topbar', '[' + this.attr_name() + '] li.has-dropdown', function (e) {

data/vendor/assets/stylesheets/foundation.scss

@@ -2,8 +2,6 @@
 // foundation.zurb.com
 // Licensed under MIT Open Source
 
-// Make sure the charset is set appropriately
-
 // Behold, here are all the Foundation components.
 @import 'foundation/components/grid';
 @import 'foundation/components/accordion';

data/vendor/assets/stylesheets/foundation/_functions.scss

@@ -135,8 +135,8 @@ $modules: () !default;
 }
 
 
-@function em-calc($values) {
-  $remValues: rem-calc($values);
+@function em-calc($values, $base-value: $rem-base) {
+  $remValues: rem-calc($values, $base-value: $rem-base);
 
   $max: length($remValues);
 

data/vendor/assets/stylesheets/foundation/_settings.scss

@@ -6,7 +6,7 @@
 
 // Table of Contents
 // Foundation Settings
-//
+
 // a. Base
 // b. Grid
 // c. Global
@@ -336,6 +336,7 @@ $include-html-global-classes: $include-html-classes;
 // $accordion-navigation-bg-color: $silver;
 // $accordion-navigation-hover-bg-color: scale-color($accordion-navigation-bg-color, $lightness: -5%);
 // $accordion-navigation-active-bg-color: scale-color($accordion-navigation-bg-color, $lightness: -3%);
+// $accordion-navigation-active-font-color: $jet;
 // $accordion-navigation-font-color: $jet;
 // $accordion-navigation-font-size: rem-calc(16);
 // $accordion-navigation-font-family: $body-font-family;
@@ -431,6 +432,7 @@ $include-html-global-classes: $include-html-classes;
 // We use these to control the slash between breadcrumbs
 // $crumb-slash-color: $base;
 // $crumb-slash: "/";
+// $crumb-slash-position: 1px;
 
 // 05. Buttons
 // - - - - - - - - - - - - - - - - - - - - - - - - -
@@ -647,6 +649,7 @@ $include-html-global-classes: $include-html-classes;
 // $input-font-family: inherit;
 // $input-font-color: rgba(0,0,0,0.75);
 // $input-font-size: rem-calc(14);
+// $input-placeholder-font-color: #cccccc;
 // $input-bg-color: $white;
 // $input-focus-bg-color: scale-color($white, $lightness: -2%);
 // $input-border-color: scale-color($white, $lightness: -20%);
@@ -1104,7 +1107,7 @@ $include-html-global-classes: $include-html-classes;
 // $range-slider-vertical-bar-width: rem-calc(16);
 // $range-slider-vertical-bar-height: rem-calc(200);
 
-// These variabels define the slider handle styles
+// These variables define the slider handle styles
 // $range-slider-handle-width: rem-calc(32);
 // $range-slider-handle-height: rem-calc(22);
 // $range-slider-handle-position-top: rem-calc(-5);
@@ -1315,7 +1318,7 @@ $include-html-global-classes: $include-html-classes;
 // $table-foot-padding: $table-head-padding;
 
 // These control the caption
-// table-caption-bg: transparent;
+// $table-caption-bg: transparent;
 // $table-caption-font-color: $table-head-font-color;
 // $table-caption-font-size: rem-calc(16);
 // $table-caption-font-weight: bold;

data/vendor/assets/stylesheets/foundation/components/_accordion.scss

@@ -14,6 +14,7 @@ $accordion-navigation-padding: rem-calc(16) !default;
 $accordion-navigation-bg-color: $silver !default;
 $accordion-navigation-hover-bg-color: scale-color($accordion-navigation-bg-color, $lightness: -5%) !default;
 $accordion-navigation-active-bg-color: scale-color($accordion-navigation-bg-color, $lightness: -3%) !default;
+$accordion-navigation-active-font-color: $jet !default;
 $accordion-navigation-font-color: $jet !default;
 $accordion-navigation-font-size: rem-calc(16) !default;
 $accordion-navigation-font-family: $body-font-family !default;
@@ -40,8 +41,9 @@ $accordion-content-active-bg-color: $white !default;
 //    @params $font-color [ color or string ]: Color of the font for accordion
 //    @params $font-size [ number ]: Specifiy the font-size of the text inside the navigation element
 //    @params $font-family [ string ]: Specify the font family for the text of the navigation of the accorion
+//    @params $active-font [ color or string ]: Specify the font color for the navigation element when active.
 
-@mixin accordion-navigation( $bg: $accordion-navigation-bg-color, $hover-bg: $accordion-navigation-hover-bg-color, $active-bg: $accordion-navigation-active-bg-color, $padding: $accordion-navigation-padding, $active_class: 'active',  $font-color: $accordion-navigation-font-color, $font-size: $accordion-navigation-font-size, $font-family: $accordion-navigation-font-family ) {
+@mixin accordion-navigation( $bg: $accordion-navigation-bg-color, $hover-bg: $accordion-navigation-hover-bg-color, $active-bg: $accordion-navigation-active-bg-color, $padding: $accordion-navigation-padding, $active_class: 'active',  $font-color: $accordion-navigation-font-color, $font-size: $accordion-navigation-font-size, $font-family: $accordion-navigation-font-family, $active-font: $accordion-navigation-active-font-color ) {
   display: block;
   margin-bottom: 0 !important;
   @if type-of($active_class) != "string" {
@@ -50,6 +52,7 @@ $accordion-content-active-bg-color: $white !default;
   @else {
     &.#{ $active_class } > a {
       background: $active-bg;
+      color: $active-font;
     }
   }
   > a {
@@ -129,10 +132,11 @@ $accordion-content-active-bg-color: $white !default;
     .accordion {
       @include clearfix;
       margin-bottom: 0;
+      margin-left: 0;
       .accordion-navigation, dd {
         display: block;
         margin-bottom: 0 !important;
-        &.active > a { background: $accordion-navigation-active-bg-color; }
+        &.active > a { background: $accordion-navigation-active-bg-color; color: $accordion-navigation-active-font-color; }
         > a {
           background: $accordion-navigation-bg-color;
           color: $accordion-navigation-font-color;

data/vendor/assets/stylesheets/foundation/components/_breadcrumbs.scss

@@ -34,6 +34,7 @@ $crumb-link-decor: underline !default;
 // We use these to control the slash between breadcrumbs
 $crumb-slash-color: $base !default;
 $crumb-slash: "/" !default;
+$crumb-slash-position: 1px !default;
 
 //
 // Breadcrumb Mixins
@@ -104,7 +105,7 @@ $crumb-slash: "/" !default;
     content: "#{$crumb-slash}";
     margin: 0 $crumb-side-padding;
     position: relative;
-    top: 1px;
+    top: $crumb-slash-position;
   }
 
   &:first-child:before {

data/vendor/assets/stylesheets/foundation/components/_button-groups.scss

@@ -172,6 +172,7 @@ $button-group-border-width: 1px !default;
           @include button-group-style($orientation:horizontal);
           @media #{$small-only} {
             @include button-group-style($orientation:vertical);
+            width: 100%;
           }
         }
       }

data/vendor/assets/stylesheets/foundation/components/_buttons.scss

@@ -39,14 +39,19 @@ $button-border-style: solid !default;
 $button-bg-color: $primary-color !default;
 $button-bg-hover: scale-color($button-bg-color, $lightness: $button-function-factor) !default;
 $button-border-color: $button-bg-hover !default;
+$secondary-button-bg-color: $secondary-color !default;
 $secondary-button-bg-hover: scale-color($secondary-color, $lightness: $button-function-factor) !default;
 $secondary-button-border-color: $secondary-button-bg-hover !default;
+$success-button-bg-color: $success-color !default;
 $success-button-bg-hover: scale-color($success-color, $lightness: $button-function-factor) !default;
 $success-button-border-color: $success-button-bg-hover !default;
+$alert-button-bg-color: $alert-color !default;
 $alert-button-bg-hover: scale-color($alert-color, $lightness: $button-function-factor) !default;
 $alert-button-border-color: $alert-button-bg-hover !default;
+$warning-button-bg-color: $warning-color !default;
 $warning-button-bg-hover: scale-color($warning-color, $lightness: $button-function-factor) !default;
 $warning-button-border-color: $warning-button-bg-hover !default;
+$info-button-bg-color: $info-color !default;
 $info-button-bg-hover: scale-color($info-color, $lightness: $button-function-factor) !default;
 $info-button-border-color: $info-button-bg-hover !default;
 
@@ -116,8 +121,8 @@ $button-disabled-cursor: $cursor-default-value !default;
       padding-bottom:0;
       padding-top:0;
     }
-    padding-left: 0;
-    padding-right: 0;
+    padding-left: $button-med;
+    padding-right: $button-med;
     width: 100%;
   }
 }
@@ -217,16 +222,16 @@ $button-disabled-cursor: $cursor-default-value !default;
 
       @include single-transition(background-color);
 
-      &.secondary { @include button-style($bg:$secondary-color, $bg-hover:$secondary-button-bg-hover, $border-color:$secondary-button-border-color); }
-      &.success   { @include button-style($bg:$success-color, $bg-hover:$success-button-bg-hover, $border-color:$success-button-border-color); }
-      &.alert     { @include button-style($bg:$alert-color, $bg-hover:$alert-button-bg-hover, $border-color:$alert-button-border-color); }
-      &.warning   { @include button-style($bg:$warning-color, $bg-hover:$warning-button-bg-hover, $border-color:$warning-button-border-color); }
-      &.info      { @include button-style($bg:$info-color, $bg-hover:$info-button-bg-hover, $border-color:$info-button-border-color); }
+      &.secondary { @include button-style($bg:$secondary-button-bg-color, $bg-hover:$secondary-button-bg-hover, $border-color:$secondary-button-border-color); }
+      &.success   { @include button-style($bg:$success-button-bg-color, $bg-hover:$success-button-bg-hover, $border-color:$success-button-border-color); }
+      &.alert     { @include button-style($bg:$alert-button-bg-color, $bg-hover:$alert-button-bg-hover, $border-color:$alert-button-border-color); }
+      &.warning   { @include button-style($bg:$warning-button-bg-color, $bg-hover:$warning-button-bg-hover, $border-color:$warning-button-border-color); }
+      &.info      { @include button-style($bg:$info-button-bg-color, $bg-hover:$info-button-bg-hover, $border-color:$info-button-border-color); }
 
       &.large  { @include button-size($padding:$button-lrg); }
       &.small  { @include button-size($padding:$button-sml); }
       &.tiny   { @include button-size($padding:$button-tny); }
-      &.expand { @include button-size($padding:null, $full-width:true); }
+      &.expand { @include button-size($full-width:true); }
 
       &.left-align  { text-align: left; text-indent: rem-calc(12); }
       &.right-align { text-align: right; padding-right: rem-calc(12); }
@@ -235,11 +240,11 @@ $button-disabled-cursor: $cursor-default-value !default;
       &.round  { @include button-style($bg:false, $radius:$button-round); }
 
       &.disabled, &[disabled] { @include button-style($bg:$button-bg-color, $disabled:true, $bg-hover:$button-bg-hover, $border-color:$button-border-color);
-        &.secondary { @include button-style($bg:$secondary-color, $disabled:true, $bg-hover:$secondary-button-bg-hover, $border-color:$secondary-button-border-color); }
-        &.success { @include button-style($bg:$success-color, $disabled:true, $bg-hover:$success-button-bg-hover, $border-color:$success-button-border-color); }
-        &.alert { @include button-style($bg:$alert-color, $disabled:true, $bg-hover:$alert-button-bg-hover, $border-color:$alert-button-border-color); }
-        &.warning { @include button-style($bg:$warning-color, $disabled:true, $bg-hover:$warning-button-bg-hover, $border-color:$warning-button-border-color); }
-        &.info { @include button-style($bg:$info-color, $disabled:true, $bg-hover:$info-button-bg-hover, $border-color:$info-button-border-color); }
+        &.secondary { @include button-style($bg:$secondary-button-bg-color, $disabled:true, $bg-hover:$secondary-button-bg-hover, $border-color:$secondary-button-border-color); }
+        &.success { @include button-style($bg:$success-button-bg-color, $disabled:true, $bg-hover:$success-button-bg-hover, $border-color:$success-button-border-color); }
+        &.alert { @include button-style($bg:$alert-button-bg-color, $disabled:true, $bg-hover:$alert-button-bg-hover, $border-color:$alert-button-border-color); }
+        &.warning { @include button-style($bg:$warning-button-bg-color, $disabled:true, $bg-hover:$warning-button-bg-hover, $border-color:$warning-button-border-color); }
+        &.info { @include button-style($bg:$info-button-bg-color, $disabled:true, $bg-hover:$info-button-bg-hover, $border-color:$info-button-border-color); }
       }
     }
 

data/vendor/assets/stylesheets/foundation/components/_dropdown.scss

@@ -215,8 +215,6 @@ $f-dropdown-radius: $global-radius !default;
   &:hover,
   &:focus { background: $f-dropdown-list-hover-bg; }
 
-  &.radius { @include radius($f-dropdown-radius); }
-
   a {
     display: block;
     padding: $f-dropdown-list-padding;
@@ -249,6 +247,9 @@ $f-dropdown-radius: $global-radius !default;
       // You can also put custom content in these dropdowns
       &.content { @include dropdown-container(content, $triangle:false); }
 
+      // Radius of Dropdown
+      &.radius { @include radius($f-dropdown-radius); }
+
       // Sizes
       &.tiny    { max-width: 200px; }
       &.small   { max-width: 300px; }

data/vendor/assets/stylesheets/foundation/components/_forms.scss

@@ -23,7 +23,7 @@ $form-label-small-transform: capitalize !default;
 $form-label-bottom-margin: 0 !default;
 $input-font-family: inherit !default;
 $input-font-color: rgba(0,0,0,0.75) !default;
-$input-placeholder-font-color: #cccccc !default;
+$input-placeholder-font-color: $steel !default;
 $input-font-size: rem-calc(14) !default;
 $input-bg-color: $white !default;
 $input-focus-bg-color: scale-color($white, $lightness: -2%) !default;
@@ -45,7 +45,6 @@ $fieldset-padding: rem-calc(20) !default;
 $fieldset-margin: rem-calc(18 0) !default;
 
 // We use these to style the legends when you use them
-$legend-bg: $white !default;
 $legend-font-weight: $font-weight-bold !default;
 $legend-padding: rem-calc(0 3) !default;
 
@@ -240,7 +239,7 @@ $select-hover-bg-color: scale-color($select-bg-color, $lightness: -3%) !default;
 // We use this mixin to create postfix label styles
 // $bg - Default:$input-prefix-bg || scale-color($white, $lightness: -5%) !default;
 // $is-button - Toggle position settings if prefix is a button. Default: false
-@mixin postfix($bg:$input-prefix-bg, $border-left-hidden:false, $border:$input-prefix-border-color, $is-button:false) {
+@mixin postfix($bg:$input-prefix-bg, $border-left-hidden:true, $border:$input-prefix-border-color, $is-button:false) {
 
   @if $bg {
     $bg-lightness: lightness($bg);
@@ -277,10 +276,9 @@ $select-hover-bg-color: scale-color($select-bg-color, $lightness: -3%) !default;
 
   // and legend styles
   legend {
-    background: $legend-bg;
     font-weight: $legend-font-weight;
-    margin-#{$default-float}: rem-calc(-3);
     margin: 0;
+    margin-#{$default-float}: rem-calc(-3);
     padding: $legend-padding;
   }
 }
@@ -340,7 +338,7 @@ $select-hover-bg-color: scale-color($select-bg-color, $lightness: -3%) !default;
 
   // The custom arrow has some fake horizontal padding so we can align it
   // from the right side of the element without relying on CSS3
-  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMTJweCIgeT0iMHB4IiB3aWR0aD0iMjRweCIgaGVpZ2h0PSIzcHgiIHZpZXdCb3g9IjAgMCA2IDMiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDYgMyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBvbHlnb24gcG9pbnRzPSI1Ljk5MiwwIDIuOTkyLDMgLTAuMDA4LDAgIi8+PC9zdmc+);
+  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMTJweCIgeT0iMHB4IiB3aWR0aD0iMjRweCIgaGVpZ2h0PSIzcHgiIHZpZXdCb3g9IjAgMCA2IDMiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDYgMyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBvbHlnb24gcG9pbnRzPSI1Ljk5MiwwIDIuOTkyLDMgLTAuMDA4LDAgIi8+PC9zdmc+');
 
   // We can safely use leftmost and rightmost now
   background-position: if($text-direction == 'rtl', 0%, 100%) center;
@@ -358,7 +356,7 @@ $select-hover-bg-color: scale-color($select-bg-color, $lightness: -3%) !default;
   padding: ($form-spacing / 2);
   @include radius(0);
   &.radius { @include radius($global-radius); }
-  &:hover {
+  &:focus {
     background-color: $select-hover-bg-color;
     border-color: $input-focus-border-color;
   }
@@ -370,12 +368,12 @@ $select-hover-bg-color: scale-color($select-bg-color, $lightness: -3%) !default;
 }
 
 // We use this mixin to turn on/off HTML5 number spinners
-@mixin html5number($browser, $on:true) {
-  @if $on==false {
-      @if $browser==webkit {
+@mixin html5number($browser, $on: true) {
+  @if $on == false {
+      @if $browser == webkit {
         -webkit-appearance: none;
         margin: 0;
-      } @else if $browser==moz {
+      } @else if $browser == moz {
         -moz-appearance: textfield;
       }
   }
@@ -405,7 +403,7 @@ $select-hover-bg-color: scale-color($select-bg-color, $lightness: -3%) !default;
     .postfix { @include prefix-postfix-base; }
 
     /* Adjust padding, alignment and radius if pre/post element is a button */
-    .postfix.button { @include button-size(false, false); @include postfix(false, false, true); }
+    .postfix.button { @include button-size(false, false); @include postfix(false, false, false, true); }
     .prefix.button { @include button-size(false, false); @include prefix(false, false, true); }
 
     .prefix.button.radius { @include radius(0); @include side-radius($default-float, $button-radius); }
@@ -418,7 +416,7 @@ $select-hover-bg-color: scale-color($select-bg-color, $lightness: -3%) !default;
     span.postfix, label.postfix { @include postfix(); }
 
     /* We use this to get basic styling on all basic form elements */
-    #{text-inputs(all, 'input')} {
+    input:not([type]), #{text-inputs(all, 'input')} {
       -webkit-appearance: none;
       -moz-appearance: none;
       border-radius: 0;
@@ -479,28 +477,28 @@ $select-hover-bg-color: scale-color($select-bg-color, $lightness: -3%) !default;
       height: auto;
     }
 
-	  /* Not allow resize out of parent */
-	  textarea {
-	    max-width: 100%;
-	  }
-    
+    /* Not allow resize out of parent */
+    textarea {
+      max-width: 100%;
+    }
+
     // style placeholder text cross browser
     ::-webkit-input-placeholder {
       color: $input-placeholder-font-color;
     }
 
     :-moz-placeholder { /* Firefox 18- */
-       color: $input-placeholder-font-color;  
+       color: $input-placeholder-font-color;
     }
 
     ::-moz-placeholder {  /* Firefox 19+ */
-       color: $input-placeholder-font-color;  
+       color: $input-placeholder-font-color;
     }
 
-    :-ms-input-placeholder {  
-       color: $input-placeholder-font-color;  
+    :-ms-input-placeholder {
+       color: $input-placeholder-font-color;
     }
-   
+
 
     /* Add height value for select elements to match text input height */
     select {