materialize-sass 1.0.0.beta → 1.0.0.rc1

data/assets/javascripts/materialize/sidenav.js

@@ -102,6 +102,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
         this._overlay.parentNode.removeChild(this._overlay);
         this.dragTarget.parentNode.removeChild(this.dragTarget);
         this.el.M_Sidenav = undefined;
+        this.el.style.transform = '';
 
         var index = Sidenav._sidenavs.indexOf(this);
         if (index >= 0) {
@@ -290,7 +291,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
       key: '_handleDragTargetRelease',
       value: function _handleDragTargetRelease() {
         if (this.isDragged) {
-          if (this.percentOpen > .5) {
+          if (this.percentOpen > 0.2) {
             this.open();
           } else {
             this._animateOut();
@@ -357,7 +358,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
       key: '_handleCloseRelease',
       value: function _handleCloseRelease() {
         if (this.isOpen && this.isDragged) {
-          if (this.percentOpen > .5) {
+          if (this.percentOpen > 0.8) {
             this._animateIn();
           } else {
             this.close();

data/assets/javascripts/materialize/slider.js

@@ -186,7 +186,8 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
       key: '_handleInterval',
       value: function _handleInterval() {
         var newActiveIndex = this.$slider.find('.active').index();
-        if (this.$slides.length === newActiveIndex + 1) newActiveIndex = 0; // loop to start
+        if (this.$slides.length === newActiveIndex + 1) newActiveIndex = 0;
+        // loop to start
         else newActiveIndex += 1;
 
         this.set(newActiveIndex);

data/assets/javascripts/materialize/tabs.js

@@ -150,7 +150,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
         }
 
         // Act as regular link if target attribute is specified.
-        if (!!tabLink.attr("target")) {
+        if (!!tabLink.attr('target')) {
           return;
         }
 
@@ -174,7 +174,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
         if (this.options.swipeable) {
           if (this._tabsCarousel) {
             this._tabsCarousel.set(this.index, function () {
-              if (typeof _this2.options.onShow === "function") {
+              if (typeof _this2.options.onShow === 'function') {
                 _this2.options.onShow.call(_this2, _this2.$content[0]);
               }
             });
@@ -290,7 +290,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
             _this4.$activeTabLink = _this4.$tabLinks.eq(_this4.index);
             _this4.$activeTabLink.addClass('active');
             _this4._animateIndicator(prevIndex);
-            if (typeof _this4.options.onShow === "function") {
+            if (typeof _this4.options.onShow === 'function') {
               _this4.options.onShow.call(_this4, _this4.$content[0]);
             }
           }

data/assets/javascripts/materialize/timepicker.js

@@ -31,7 +31,14 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
 
     autoClose: false, // auto close when minute is selected
     twelveHour: true, // change to 12 hour AM/PM clock from 24 hour
-    vibrate: true // vibrate the device when dragging clock hand
+    vibrate: true, // vibrate the device when dragging clock hand
+
+    // Callbacks
+    onOpenStart: null,
+    onOpenEnd: null,
+    onCloseStart: null,
+    onCloseEnd: null,
+    onSelect: null
   };
 
   /**
@@ -175,6 +182,10 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
           }, this.options.duration / 2);
         }
 
+        if (typeof this.options.onSelect === 'function') {
+          this.options.onSelect.call(this, this.hours, this.minutes);
+        }
+
         // Unbind mousemove event
         document.removeEventListener('mousemove', this._handleDocumentClickMoveBound);
         document.removeEventListener('touchmove', this._handleDocumentClickMoveBound);
@@ -200,7 +211,13 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
         var _this3 = this;
 
         this.modal = M.Modal.init(this.modalEl, {
+          onOpenStart: this.options.onOpenStart,
+          onOpenEnd: this.options.onOpenEnd,
+          onCloseStart: this.options.onCloseStart,
           onCloseEnd: function () {
+            if (typeof _this3.options.onCloseEnd === 'function') {
+              _this3.options.onCloseEnd.call(_this3);
+            }
             _this3.isOpen = false;
           }
         });
@@ -225,7 +242,6 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
     }, {
       key: '_pickerSetup',
       value: function _pickerSetup() {
-
         var $clearBtn = $('<button class="btn-flat timepicker-clear waves-effect" style="visibility: hidden;" type="button" tabindex="' + (this.options.twelveHour ? '3' : '1') + '">' + this.options.i18n.clear + '</button>').appendTo(this.footer).on('click', this.clear.bind(this));
         if (this.options.showClearBtn) {
           $clearBtn.css({ visibility: '' });
@@ -357,12 +373,12 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
         // Get the time
         var value = ((this.el.value || this.options.defaultTime || '') + '').split(':');
         if (this.options.twelveHour && !(typeof value[1] === 'undefined')) {
-          if (value[1].toUpperCase().indexOf("AM") > 0) {
+          if (value[1].toUpperCase().indexOf('AM') > 0) {
             this.amOrPm = 'AM';
           } else {
             this.amOrPm = 'PM';
           }
-          value[1] = value[1].replace("AM", "").replace("PM", "");
+          value[1] = value[1].replace('AM', '').replace('PM', '');
         }
         if (value[0] === 'now') {
           var now = new Date(+new Date() + this.options.fromNow);
@@ -381,7 +397,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
     }, {
       key: 'showView',
       value: function showView(view, delay) {
-        if (view === 'minutes' && $(this.hoursView).css("visibility") === "visible") {
+        if (view === 'minutes' && $(this.hoursView).css('visibility') === 'visible') {
           // raiseCallback(this.options.beforeHourSelect);
         }
         var isHours = view === 'hours',
@@ -519,6 +535,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
         this.isOpen = true;
         this._updateTimeFromInput();
         this.showView('hours');
+
         this.modal.open();
       }
     }, {

data/assets/javascripts/materialize/toasts.js

@@ -46,6 +46,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
       var toastElement = this._createToast();
       toastElement.M_Toast = this;
       this.el = toastElement;
+      this.$el = $(toastElement);
       this._animateIn();
       this._setTimer();
     }
@@ -96,7 +97,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
           targets: this.el,
           top: 0,
           opacity: 1,
-          duration: 300,
+          duration: this.options.inDuration,
           easing: 'easeOutCubic'
         });
       }
@@ -156,7 +157,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
               _this2.options.completeCallback();
             }
             // Remove toast from DOM
-            _this2.el.parentNode.removeChild(_this2.el);
+            _this2.$el.remove();
             Toast._toasts.splice(Toast._toasts.indexOf(_this2), 1);
             if (Toast._toasts.length === 0) {
               Toast._removeContainer();
@@ -210,7 +211,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
         document.removeEventListener('mousemove', Toast._onDragMove);
         document.removeEventListener('mouseup', Toast._onDragEnd);
 
-        Toast._container.parentNode.removeChild(Toast._container);
+        $(Toast._container).remove();
         Toast._container = null;
       }
 

data/assets/javascripts/materialize/tooltip.js

@@ -108,7 +108,6 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
         if (this.isOpen) {
           return;
         }
-
         this.isOpen = true;
         // Update tooltip content with HTML attribute options
         this.options = $.extend({}, this.options, this._getAttributeOptions());
@@ -122,6 +121,8 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
           return;
         }
 
+        this.isHovered = false;
+        this.isFocused = false;
         this.isOpen = false;
         this._setExitDelayTimeout();
       }
@@ -275,19 +276,23 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
       key: '_handleMouseEnter',
       value: function _handleMouseEnter() {
         this.isHovered = true;
+        this.isFocused = false; // Allows close of tooltip when opened by focus.
         this.open();
       }
     }, {
       key: '_handleMouseLeave',
       value: function _handleMouseLeave() {
         this.isHovered = false;
+        this.isFocused = false; // Allows close of tooltip when opened by focus.
         this.close();
       }
     }, {
       key: '_handleFocus',
       value: function _handleFocus() {
-        this.isFocused = true;
-        this.open();
+        if (M.tabPressed) {
+          this.isFocused = true;
+          this.open();
+        }
       }
     }, {
       key: '_handleBlur',

data/assets/stylesheets/materialize/components/_buttons.scss

@@ -284,7 +284,8 @@ button.btn-floating {
   &:focus {
     background-color: rgba(0, 0, 0, .1);
   }
-  &.disabled {
+  &.disabled,
+  &.btn-flat[disabled]  {
     background-color: transparent !important;
     color: $button-flat-disabled-color !important;
     cursor: default;

data/assets/stylesheets/materialize/components/_collapsible.scss

@@ -7,6 +7,10 @@
 }
 
 .collapsible-header {
+  &:focus {
+    outline: 0
+  }
+
   display: flex;
   cursor: pointer;
   -webkit-tap-highlight-color: transparent;
@@ -23,6 +27,9 @@
     margin-right: 1rem;
   }
 }
+.keyboard-focused .collapsible-header:focus {
+  background-color: #eee;
+}
 
 .collapsible-body {
   display: none;

data/assets/stylesheets/materialize/components/_datepicker.scss

@@ -175,6 +175,10 @@
     flex-direction: row;
   }
 
+  .datepicker-date-display {
+    flex: 0 1 270px;
+  }
+
   .datepicker-controls,
   .datepicker-table,
   .datepicker-footer {

data/assets/stylesheets/materialize/components/_dropdown.scss

@@ -25,7 +25,6 @@
 
     &:focus {
       outline: none;
-      background-color: darken($dropdown-hover-bg-color, 8%);
     }
 
     &.divider {
@@ -67,6 +66,12 @@
   }
 }
 
+body.keyboard-focused {
+  .dropdown-content li:focus {
+    background-color: darken($dropdown-hover-bg-color, 8%);
+  }
+}
+
 // Input field specificity bugfix
 .input-field.col .dropdown-content [type="checkbox"] + label {
   top: 1px;
@@ -74,3 +79,7 @@
   height: 18px;
   transform: none;
 }
+
+.dropdown-trigger {
+  cursor: pointer;
+}

data/assets/stylesheets/materialize/components/_sidenav.scss

@@ -1,6 +1,6 @@
 .sidenav {
   position: fixed;
-  width: 300px;
+  width: $sidenav-width;
   left: 0;
   top: 0;
   margin: 0;

data/assets/stylesheets/materialize/components/_toast.scss

@@ -30,7 +30,6 @@
   height: auto;
   min-height: $toast-height;
   line-height: 1.5em;
-  word-break: break-all;
   background-color: $toast-color;
   padding: 10px 25px;
   font-size: 1.1rem;

data/assets/stylesheets/materialize/components/_variables.scss

@@ -253,6 +253,7 @@ $navbar-brand-font-size: 2.1rem !default;
 // 14. Side Navigation
 // ==========================================================================
 
+$sidenav-width: 300px !default;
 $sidenav-font-size: 14px !default;
 $sidenav-font-color: rgba(0,0,0,.87) !default;
 $sidenav-bg-color: #fff !default;

data/assets/stylesheets/materialize/components/forms/_input-fields.scss

@@ -193,6 +193,8 @@ textarea.materialize-textarea {
     }
   }
 
+  // Autofill + date + time inputs
+  & > input[type]:-webkit-autofill:not(.browser-default) + label,
   & > input[type=date]:not(.browser-default) + label,
   & > input[type=time]:not(.browser-default) + label {
     transform: translateY(-14px) scale(.8);

data/assets/stylesheets/materialize/components/forms/_range.scss

@@ -94,7 +94,7 @@ input[type=range]::-webkit-slider-thumb {
 
 }
 
-input[type=range].focused:focus:not(.active)::-webkit-slider-thumb {
+.keyboard-focused input[type=range]:focus:not(.active)::-webkit-slider-thumb {
   box-shadow: 0 0 0 10px rgba($radio-fill-color, .26);
 }
 
@@ -125,7 +125,7 @@ input[type=range]:-moz-focusring {
   outline-offset: -1px;
 }
 
-input[type=range].focused:focus:not(.active)::-moz-range-thumb {
+.keyboard-focused input[type=range]:focus:not(.active)::-moz-range-thumb {
   box-shadow: 0 0 0 10px rgba($radio-fill-color, .26);
 }
 
@@ -156,6 +156,6 @@ input[type=range]::-ms-thumb {
   @include range-thumb;
 }
 
-input[type=range].focused:focus:not(.active)::-ms-thumb {
+.keyboard-focused input[type=range]:focus:not(.active)::-ms-thumb {
   box-shadow: 0 0 0 10px rgba($radio-fill-color, .26);
 }

data/assets/stylesheets/materialize/components/forms/_select.scss

@@ -125,6 +125,12 @@ select:disabled {
   background-color: transparent;
 }
 
+body.keyboard-focused {
+  .select-dropdown.dropdown-content li:focus {
+    background-color: $select-option-focus;
+  }
+}
+
 .select-dropdown.dropdown-content {
   li {
     &:hover {
@@ -134,10 +140,6 @@ select:disabled {
     &.selected {
       background-color: $select-option-selected;
     }
-
-    &:focus {
-      background-color: $select-option-focus;
-    }
   }
 }
 

data/assets/stylesheets/materialize/extras/nouislider.css

@@ -1,5 +1,5 @@
 /*!
- * Materialize v1.0.0-alpha.4 (http://materializecss.com)
+ * Materialize v1.0.0-rc.1 (http://materializecss.com)
  * Copyright 2014-2015 Materialize
  * MIT License (https://raw.githubusercontent.com/Dogfalo/materialize/master/LICENSE)
  */

data/lib/materialize-sass/version.rb

@@ -1,6 +1,6 @@
 module Materialize
   module Sass
-    VERSION = "1.0.0.beta"
+    VERSION = "1.0.0.rc1"
   end
 end
 

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: materialize-sass
 version: !ruby/object:Gem::Version
-  version: 1.0.0.beta
+  version: 1.0.0.rc1
 platform: ruby
 authors:
 - mkhairi
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2018-03-24 00:00:00.000000000 Z
+date: 2018-05-07 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: bundler
@@ -177,7 +177,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: 1.3.1
 requirements: []
 rubyforge_project: 
-rubygems_version: 2.7.3
+rubygems_version: 2.7.6
 signing_key: 
 specification_version: 4
 summary: Materialzecss sass for rails.