mui-sass 0.2.0 → 0.2.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 28053454a00e1c7a3a64d6fb3a8730d0da3535a9
-  data.tar.gz: a9109a451382a7177256715fa0ff1b016984c2a2
+  metadata.gz: b6acc3165ff8c408c699f44001f77a3e6347c5e0
+  data.tar.gz: 1845264b55d6120e6a44cb9d7a10e3d438b05603
 SHA512:
-  metadata.gz: b969a6308bb1573e21881f206a59090a214441dc63ede12679e6ff39eea7ca02e6f5d0d68f03e6aa3531dc8fbc9dd83f12cd5603583ae1a3f986d753f96b54c7
-  data.tar.gz: f6f950034f6c81ab533564ae20ff58540b64eceec0fe079846f37b885bd3e85eb59304c5b0cf84ff85612d9d756c472339936cef008107beb3edbd02cafead30
+  metadata.gz: 55b35d3b93405b36d376117b064ea399ee870ce9b947002daa861c10fb5e7fc7a06c8a8c76519834e450b1c019ee6723f5958451ca27c3f549e06041fcb23cba
+  data.tar.gz: 1592dd27f1dbcad6ba07e21623679a0e5d94991828fc71f46d2e05b6befbd9d43542a312f6475a55865b5a077c67b0a709604ed5f4b26d2f381fd013e8ce6ca0

data/CHANGELOG.md

@@ -1,3 +1,9 @@
+## 0.2.1 (2015-10-17)
+
+- Update assets to match upstream version
+
+Framework version: MUI v0.2.1
+
 ## 0.2.0 (2015-10-13)
 
 - Update assets to match upstream version

data/lib/mui/sass/version.rb

@@ -1,5 +1,5 @@
 module Mui
   module Sass
-    VERSION = '0.2.0'
+    VERSION = '0.2.1'
   end
 end

data/vendor/assets/javascripts/mui.js

@@ -498,12 +498,11 @@ module.exports = {
 
 var jqLite = require('../lib/jqLite.js'),
     util = require('../lib/util.js'),
-    cssSelector = '.mui-textfield__input',
+    cssSelector = '.mui-textfield > input, .mui-textfield > textarea',
     emptyClass = 'mui--is-empty',
     notEmptyClass = 'mui--is-not-empty',
     dirtyClass = 'mui--is-dirty',
-    formControlClass = 'mui-textfield__input',
-    floatingLabelClass = 'mui-textfield__label--floating';
+    floatingLabelClass = 'mui-textfield--float-label';
 
 
 /**
@@ -563,7 +562,7 @@ module.exports = {
 
     // add transition css for floating labels
     setTimeout(function() {
-      var css = '.' + floatingLabelClass + '{' + [
+      var css = '.mui-textfield.mui-textfield--float-label > label {' + [
         '-webkit-transition',
         '-moz-transition',
         '-o-transition',
@@ -580,9 +579,9 @@ module.exports = {
         var targetEl = ev.target;
 
         if (targetEl.tagName === 'LABEL' &&
-            jqLite.hasClass(targetEl, floatingLabelClass)) {
+            jqLite.hasClass(targetEl.parentNode, floatingLabelClass)) {
           var inputEl = targetEl.previousElementSibling;
-          if (jqLite.hasClass(inputEl, formControlClass)) inputEl.focus();
+          if (inputEl) inputEl.focus();
         }
       });
     }

data/vendor/assets/stylesheets/mui/_forms.scss

@@ -71,7 +71,23 @@ input[type="checkbox"]:disabled {
     white-space: nowrap;
   }
 
-  > .mui-textfield__label--floating {
+  > textarea {
+    padding-top: 5px;
+    min-height: $mui-textarea-height;
+  }
+
+  > input,
+  > textarea {
+    display: block;
+
+    &:focus ~ label {
+      color: $mui-input-border-color-focus;
+    }
+  }
+}
+
+.mui-textfield--float-label {
+  > label {
     // Layout
     position: absolute;
     top: $xFormLabelLineHeight;
@@ -83,31 +99,43 @@ input[type="checkbox"]:disabled {
     
     // Overflow policy
     text-overflow: clip;
-
+    
     // Cursor
     cursor: text;  // for ie10
     pointer-events: none;
   }
 
+  > input,
   > textarea {
-    padding-top: 5px;
-    min-height: $mui-textarea-height;
-  }
-
-  > .mui-textfield__input {
-    display: block;
-  }
+    &:focus ~ label {
+      top: 0px;
+      font-size: $mui-label-font-size;
+      line-height: $xFormLabelLineHeight;
+      text-overflow: ellipsis;
+    }
 
-  > .mui-textfield__input:focus ~ label {
-    color: $mui-input-border-color-focus;
+    &:not(:focus) {
+      &.mui--is-not-empty,
+      &[value]:not([value=""]):not(.mui--is-empty):not(.mui--is-not-empty),
+      &:not(:empty):not(.mui--is-empty):not(.mui--is-not-empty) {
+        ~ label {
+          color: $mui-label-font-color;
+          font-size: $mui-label-font-size;
+          line-height: $xFormLabelLineHeight;
+          top: 0px;
+          text-overflow: ellipsis;
+        }
+      }
+    }
   }
 }
 
 .mui-textfield--wrap-label {
   display: table;
+  width: 100%;
   padding-top: 0px;
 
-  > label:not(.mui-textfield__label--floating) {
+  &:not(.mui-textfield--float-label) > label {
     display: table-header-group;
     position: static;
     white-space: normal;
@@ -115,30 +143,8 @@ input[type="checkbox"]:disabled {
   }
 }
 
-// Placed outside of form-group for performance
-.mui-textfield__input:focus ~ .mui-textfield__label--floating {
-  top: 0px;
-  font-size: $mui-label-font-size;
-  line-height: $xFormLabelLineHeight;
-  text-overflow: ellipsis;
-}
-
-// Placed outside of form-group for performance
-.mui-textfield__input:not(:focus) {
-  &.mui--is-not-empty,
-  &[value]:not([value=""]):not(.mui--is-empty):not(.mui--is-not-empty),
-  &:not(:empty):not(.mui--is-empty):not(.mui--is-not-empty) {
-    ~ .mui-textfield__label--floating {
-      color: $mui-label-font-color;
-      font-size: $mui-label-font-size;
-      line-height: $xFormLabelLineHeight;
-      top: 0px;
-      text-overflow: ellipsis;
-    }
-  }
-}
-
-.mui-textfield__input {
+.mui-textfield > input,
+.mui-textfield > textarea {
   @include mui-node-inserted();
 
   display: block;
@@ -175,11 +181,11 @@ input[type="checkbox"]:disabled {
   }
 }
 
-textarea.mui-textfield__input {
+.mui-textfield > textarea {
   height: auto;  // Reset height for <textarea>s
 }
 
-input.mui-textfield__input:focus {
+.mui-textfield > input:focus {
   // Compensate for height change on focus
   height: $mui-input-height + 1px;
   margin-bottom: -1px;
@@ -366,11 +372,6 @@ input.mui-textfield__input:focus {
       margin-bottom: 0;
     }
 
-    > .mui-textfield__input {
-      display: inline-block;
-      width: auto;
-    }
-
     > .mui-radio,
     > .mui-checkbox {
       display: inline-block;
@@ -407,7 +408,8 @@ input.mui-textfield__input:focus {
 // FORM-VALIDATION
 // ============================================================================
 
-.mui-textfield__input {
+.mui-textfield > input,
+.mui-textfield > textarea {
   // Use thick colored border for invalid fields
   &:invalid:not(:focus) {
     &:not(:required),
@@ -422,7 +424,7 @@ input.mui-textfield__input:focus {
 }
 
 // Treat <input>'s different from <textarea>'s
-input.mui-textfield__input:invalid:not(:focus) {
+.mui-textfield > input:invalid:not(:focus) {
   &:not(:required),
   &:required.mui--is-not-empty,
   &:required.mui--is-empty.mui--is-dirty,
@@ -433,7 +435,8 @@ input.mui-textfield__input:invalid:not(:focus) {
   }
 }
 
-.mui-textfield > .mui-textfield__input {
+.mui-textfield > input,
+.mui-textfield > textarea {
   &:invalid:not(:focus) {
     // Set label color to danger color
     &:not(:required),
@@ -444,10 +447,17 @@ input.mui-textfield__input:invalid:not(:focus) {
         color: $mui-danger-color;
       }
     }
-    
-    // Set label color to danger color for dirty, empty fields
-    &:required.mui--is-empty.mui--is-dirty ~ label:not(.mui-textfield__label--floating) {
-      color: $mui-danger-color;
+  }
+}
+
+.mui-textfield:not(.mui-textfield--float-label) {
+  > input,
+  > textarea {
+    &:invalid:not(:focus) {
+      // Set label color to danger color for dirty, empty fields
+      &:required.mui--is-empty.mui--is-dirty ~ label {
+        color: $mui-danger-color;
+      }
     }
   }
 }

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: mui-sass
 version: !ruby/object:Gem::Version
-  version: 0.2.0
+  version: 0.2.1
 platform: ruby
 authors:
 - Dmitriy Tarasov
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2015-10-13 00:00:00.000000000 Z
+date: 2015-10-17 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sass