material_design_lite-sass 1.0.6.3 → 1.1.0

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

@@ -53,7 +53,11 @@
    * @private
    */
   MaterialTooltip.prototype.CssClasses_ = {
-    IS_ACTIVE: 'is-active'
+    IS_ACTIVE: 'is-active',
+    BOTTOM: 'mdl-tooltip--bottom',
+    LEFT: 'mdl-tooltip--left',
+    RIGHT: 'mdl-tooltip--right',
+    TOP: 'mdl-tooltip--top'
   };
 
   /**
@@ -63,36 +67,51 @@
    * @private
    */
   MaterialTooltip.prototype.handleMouseEnter_ = function(event) {
-    event.stopPropagation();
     var props = event.target.getBoundingClientRect();
     var left = props.left + (props.width / 2);
+    var top = props.top + (props.height / 2);
     var marginLeft = -1 * (this.element_.offsetWidth / 2);
+    var marginTop = -1 * (this.element_.offsetHeight / 2);
+
+    if (this.element_.classList.contains(this.CssClasses_.LEFT) || this.element_.classList.contains(this.CssClasses_.RIGHT)) {
+      left = (props.width / 2);
+      if (top + marginTop < 0) {
+        this.element_.style.top = 0;
+        this.element_.style.marginTop = 0;
+      } else {
+        this.element_.style.top = top + 'px';
+        this.element_.style.marginTop = marginTop + 'px';
+      }
+    } else {
+      if (left + marginLeft < 0) {
+        this.element_.style.left = 0;
+        this.element_.style.marginLeft = 0;
+      } else {
+        this.element_.style.left = left + 'px';
+        this.element_.style.marginLeft = marginLeft + 'px';
+      }
+    }
 
-    if (left + marginLeft < 0) {
-      this.element_.style.left = 0;
-      this.element_.style.marginLeft = 0;
+    if (this.element_.classList.contains(this.CssClasses_.TOP)) {
+      this.element_.style.top = props.top - this.element_.offsetHeight - 10 + 'px';
+    } else if (this.element_.classList.contains(this.CssClasses_.RIGHT)) {
+      this.element_.style.left = props.left + props.width + 10 + 'px';
+    } else if (this.element_.classList.contains(this.CssClasses_.LEFT)) {
+      this.element_.style.left = props.left - this.element_.offsetWidth - 10 + 'px';
     } else {
-      this.element_.style.left = left + 'px';
-      this.element_.style.marginLeft = marginLeft + 'px';
+      this.element_.style.top = props.top + props.height + 10 + 'px';
     }
 
-    this.element_.style.top = props.top + props.height + 10 + 'px';
     this.element_.classList.add(this.CssClasses_.IS_ACTIVE);
-    window.addEventListener('scroll', this.boundMouseLeaveHandler, false);
-    window.addEventListener('touchmove', this.boundMouseLeaveHandler, false);
   };
 
   /**
    * Handle mouseleave for tooltip.
    *
-   * @param {Event} event The event that fired.
    * @private
    */
-  MaterialTooltip.prototype.handleMouseLeave_ = function(event) {
-    event.stopPropagation();
+  MaterialTooltip.prototype.handleMouseLeave_ = function() {
     this.element_.classList.remove(this.CssClasses_.IS_ACTIVE);
-    window.removeEventListener('scroll', this.boundMouseLeaveHandler);
-    window.removeEventListener('touchmove', this.boundMouseLeaveHandler, false);
   };
 
   /**
@@ -108,50 +127,21 @@
       }
 
       if (this.forElement_) {
-        // Tabindex needs to be set for `blur` events to be emitted
+        // It's left here because it prevents accidental text selection on Android
         if (!this.forElement_.hasAttribute('tabindex')) {
           this.forElement_.setAttribute('tabindex', '0');
         }
 
         this.boundMouseEnterHandler = this.handleMouseEnter_.bind(this);
         this.boundMouseLeaveHandler = this.handleMouseLeave_.bind(this);
-        this.forElement_.addEventListener('mouseenter', this.boundMouseEnterHandler,
-            false);
-        this.forElement_.addEventListener('click', this.boundMouseEnterHandler,
-            false);
-        this.forElement_.addEventListener('blur', this.boundMouseLeaveHandler);
-        this.forElement_.addEventListener('touchstart', this.boundMouseEnterHandler,
-            false);
-        this.forElement_.addEventListener('mouseleave', this.boundMouseLeaveHandler);
+        this.forElement_.addEventListener('mouseenter', this.boundMouseEnterHandler, false);
+        this.forElement_.addEventListener('touchend', this.boundMouseEnterHandler, false);
+        this.forElement_.addEventListener('mouseleave', this.boundMouseLeaveHandler, false);
+        window.addEventListener('touchstart', this.boundMouseLeaveHandler);
       }
     }
   };
 
-  /**
-   * Downgrade the component
-   *
-   * @private
-   */
-  MaterialTooltip.prototype.mdlDowngrade_ = function() {
-    if (this.forElement_) {
-      this.forElement_.removeEventListener('mouseenter', this.boundMouseEnterHandler, false);
-      this.forElement_.removeEventListener('click', this.boundMouseEnterHandler, false);
-      this.forElement_.removeEventListener('touchstart', this.boundMouseEnterHandler, false);
-      this.forElement_.removeEventListener('mouseleave', this.boundMouseLeaveHandler);
-    }
-  };
-
-  /**
-   * Public alias for the downgrade method.
-   *
-   * @public
-   */
-  MaterialTooltip.prototype.mdlDowngrade =
-      MaterialTooltip.prototype.mdlDowngrade_;
-
-  MaterialTooltip.prototype['mdlDowngrade'] =
-      MaterialTooltip.prototype.mdlDowngrade;
-
   // The component registers itself. It can assume componentHandler is available
   // in the global scope.
   componentHandler.register({

data/vendor/assets/stylesheets/_material.scss

@@ -33,14 +33,17 @@
 @import "material/card";
 @import "material/checkbox";
 @import "material/data-table";
+@import "material/dialog";
 @import "material/mega_footer";
 @import "material/mini_footer";
 @import "material/icon-toggle";
+@import "material/list";
 @import "material/menu";
 @import "material/progress";
 @import "material/layout";
 @import "material/radio";
 @import "material/slider";
+@import "material/snackbar";
 @import "material/spinner";
 @import "material/switch";
 @import "material/tabs";

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

@@ -63,4 +63,10 @@
       box-shadow: 0 0 1px gray;
     }
   }
+  &.mdl-badge--overlap {
+    margin-right: ($badge-size - $badge-overlap);
+    &:after {
+      right: -($badge-size - $badge-overlap);
+    }
+  }
 }

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

@@ -25,12 +25,13 @@
   color: $button-secondary-color;
   position: relative;
   height: $button-height;
+  margin: 0;
   min-width: $button-min-width;
   padding: 0 $button-padding;
   display: inline-block;
   @include typo-button();
   overflow: hidden;
-  will-change: box-shadow, transform;
+  will-change: box-shadow;
   transition: box-shadow 0.2s $animation-curve-fast-out-linear-in,
               background-color 0.2s $animation-curve-default,
               color 0.2s $animation-curve-default;
@@ -277,7 +278,6 @@ input.mdl-button[type="submit"] {
     &.mdl-button--disabled.mdl-button--disabled {
       background-color: $button-primary-color-disabled;
       color: $button-secondary-color-disabled;
-      @include shadow-2dp();
     }
   }
 
@@ -287,7 +287,7 @@ input.mdl-button[type="submit"] {
     &.mdl-button--disabled.mdl-button--disabled {
       background-color: $button-primary-color-disabled;
       color: $button-secondary-color-disabled;
-      @include shadow-2dp();
+      box-shadow: none;
     }
   }
   &--colored {

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

@@ -80,6 +80,7 @@
     border: 2px solid $checkbox-color;
   }
 
+  fieldset[disabled] .mdl-checkbox &,
   .mdl-checkbox.is-disabled & {
     border: 2px solid $checkbox-disabled-color;
     cursor: auto;
@@ -127,6 +128,7 @@
     background: $checkbox-color asset-url("tick.svg");
   }
 
+  fieldset[disabled] .mdl-checkbox.is-checked &,
   .mdl-checkbox.is-checked.is-disabled & {
     background: $checkbox-disabled-color asset-url("tick.svg");
   }
@@ -139,6 +141,7 @@
   line-height: $checkbox-label-height;
   margin: 0;
 
+  fieldset[disabled] .mdl-checkbox &,
   .mdl-checkbox.is-disabled & {
     color: $checkbox-disabled-color;
     cursor: auto;
@@ -165,10 +168,12 @@
     background: $checkbox-color;
   }
 
+  fieldset[disabled] .mdl-checkbox &,
   .mdl-checkbox.is-disabled & {
     cursor: auto;
   }
 
+  fieldset[disabled] .mdl-checkbox & .mdl-ripple,
   .mdl-checkbox.is-disabled & .mdl-ripple {
     background: transparent;
   }

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

@@ -51,7 +51,7 @@
   }
 
   td, th {
-    padding: 0 $data-table-column-padding 0 $data-table-column-padding;
+    padding: 0 $data-table-column-padding 12px $data-table-column-padding;
     text-align: right;
 
     &:first-of-type {
@@ -65,7 +65,7 @@
 
   td {
     position: relative;
-    vertical-align: top;
+    vertical-align: middle;
     height: $data-table-row-height;
     border-top: $data-table-dividers;
     border-bottom: $data-table-dividers;
@@ -73,9 +73,7 @@
     box-sizing: border-box;
 
     .mdl-data-table__select {
-      vertical-align: top;
-      position: absolute;
-      left: 24px;
+      vertical-align: middle;
     }
   }
 
@@ -90,10 +88,20 @@
     padding-bottom: 8px;
     box-sizing: border-box;
 
-    .mdl-data-table__select {
-      position: absolute;
-      bottom: 8px;
-      left: 24px;
+    .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;
+      }
+    }
+    
+    .mdl-data-table__header--sorted-ascending:before {
+      content: "\e5d8";
+    }
+    
+    .mdl-data-table__header--sorted-descending:before {
+      content: "\e5db";
     }
   }
 }

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

@@ -0,0 +1,57 @@
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@import "variables";
+@import "mixins";
+
+.mdl-dialog {
+    border: none;
+    @include shadow-24dp;
+    @include dialog-width;
+
+    &__title {
+        padding: 24px 24px 0;
+        margin: 0;
+        font-size: 2.5rem;
+    }
+    &__actions {
+        padding: 8px 8px 8px 24px;
+        display: flex;
+        flex-direction: row-reverse;
+        flex-wrap: wrap;
+        > * {
+            margin-right: 8px;
+            height: 36px;
+            &:first-child {
+                margin-right: 0;
+            }
+        }
+        &--full-width {
+          padding: 0 0 8px 0;
+          > * {
+            height: 48px;
+            flex: 0 0 100%;
+            padding-right: 16px;
+            margin-right: 0;
+            text-align: right;
+          }
+        }
+    }
+    &__content {
+        padding: 20px 24px 24px 24px;
+        color: $dialog-content-color;
+    }
+}

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

@@ -58,6 +58,13 @@
   margin: 0;
 }
 
+// Define order override classes.
+@for $i from 1 through $grid-max-columns {
+  .mdl-cell--order-#{$i} {
+    order: $i;
+  }
+}
+
 
 // Mixins for width calculation.
 @mixin partial-size($size, $columns, $gutter) {
@@ -72,6 +79,14 @@
   @include partial-size(1, 1, $gutter);
 }
 
+@mixin offset-size($size, $columns, $gutter) {
+  margin-left: calc(#{(($size / $columns) * 100)+"%"} + #{$gutter / 2});
+
+  .mdl-grid.mdl-grid--no-spacing > & {
+    margin-left: #{(($size / $columns) * 100)+"%"};
+  }
+}
+
 
 
 ////////// Phone //////////
@@ -91,6 +106,13 @@
     display: none !important;
   }
 
+  // Define order override classes.
+  @for $i from 1 through $grid-max-columns {
+    .mdl-cell--order-#{$i}-phone.mdl-cell--order-#{$i}-phone {
+      order: $i;
+    }
+  }
+
   // Define partial sizes for columnNumber < totalColumns.
   @for $i from 1 through ($grid-phone-columns - 1) {
     .mdl-cell--#{$i}-col,
@@ -106,6 +128,14 @@
       @include full-size($grid-phone-gutter);
     }
   }
+
+  // Define valid phone offsets.
+  @for $i from 1 through ($grid-phone-columns - 1) {
+    .mdl-cell--#{$i}-offset,
+    .mdl-cell--#{$i}-offset-phone.mdl-cell--#{$i}-offset-phone {
+      @include offset-size($i, $grid-phone-columns, $grid-phone-gutter);
+    }
+  }
 }
 
 
@@ -126,6 +156,13 @@
     display: none !important;
   }
 
+  // Define order override classes.
+  @for $i from 1 through $grid-max-columns {
+    .mdl-cell--order-#{$i}-tablet.mdl-cell--order-#{$i}-tablet {
+      order: $i;
+    }
+  }
+
   // Define partial sizes for columnNumber < totalColumns.
   @for $i from 1 through ($grid-tablet-columns - 1) {
     .mdl-cell--#{$i}-col,
@@ -141,6 +178,14 @@
       @include full-size($grid-tablet-gutter);
     }
   }
+
+  // Define valid tablet offsets.
+  @for $i from 1 through ($grid-tablet-columns - 1) {
+    .mdl-cell--#{$i}-offset,
+    .mdl-cell--#{$i}-offset-tablet.mdl-cell--#{$i}-offset-tablet {
+      @include offset-size($i, $grid-tablet-columns, $grid-tablet-gutter);
+    }
+  }
 }
 
 
@@ -161,6 +206,13 @@
     display: none !important;
   }
 
+  // Define order override classes.
+  @for $i from 1 through $grid-max-columns {
+    .mdl-cell--order-#{$i}-desktop.mdl-cell--order-#{$i}-desktop {
+      order: $i;
+    }
+  }
+
   // Define partial sizes for all numbers of columns.
   @for $i from 1 through $grid-desktop-columns {
     .mdl-cell--#{$i}-col,
@@ -168,4 +220,12 @@
       @include partial-size($i, $grid-desktop-columns, $grid-desktop-gutter);
     }
   }
+
+  // Define valid desktop offsets.
+  @for $i from 1 through ($grid-desktop-columns - 1) {
+    .mdl-cell--#{$i}-offset,
+    .mdl-cell--#{$i}-offset-desktop.mdl-cell--#{$i}-offset-desktop {
+      @include offset-size($i, $grid-desktop-columns, $grid-desktop-gutter);
+    }
+  }
 }