mui-sass 0.9.8 → 0.9.9

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 91a5cebca7469d407e8a6be7552bf98821f14c9c
-  data.tar.gz: 25ad2199a8d4a469cd2ed7568b8e384be0d0f19d
+  metadata.gz: 4c78e10f33f61678ecefe4ae3eb29d1b431c0e77
+  data.tar.gz: 140ba1bf681a6c884d5196828373ced15a2a1d64
 SHA512:
-  metadata.gz: 19707a144ac4038997d2df51b4dd81b5c146b6671aa572f8c60961094e7c76eb1895e8ac487f078daf54e596631aa6bea0cc028a01e27123397c6ca5ef2332ef
-  data.tar.gz: 97b03aa65eef7516759b672d843dae3e8a9666c6b7377cc942998736aeca8384b92b604033edc4efe59d6dbe93a17c937b24c65ff7270c1946028e32c26a1ba3
+  metadata.gz: 40470df44e5a5a512d7d83e24359290f34155daf2fdf3c1657b496fc7573cd0c2e96c62d0e6597b41a56189f740f2dc4b14d27743409f74280996d5a534beb24
+  data.tar.gz: ed3819b0bf17aa49ab5c376e54268269557e94723c9904d401c9c5fbdf657c0c6a565effb11e87041066eb5eec991072ccdd1b038841b59d33477866bfbbf697

data/CHANGELOG.md

@@ -1,3 +1,7 @@
+## 0.9.9 (2017-02-16)
+
+- Update assets to match upstream version
+
 ## 0.9.8 (2017-01-13)
 
 - Update assets to match upstream version

data/README.md

@@ -43,17 +43,16 @@ By default, using `@import 'mui';` and `//= require mui`, all of MUI components
 
 You can also import individual Sass components.
 
-First you need to include core components:
+First you need to include core and global components:
 
 ```scss
-// Normalizer
-@import "mui/normalize-3.0.3";
 // Core variables and mixins
-@import 'mui/colors';
-@import 'mui/variables';
-@import 'mui/mixins';
-// CSS Reboot
-@import "mui/reboot";
+@import "mui/colors";
+@import "mui/variables";
+@import "mui/mixins";
+
+// Globals
+@import "mui/globals";
 ```
 
 Then include desired Sass component:
@@ -105,4 +104,4 @@ Anyone is welcome to contribute to MUI Sass. Please [raise an issue](https://git
 
 MUI © Andres Morey, 2015. Released under the [MIT](https://github.com/muicss/mui/blob/master/LICENSE.txt) license.
 
-`mui-sass` © Dmitriy Tarasov, 2015. Released under the [MIT](https://github.com/rubysamurai/mui-sass/blob/master/LICENSE.txt) license.
+`mui-sass` © Dmitriy Tarasov, 2015. Released under the [MIT](https://github.com/rubysamurai/mui-sass/blob/master/LICENSE.txt) license.

data/lib/mui/sass/version.rb

@@ -1,5 +1,5 @@
 module Mui
   module Sass
-    VERSION = '0.9.8'
+    VERSION = '0.9.9'
   end
 end

data/vendor/assets/javascripts/mui.js

@@ -1933,12 +1933,17 @@ var jqLite = require('./lib/jqLite'),
     util = require('./lib/util'),
     animationHelpers = require('./lib/animationHelpers'),
     cssSelector = '.mui-textfield > input, .mui-textfield > textarea',
-    emptyClass = 'mui--is-empty',
-    notEmptyClass = 'mui--is-not-empty',
-    dirtyClass = 'mui--is-dirty',
     floatingLabelClass = 'mui-textfield--float-label';
 
 
+var touchedClass = 'mui--is-touched',  // hasn't lost focus yet
+    untouchedClass = 'mui--is-untouched',
+    pristineClass = 'mui--is-pristine',  // user hasn't interacted yet 
+    dirtyClass = 'mui--is-dirty',
+    emptyClass = 'mui--is-empty',  // control is empty
+    notEmptyClass = 'mui--is-not-empty';
+
+
 /**
  * Initialize input element.
  * @param {Element} inputEl - The input element.
@@ -1948,16 +1953,31 @@ function initialize(inputEl) {
   if (inputEl._muiTextfield === true) return;
   else inputEl._muiTextfield = true;
 
+  // add initial control state classes
   if (inputEl.value.length) jqLite.addClass(inputEl, notEmptyClass);
   else jqLite.addClass(inputEl, emptyClass);
 
-  jqLite.on(inputEl, 'input change', inputHandler);
+  jqLite.addClass(inputEl, untouchedClass + ' ' + pristineClass);
 
-  // add dirty class on focus
-  jqLite.on(inputEl, 'focus', function() {jqLite.addClass(this, dirtyClass);});
+  // replace `untouched` with `touched` when control loses focus
+  jqLite.on(inputEl, 'blur', function blurHandler () {
+    // ignore if event is a window blur
+    if (document.activeElement === inputEl) return;
 
-  // add dirty class if element is currently focused
-  if (document.activeElement === inputEl) jqLite.addClass(inputEl, dirtyClass);
+    // replace class and remove event handler
+    jqLite.removeClass(inputEl, untouchedClass);
+    jqLite.addClass(inputEl, touchedClass);
+    jqLite.off(inputEl, 'blur', blurHandler);
+  });
+
+  // replace `pristine` with `dirty` when user interacts with control
+  jqLite.one(inputEl, 'input change', function() {
+    jqLite.removeClass(inputEl, pristineClass);
+    jqLite.addClass(inputEl, dirtyClass);
+  });
+
+  // add change handler
+  jqLite.on(inputEl, 'input change', inputHandler);
 }
 
 
@@ -1974,8 +1994,6 @@ function inputHandler() {
     jqLite.removeClass(inputEl, notEmptyClass);
     jqLite.addClass(inputEl, emptyClass)
   }
-
-  jqLite.addClass(inputEl, dirtyClass);
 }
 
 

data/vendor/assets/stylesheets/_mui.scss

@@ -1,16 +1,12 @@
-// Normalizer
-@import
-"mui/normalize-5.0.0";
-
 // Core variables and mixins
 @import
 "mui/colors",
 "mui/variables",
 "mui/mixins";
 
-// CSS Reboot
+// Globals
 @import
-"mui/reboot";
+"mui/globals";
 
 // Components
 @import

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

@@ -13,6 +13,14 @@
                 0 0px 2px rgba(mui-color('black'), 0.12),
                 0 2px 2px rgba(mui-color('black'), 0.20);
   }
+
+  // Edge
+  @supports (-ms-ime-align:auto) {
+    box-shadow: 0 -1px 2px rgba(mui-color('black'), 0.12),
+                -1px 0px 2px rgba(mui-color('black'), 0.12),
+                0 0px 2px rgba(mui-color('black'), 0.12),
+                0 2px 2px rgba(mui-color('black'), 0.20);
+  }
 }
 
 @mixin x-btn-box-shadow-active() {
@@ -26,6 +34,14 @@
                 0 0px 4px rgba(mui-color('black'), 0.12),
                 1px 3px 4px rgba(mui-color('black'), 0.20);
   }
+
+  // Edge
+  @supports (-ms-ime-align:auto) {
+    box-shadow: 0 -1px 2px rgba(mui-color('black'), 0.12),
+                -1px 0px 2px rgba(mui-color('black'), 0.12),
+                0 0px 4px rgba(mui-color('black'), 0.12),
+                1px 3px 4px rgba(mui-color('black'), 0.20);
+  }
 }
 
 // ============================================================================
@@ -49,8 +65,7 @@
   display: inline-block;
   height: $mui-btn-height;
   padding: 0 $mui-btn-padding-horizontal;
-  margin-top: $mui-btn-margin-vertical;
-  margin-bottom: $mui-btn-margin-vertical;
+  margin: $mui-btn-margin-vertical 0;
   
   // Look and feel
   border: none;
@@ -66,6 +81,7 @@
   white-space: nowrap;
   user-select: none;
   font-size: $mui-btn-font-size;
+  font-family: inherit;
   letter-spacing: 0.03em;
 
   // For ripples

data/vendor/assets/stylesheets/mui/_checkbox-and-radio.scss

@@ -16,6 +16,14 @@
     font-weight: normal;
     cursor: pointer;
   }
+
+  input:disabled {
+    cursor: $mui-cursor-disabled;
+  }
+  
+  input:focus {
+    @include mui-tab-focus();
+  }
 }
 
 .mui-radio > label > input[type="radio"],

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

@@ -52,6 +52,7 @@
     font-weight: normal;
     line-height: $mui-base-line-height;
     color: $mui-dropdown-link-font-color;
+    text-decoration: none;
     white-space: nowrap; 
                          
     // hover & focus state

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

@@ -2,15 +2,35 @@
  * MUI Form Component
  */
 
+.mui-form {
+  legend {
+    display: block;
+    width: 100%;
+    padding: 0;
+    margin-bottom: $mui-base-line-height-computed / 2;
+    font-size: $mui-form-legend-font-size;
+    color: $mui-form-legend-font-color;
+    line-height: inherit;
+    border: 0;
+  }
+
+  fieldset {
+    border: 0;
+    padding: 0;
+    margin: 0 0 $mui-form-group-margin-bottom 0;
+  }
+}
+
 .mui-form--inline {
   @media (min-width: $mui-screen-sm-min) {
-    > .mui-textfield {
+    .mui-textfield {
       display: inline-block;
+      vertical-align: bottom;
       margin-bottom: 0;
     }
 
-    > .mui-radio,
-    > .mui-checkbox {
+    .mui-radio,
+    .mui-checkbox {
       display: inline-block;
       margin-top: 0;
       margin-bottom: 0;
@@ -21,17 +41,17 @@
       }
     }
 
-    > .mui-radio > label > input[type="radio"],
-    > .mui-checkbox > label > input[type="checkbox"] {
+    .mui-radio > label > input[type="radio"],
+    .mui-checkbox > label > input[type="checkbox"] {
       position: relative;
       margin-left: 0;
     }
 
-    > .mui-select {
+    .mui-select {
       display: inline-block;
     }
 
-    > .mui-btn {
+    .mui-btn {
       margin-bottom: 0;
       margin-top: 0;
       vertical-align: bottom;

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

@@ -0,0 +1,157 @@
+/**
+ * MUI Globals
+ */
+
+@if $mui-include-globals == true {
+  @include normalizecss();
+
+  // Body reset
+  html {
+    font-size: 10px;
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+  }
+
+  body {
+    font-family: $mui-base-font-family;
+    font-size: $mui-base-font-size;
+    font-weight: $mui-base-font-weight;
+    line-height: $mui-base-line-height;
+    color: $mui-base-font-color;
+    background-color: $mui-body-bg-color;
+  }
+
+  // Links
+  a {
+    color: $mui-link-font-color;
+    text-decoration: $mui-link-text-decoration;
+    
+    &:hover,
+    &:focus {
+      text-decoration: $mui-link-text-decoration-hover;
+    }
+    
+    &:focus {
+      @include mui-tab-focus();
+    }
+  }
+
+  // paragraphs
+  p {
+    margin: 0 0 ($mui-base-line-height-computed / 2);
+  }
+  
+  // lists
+  ul,
+  ol {
+    margin-top: 0;
+    margin-bottom: ($mui-base-line-height-computed / 2);
+  }
+
+  // Horizontal rules
+  hr {
+    margin-top: $mui-base-line-height-computed;
+    margin-bottom: $mui-base-line-height-computed;
+    border: 0;
+    height: 1px;
+    background-color: $mui-hr-color;
+  }
+
+  // Strong
+  strong {
+    font-weight: 700;
+  }
+  
+  // Abbreviations
+  abbr[title] {
+    cursor: help;
+    border-bottom: 1px dotted $mui-abbr-border-color;
+  }
+  
+  // headers
+  h1 {
+    @extend .mui--text-display1;
+  }
+  
+  h2 {
+    @extend .mui--text-headline;
+  }
+  
+  h3 {
+    @extend .mui--text-title;
+  }
+  
+  h4 {
+    @extend .mui--text-subhead;
+  }
+  
+  h5 {
+    @extend .mui--text-body2;
+  }
+  
+  h1, h2, h3 {
+    margin-top: $mui-base-line-height-computed;
+    margin-bottom: ($mui-base-line-height-computed / 2);
+  }
+  
+  h4, h5, h6 {
+    margin-top: ($mui-base-line-height-computed / 2);
+    margin-bottom: ($mui-base-line-height-computed / 2);
+  }
+} @else {
+  // Cherry pick from normalize.css
+  
+  // remove margin in Firefox and Safari
+  .mui-textfield > input,
+  .mui-textfield > textarea,
+  .mui-select > select {
+    margin: 0;
+  }
+  
+  // show the overflow in Edge
+  .mui-textfield > input {
+    overflow: visible;
+  }
+  
+  // remove inner border and padding in Firefox
+  button.mui-btn::-moz-focus-inner,
+  .mui-btn[type="button"]::-moz-focus-inner,
+  .mui-btn[type="reset"]::-moz-focus-inner,
+  .mui-btn[type="submit"]::-moz-focus-inner {
+    border-style: none;
+    padding: 0;    
+  }
+  
+  // restore focus styles unset by previous role
+  button.mui-btn:-moz-focusring,
+  .mui-btn[type="button"]:-moz-focusring,
+  .mui-btn[type="reset"]:-moz-focusring,
+  .mui-btn[type="submit"]:-moz-focusring {
+    outline: 1px dotted ButtonText;
+  }
+  
+  // remove default vertical scrollbar in IE
+  .mui-textfield > textarea {
+    overflow: auto;
+  }
+  
+  // add correct box sizing and padding in IE10-
+  .mui-radio,
+  .mui-checkbox {
+    input {
+      box-sizing: border-box;
+      padding: 0;
+    }
+  }
+}
+
+@if $mui-base-font-smoothing == true {
+  html,
+  body,
+  button,  // safari issue
+  input,  // safari issue
+  textarea {  // safari issue
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004);
+  }
+}

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

@@ -19,4 +19,12 @@
                 0 2px 2px 0 rgba(mui-color('black'), 0.16),
                 0 0px 2px 0 rgba(mui-color('black'), 0.12);
   }
+
+  // Edge
+  @supports (-ms-ime-align:auto) {
+    box-shadow: 0 -1px 2px 0 rgba(mui-color('black'), 0.12),
+                -1px 0px 2px 0 rgba(mui-color('black'), 0.12),
+                0 2px 2px 0 rgba(mui-color('black'), 0.16),
+                0 0px 2px 0 rgba(mui-color('black'), 0.12);
+  }
 }