material_design_lite-sass 1.1.1 → 1.1.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 1526d803fc2195a1e95ceca0960641716ee1aad5
-  data.tar.gz: fd7a77fe0d962aeebc396708bfd4e443f6014ad5
+  metadata.gz: 4cbccd8bb0315b89d19cda7f3ae15954acbc09b3
+  data.tar.gz: f520969a2be4971d18ad2149a253131733f0f4b3
 SHA512:
-  metadata.gz: 5d4e2350472aeaced9398f37ae36d8e02c559bbda70d6cf8541e2d678d7bc88e7e8f4464698e8d9baeb2827dca21bf40f472b6b6366a64d69a1723af771a979a
-  data.tar.gz: 53a152686b37cdfcca1391dc18571be75d12076135d24ca7cee6709793eef650b22614547ed67736657c6d5767511940ccf2fe8b8d9b89a950d3a36a578e68dc
+  metadata.gz: bde90ce203444754ace504ba94a6e916b88fc0afbe5d9317c63a7099cb675037b6b370d1b016650077e8e5b5a03902a14926c919905d7e547baabd8ce98f1576
+  data.tar.gz: 7bc2f86ce72d2eb95cc9e476737a9c8968abae6962834761f68716c351312125ea03750ad1384b78decd18845634172d0a4a81ef19d5b4ee0efde3ecbad627f1

data/CHANGELOG.md

@@ -1,3 +1,12 @@
+## 1.1.2 (2016-03-05)
+
+- Update assets to match upstream version
+
+Library version: 
+
+- Material Design Lite v1.1.2
+- Material Icons v2.2.0
+
 ## 1.1.1 (2016-02-03)
 
 - Update assets to match upstream version

data/lib/material_design_lite/sass/version.rb

@@ -1,5 +1,5 @@
 module MaterialDesignLite
   module Sass
-    VERSION = '1.1.1'
+    VERSION = '1.1.2'
   end
 end

data/vendor/assets/javascripts/material.js

@@ -345,17 +345,19 @@ componentHandler = (function() {
    * @param {?componentHandler.Component} component
    */
   function deconstructComponentInternal(component) {
-    var componentIndex = createdComponents_.indexOf(component);
-    createdComponents_.splice(componentIndex, 1);
+    if (component) {
+      var componentIndex = createdComponents_.indexOf(component);
+      createdComponents_.splice(componentIndex, 1);
 
-    var upgrades = component.element_.getAttribute('data-upgraded').split(',');
-    var componentPlace = upgrades.indexOf(component[componentConfigProperty_].classAsString);
-    upgrades.splice(componentPlace, 1);
-    component.element_.setAttribute('data-upgraded', upgrades.join(','));
+      var upgrades = component.element_.getAttribute('data-upgraded').split(',');
+      var componentPlace = upgrades.indexOf(component[componentConfigProperty_].classAsString);
+      upgrades.splice(componentPlace, 1);
+      component.element_.setAttribute('data-upgraded', upgrades.join(','));
 
-    var ev = document.createEvent('Events');
-    ev.initEvent('mdl-componentdowngraded', true, true);
-    component.element_.dispatchEvent(ev);
+      var ev = document.createEvent('Events');
+      ev.initEvent('mdl-componentdowngraded', true, true);
+      component.element_.dispatchEvent(ev);
+    }
   }
 
   /**
@@ -2774,7 +2776,8 @@ MaterialTextfield.prototype.CssClasses_ = {
     IS_FOCUSED: 'is-focused',
     IS_DISABLED: 'is-disabled',
     IS_INVALID: 'is-invalid',
-    IS_UPGRADED: 'is-upgraded'
+    IS_UPGRADED: 'is-upgraded',
+    HAS_PLACEHOLDER: 'has-placeholder'
 };
 /**
    * Handle input being entered.
@@ -2928,6 +2931,9 @@ MaterialTextfield.prototype.init = function () {
                     this.maxRows = this.Constant_.NO_MAX_ROWS;
                 }
             }
+            if (this.input_.hasAttribute('placeholder')) {
+                this.element_.classList.add(this.CssClasses_.HAS_PLACEHOLDER);
+            }
             this.boundUpdateClassesHandler = this.updateClasses_.bind(this);
             this.boundFocusHandler = this.onFocus_.bind(this);
             this.boundBlurHandler = this.onBlur_.bind(this);
@@ -3133,6 +3139,7 @@ window['MaterialLayout'] = MaterialLayout;
 MaterialLayout.prototype.Constant_ = {
     MAX_WIDTH: '(max-width: 1024px)',
     TAB_SCROLL_PIXELS: 100,
+    RESIZE_TIMEOUT: 100,
     MENU_ICON: '',
     CHEVRON_LEFT: 'chevron_left',
     CHEVRON_RIGHT: 'chevron_right'
@@ -3235,7 +3242,8 @@ MaterialLayout.prototype.contentScrollHandler_ = function () {
    * @private
    */
 MaterialLayout.prototype.keyboardEventHandler_ = function (evt) {
-    if (evt.keyCode === this.Keycodes_.ESCAPE) {
+    // Only react when the drawer is open.
+    if (evt.keyCode === this.Keycodes_.ESCAPE && this.drawer_.classList.contains(this.CssClasses_.IS_DRAWER_OPEN)) {
         this.toggleDrawer();
     }
 };
@@ -3339,9 +3347,13 @@ MaterialLayout.prototype.init = function () {
     if (this.element_) {
         var container = document.createElement('div');
         container.classList.add(this.CssClasses_.CONTAINER);
+        var focusedElement = this.element_.querySelector(':focus');
         this.element_.parentElement.insertBefore(container, this.element_);
         this.element_.parentElement.removeChild(this.element_);
         container.appendChild(this.element_);
+        if (focusedElement) {
+            focusedElement.focus();
+        }
         var directChildren = this.element_.childNodes;
         var numChildren = directChildren.length;
         for (var c = 0; c < numChildren; c++) {
@@ -3476,8 +3488,9 @@ MaterialLayout.prototype.init = function () {
             tabContainer.appendChild(leftButton);
             tabContainer.appendChild(this.tabBar_);
             tabContainer.appendChild(rightButton);
-            // Add and remove buttons depending on scroll position.
-            var tabScrollHandler = function () {
+            // Add and remove tab buttons depending on scroll position and total
+            // window size.
+            var tabUpdateHandler = function () {
                 if (this.tabBar_.scrollLeft > 0) {
                     leftButton.classList.add(this.CssClasses_.IS_ACTIVE);
                 } else {
@@ -3489,8 +3502,20 @@ MaterialLayout.prototype.init = function () {
                     rightButton.classList.remove(this.CssClasses_.IS_ACTIVE);
                 }
             }.bind(this);
-            this.tabBar_.addEventListener('scroll', tabScrollHandler);
-            tabScrollHandler();
+            this.tabBar_.addEventListener('scroll', tabUpdateHandler);
+            tabUpdateHandler();
+            // Update tabs when the window resizes.
+            var windowResizeHandler = function () {
+                // Use timeouts to make sure it doesn't happen too often.
+                if (this.resizeTimeoutId_) {
+                    clearTimeout(this.resizeTimeoutId_);
+                }
+                this.resizeTimeoutId_ = setTimeout(function () {
+                    tabUpdateHandler();
+                    this.resizeTimeoutId_ = null;
+                }.bind(this), this.Constant_.RESIZE_TIMEOUT);
+            }.bind(this);
+            window.addEventListener('resize', windowResizeHandler);
             if (this.tabBar_.classList.contains(this.CssClasses_.JS_RIPPLE_EFFECT)) {
                 this.tabBar_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);
             }

data/vendor/assets/javascripts/material/layout.js

@@ -43,6 +43,7 @@
   MaterialLayout.prototype.Constant_ = {
     MAX_WIDTH: '(max-width: 1024px)',
     TAB_SCROLL_PIXELS: 100,
+    RESIZE_TIMEOUT: 100,
 
     MENU_ICON: '',
     CHEVRON_LEFT: 'chevron_left',
@@ -165,7 +166,9 @@
    * @private
    */
   MaterialLayout.prototype.keyboardEventHandler_ = function(evt) {
-    if (evt.keyCode === this.Keycodes_.ESCAPE) {
+    // Only react when the drawer is open.
+    if (evt.keyCode === this.Keycodes_.ESCAPE &&
+        this.drawer_.classList.contains(this.CssClasses_.IS_DRAWER_OPEN)) {
       this.toggleDrawer();
     }
   };
@@ -280,10 +283,17 @@
     if (this.element_) {
       var container = document.createElement('div');
       container.classList.add(this.CssClasses_.CONTAINER);
+
+      var focusedElement = this.element_.querySelector(':focus');
+
       this.element_.parentElement.insertBefore(container, this.element_);
       this.element_.parentElement.removeChild(this.element_);
       container.appendChild(this.element_);
 
+      if (focusedElement) {
+        focusedElement.focus();
+      }
+
       var directChildren = this.element_.childNodes;
       var numChildren = directChildren.length;
       for (var c = 0; c < numChildren; c++) {
@@ -453,8 +463,9 @@
         tabContainer.appendChild(this.tabBar_);
         tabContainer.appendChild(rightButton);
 
-        // Add and remove buttons depending on scroll position.
-        var tabScrollHandler = function() {
+        // Add and remove tab buttons depending on scroll position and total
+        // window size.
+        var tabUpdateHandler = function() {
           if (this.tabBar_.scrollLeft > 0) {
             leftButton.classList.add(this.CssClasses_.IS_ACTIVE);
           } else {
@@ -469,8 +480,22 @@
           }
         }.bind(this);
 
-        this.tabBar_.addEventListener('scroll', tabScrollHandler);
-        tabScrollHandler();
+        this.tabBar_.addEventListener('scroll', tabUpdateHandler);
+        tabUpdateHandler();
+
+        // Update tabs when the window resizes.
+        var windowResizeHandler = function() {
+          // Use timeouts to make sure it doesn't happen too often.
+          if (this.resizeTimeoutId_) {
+            clearTimeout(this.resizeTimeoutId_);
+          }
+          this.resizeTimeoutId_ = setTimeout(function() {
+            tabUpdateHandler();
+            this.resizeTimeoutId_ = null;
+          }.bind(this), /** @type {number} */ (this.Constant_.RESIZE_TIMEOUT));
+        }.bind(this);
+
+        window.addEventListener('resize', windowResizeHandler);
 
         if (this.tabBar_.classList.contains(this.CssClasses_.JS_RIPPLE_EFFECT)) {
           this.tabBar_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);

data/vendor/assets/javascripts/material/mdlComponentHandler.js

@@ -342,17 +342,19 @@ componentHandler = (function() {
    * @param {?componentHandler.Component} component
    */
   function deconstructComponentInternal(component) {
-    var componentIndex = createdComponents_.indexOf(component);
-    createdComponents_.splice(componentIndex, 1);
+    if (component) {
+      var componentIndex = createdComponents_.indexOf(component);
+      createdComponents_.splice(componentIndex, 1);
 
-    var upgrades = component.element_.getAttribute('data-upgraded').split(',');
-    var componentPlace = upgrades.indexOf(component[componentConfigProperty_].classAsString);
-    upgrades.splice(componentPlace, 1);
-    component.element_.setAttribute('data-upgraded', upgrades.join(','));
+      var upgrades = component.element_.getAttribute('data-upgraded').split(',');
+      var componentPlace = upgrades.indexOf(component[componentConfigProperty_].classAsString);
+      upgrades.splice(componentPlace, 1);
+      component.element_.setAttribute('data-upgraded', upgrades.join(','));
 
-    var ev = document.createEvent('Events');
-    ev.initEvent('mdl-componentdowngraded', true, true);
-    component.element_.dispatchEvent(ev);
+      var ev = document.createEvent('Events');
+      ev.initEvent('mdl-componentdowngraded', true, true);
+      component.element_.dispatchEvent(ev);
+    }
   }
 
   /**

data/vendor/assets/javascripts/material/textfield.js

@@ -60,7 +60,8 @@
     IS_FOCUSED: 'is-focused',
     IS_DISABLED: 'is-disabled',
     IS_INVALID: 'is-invalid',
-    IS_UPGRADED: 'is-upgraded'
+    IS_UPGRADED: 'is-upgraded',
+    HAS_PLACEHOLDER: 'has-placeholder'
   };
 
   /**
@@ -238,6 +239,10 @@
           }
         }
 
+        if (this.input_.hasAttribute('placeholder')) {
+          this.element_.classList.add(this.CssClasses_.HAS_PLACEHOLDER);
+        }
+
         this.boundUpdateClassesHandler = this.updateClasses_.bind(this);
         this.boundFocusHandler = this.onFocus_.bind(this);
         this.boundBlurHandler = this.onBlur_.bind(this);

data/vendor/assets/stylesheets/material/_data-table.scss

@@ -88,19 +88,24 @@
     padding-bottom: 8px;
     box-sizing: border-box;
 
-    .mdl-data-table__header--sorted-ascending, .mdl-data-table__header--sorted-descending {
+    &.mdl-data-table__header--sorted-ascending,
+    &.mdl-data-table__header--sorted-descending {
       color: $data-table-header-sorted-color;
       &:before {
-        font-size: $data-table-header-sort-icon-size;
         @include typo-icon;
+        font-size: $data-table-header-sort-icon-size;
+        content: "\e5d8";
+        margin-right: 5px;
+        vertical-align: sub;
+      }
+      &:hover {
+        cursor: pointer;
+        &:before {
+          color: $data-table-header-sorted-icon-hover-color;
+        }
       }
     }
-    
-    .mdl-data-table__header--sorted-ascending:before {
-      content: "\e5d8";
-    }
-    
-    .mdl-data-table__header--sorted-descending:before {
+    &.mdl-data-table__header--sorted-descending:before {
       content: "\e5db";
     }
   }

data/vendor/assets/stylesheets/material/_snackbar.scss

@@ -21,14 +21,15 @@
   position: fixed;
   bottom: 0;
   left: 50%;
-  margin-right: -50%;
   cursor: default;
   background-color: $snackbar-background-color;
-  z-index: 10000;
+  z-index: 3;
+  display: block;
   display: flex;
+  justify-content: space-between;
   font-family: $preferred_font;
   will-change: transform;
-  transform: translate(0, 80px);
+  transform: translate(-50%, 80px);
   transition: transform 0.25s $animation-curve-fast-out-linear-in;
   pointer-events: none;
   @media(max-width: $snackbar-tablet-breakpoint - 1) {
@@ -43,23 +44,25 @@
     border-radius: 2px;
   }
   &--active {
-    transform: translate(0, 0);
+    transform: translate(-50%, 0);
     pointer-events: auto;
     transition: transform 0.25s $animation-curve-linear-out-slow-in;
   }
 
   &__text {
-    padding: 14px 24px;
+    padding: 14px 12px 14px 24px;
     vertical-align: middle;
     color: white;
+    float: left;
   }
 
   &__action {
     background: transparent;
     border: none;
     color: $snackbar-action-color;
+    float: right;
     text-transform: uppercase;
-    padding: 14px 24px;
+    padding: 14px 24px 14px 12px;
     @include typo-button();
     overflow: hidden;
     outline: none;
@@ -68,7 +71,7 @@
     cursor: pointer;
     text-decoration: none;
     text-align: center;
-    vertical-align: middle;
+    align-self: center;
 
     &::-moz-focus-inner {
       border: 0;

data/vendor/assets/stylesheets/material/_textfield.scss

@@ -113,7 +113,8 @@
   white-space: nowrap;
   text-align: left;
 
-  .mdl-textfield.is-dirty & {
+  .mdl-textfield.is-dirty &,
+  .mdl-textfield.has-placeholder & {
     visibility: hidden;
   }
 
@@ -122,13 +123,18 @@
     @include material-animation-default();
   }
 
+  .mdl-textfield--floating-label.has-placeholder & {
+    transition: none;
+  }
+
   fieldset[disabled] .mdl-textfield &,
   .mdl-textfield.is-disabled.is-disabled & {
     color: $input-text-disabled-text-color;
   }
 
   .mdl-textfield--floating-label.is-focused &,
-  .mdl-textfield--floating-label.is-dirty & {
+  .mdl-textfield--floating-label.is-dirty &,
+  .mdl-textfield--floating-label.has-placeholder & {
     color: $input-text-highlight-color;
     font-size : $input-text-floating-label-fontsize;
     top: $input-text-vertical-spacing - ($input-text-floating-label-fontsize + $input-text-padding);
@@ -136,7 +142,8 @@
   }
 
   .mdl-textfield--floating-label.is-focused .mdl-textfield__expandable-holder &,
-  .mdl-textfield--floating-label.is-dirty .mdl-textfield__expandable-holder &{
+  .mdl-textfield--floating-label.is-dirty .mdl-textfield__expandable-holder &,
+  .mdl-textfield--floating-label.has-placeholder .mdl-textfield__expandable-holder & {
     top: -($input-text-floating-label-fontsize + $input-text-padding);
   }
 

data/vendor/assets/stylesheets/material/_variables.scss

@@ -548,6 +548,7 @@ $data-table-header-sort-icon-size: 16px !default;
 
 $data-table-header-color: rgba(#000, 0.54) !default;
 $data-table-header-sorted-color: rgba(#000, 0.87) !default;
+$data-table-header-sorted-icon-hover-color: rgba(#000, 0.26) !default;
 $data-table-divider-color: rgba(#000, 0.12) !default;
 
 $data-table-hover-color: #eeeeee !default;

data/vendor/assets/stylesheets/material/resets/_h5bp.scss

@@ -222,12 +222,10 @@ textarea {
     *,
     *:before,
     *:after,
-    *:first-letter,
-    *:first-line {
+    *:first-letter {
         background: transparent !important;
         color: #000 !important; /* Black prints faster: http://www.sanbeiji.com/archives/953 */
         box-shadow: none !important;
-        text-shadow: none !important;
     }
 
     a,

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: material_design_lite-sass
 version: !ruby/object:Gem::Version
-  version: 1.1.1
+  version: 1.1.2
 platform: ruby
 authors:
 - Dmitriy Tarasov
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2016-02-03 00:00:00.000000000 Z
+date: 2016-03-05 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sass