material_design_lite-rails 1.1.1 → 1.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 8ff0ee739c31fc7c0d1a327ce34578290585f339
4
- data.tar.gz: 19589d1dc787e002f9d0a18036e56607f7fc36c8
3
+ metadata.gz: 03c1bda05b8d4289ea7dd6c4e0ad7a3c96be8fd0
4
+ data.tar.gz: ea4625573442d5533ed78b28589992ac5d3a615c
5
5
  SHA512:
6
- metadata.gz: 0af31818124cb87af60674a1af9e033a55d14dedc24f80e63f978d82f87e6748263390cfe5bc685731b4e268c56e8803dec542ac094f9921c7661e19c18b49e1
7
- data.tar.gz: ed975c8e32b32e742deaaea7f6a3ba2d81e8721d7c514d248b0293f03126b5913ec1264f84c0833b72815128d8976fb00453f7a11fbe7aae571698cffc13d0ae
6
+ metadata.gz: b0589aab601efb0c276bc3382f60be2554ed29d6639882e2a012c916c812ff0b3941193514e53886e6e6acfa66716f0eb2a5179514631fb9642b283cb07bc427
7
+ data.tar.gz: e39afa626ab52525d3b379d3f71485add5be360e97e8b582ec91da3b674e88b6ea30879eefec5f1da8e3d4ace7d83e2de3e44efc53c38c844576497e1c0a2306
data/.gitignore CHANGED
@@ -7,3 +7,4 @@
7
7
  /pkg/
8
8
  /spec/reports/
9
9
  /tmp/
10
+ /node_modules
@@ -0,0 +1,4 @@
1
+ # See: https://github.com/cllns/npm2gem
2
+ material-design-lite:
3
+ - material.js
4
+ - material.css
data/README.md CHANGED
@@ -83,6 +83,7 @@ The first three digits will always be the same as `google/material-design-lite`.
83
83
 
84
84
  - [ ] Add tests (make sure CSS/JS loads, and check version)
85
85
  - [ ] Add view helpers, to ease burden of manually adding all the classes.
86
+ - [ ] Fix issue where you need to manually create `node_modules` directory
86
87
 
87
88
  ## Contributing
88
89
 
@@ -1,5 +1,5 @@
1
1
  module MaterialDesignLite
2
2
  module Rails
3
- VERSION = "1.1.1"
3
+ VERSION = "1.1.2"
4
4
  end
5
5
  end
@@ -345,17 +345,19 @@ componentHandler = (function() {
345
345
  * @param {?componentHandler.Component} component
346
346
  */
347
347
  function deconstructComponentInternal(component) {
348
- var componentIndex = createdComponents_.indexOf(component);
349
- createdComponents_.splice(componentIndex, 1);
348
+ if (component) {
349
+ var componentIndex = createdComponents_.indexOf(component);
350
+ createdComponents_.splice(componentIndex, 1);
350
351
 
351
- var upgrades = component.element_.getAttribute('data-upgraded').split(',');
352
- var componentPlace = upgrades.indexOf(component[componentConfigProperty_].classAsString);
353
- upgrades.splice(componentPlace, 1);
354
- component.element_.setAttribute('data-upgraded', upgrades.join(','));
352
+ var upgrades = component.element_.getAttribute('data-upgraded').split(',');
353
+ var componentPlace = upgrades.indexOf(component[componentConfigProperty_].classAsString);
354
+ upgrades.splice(componentPlace, 1);
355
+ component.element_.setAttribute('data-upgraded', upgrades.join(','));
355
356
 
356
- var ev = document.createEvent('Events');
357
- ev.initEvent('mdl-componentdowngraded', true, true);
358
- component.element_.dispatchEvent(ev);
357
+ var ev = document.createEvent('Events');
358
+ ev.initEvent('mdl-componentdowngraded', true, true);
359
+ component.element_.dispatchEvent(ev);
360
+ }
359
361
  }
360
362
 
361
363
  /**
@@ -2774,7 +2776,8 @@ MaterialTextfield.prototype.CssClasses_ = {
2774
2776
  IS_FOCUSED: 'is-focused',
2775
2777
  IS_DISABLED: 'is-disabled',
2776
2778
  IS_INVALID: 'is-invalid',
2777
- IS_UPGRADED: 'is-upgraded'
2779
+ IS_UPGRADED: 'is-upgraded',
2780
+ HAS_PLACEHOLDER: 'has-placeholder'
2778
2781
  };
2779
2782
  /**
2780
2783
  * Handle input being entered.
@@ -2928,6 +2931,9 @@ MaterialTextfield.prototype.init = function () {
2928
2931
  this.maxRows = this.Constant_.NO_MAX_ROWS;
2929
2932
  }
2930
2933
  }
2934
+ if (this.input_.hasAttribute('placeholder')) {
2935
+ this.element_.classList.add(this.CssClasses_.HAS_PLACEHOLDER);
2936
+ }
2931
2937
  this.boundUpdateClassesHandler = this.updateClasses_.bind(this);
2932
2938
  this.boundFocusHandler = this.onFocus_.bind(this);
2933
2939
  this.boundBlurHandler = this.onBlur_.bind(this);
@@ -3133,6 +3139,7 @@ window['MaterialLayout'] = MaterialLayout;
3133
3139
  MaterialLayout.prototype.Constant_ = {
3134
3140
  MAX_WIDTH: '(max-width: 1024px)',
3135
3141
  TAB_SCROLL_PIXELS: 100,
3142
+ RESIZE_TIMEOUT: 100,
3136
3143
  MENU_ICON: '',
3137
3144
  CHEVRON_LEFT: 'chevron_left',
3138
3145
  CHEVRON_RIGHT: 'chevron_right'
@@ -3235,7 +3242,8 @@ MaterialLayout.prototype.contentScrollHandler_ = function () {
3235
3242
  * @private
3236
3243
  */
3237
3244
  MaterialLayout.prototype.keyboardEventHandler_ = function (evt) {
3238
- if (evt.keyCode === this.Keycodes_.ESCAPE) {
3245
+ // Only react when the drawer is open.
3246
+ if (evt.keyCode === this.Keycodes_.ESCAPE && this.drawer_.classList.contains(this.CssClasses_.IS_DRAWER_OPEN)) {
3239
3247
  this.toggleDrawer();
3240
3248
  }
3241
3249
  };
@@ -3339,9 +3347,13 @@ MaterialLayout.prototype.init = function () {
3339
3347
  if (this.element_) {
3340
3348
  var container = document.createElement('div');
3341
3349
  container.classList.add(this.CssClasses_.CONTAINER);
3350
+ var focusedElement = this.element_.querySelector(':focus');
3342
3351
  this.element_.parentElement.insertBefore(container, this.element_);
3343
3352
  this.element_.parentElement.removeChild(this.element_);
3344
3353
  container.appendChild(this.element_);
3354
+ if (focusedElement) {
3355
+ focusedElement.focus();
3356
+ }
3345
3357
  var directChildren = this.element_.childNodes;
3346
3358
  var numChildren = directChildren.length;
3347
3359
  for (var c = 0; c < numChildren; c++) {
@@ -3476,8 +3488,9 @@ MaterialLayout.prototype.init = function () {
3476
3488
  tabContainer.appendChild(leftButton);
3477
3489
  tabContainer.appendChild(this.tabBar_);
3478
3490
  tabContainer.appendChild(rightButton);
3479
- // Add and remove buttons depending on scroll position.
3480
- var tabScrollHandler = function () {
3491
+ // Add and remove tab buttons depending on scroll position and total
3492
+ // window size.
3493
+ var tabUpdateHandler = function () {
3481
3494
  if (this.tabBar_.scrollLeft > 0) {
3482
3495
  leftButton.classList.add(this.CssClasses_.IS_ACTIVE);
3483
3496
  } else {
@@ -3489,8 +3502,20 @@ MaterialLayout.prototype.init = function () {
3489
3502
  rightButton.classList.remove(this.CssClasses_.IS_ACTIVE);
3490
3503
  }
3491
3504
  }.bind(this);
3492
- this.tabBar_.addEventListener('scroll', tabScrollHandler);
3493
- tabScrollHandler();
3505
+ this.tabBar_.addEventListener('scroll', tabUpdateHandler);
3506
+ tabUpdateHandler();
3507
+ // Update tabs when the window resizes.
3508
+ var windowResizeHandler = function () {
3509
+ // Use timeouts to make sure it doesn't happen too often.
3510
+ if (this.resizeTimeoutId_) {
3511
+ clearTimeout(this.resizeTimeoutId_);
3512
+ }
3513
+ this.resizeTimeoutId_ = setTimeout(function () {
3514
+ tabUpdateHandler();
3515
+ this.resizeTimeoutId_ = null;
3516
+ }.bind(this), this.Constant_.RESIZE_TIMEOUT);
3517
+ }.bind(this);
3518
+ window.addEventListener('resize', windowResizeHandler);
3494
3519
  if (this.tabBar_.classList.contains(this.CssClasses_.JS_RIPPLE_EFFECT)) {
3495
3520
  this.tabBar_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);
3496
3521
  }
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * material-design-lite - Material Design Components in CSS, JS and HTML
3
- * @version v1.1.1
3
+ * @version v1.1.2
4
4
  * @license Apache-2.0
5
5
  * @copyright 2015 Google, Inc.
6
6
  * @link https://github.com/google/material-design-lite
@@ -526,13 +526,11 @@ textarea {
526
526
  *,
527
527
  *:before,
528
528
  *:after,
529
- *:first-letter,
530
- *:first-line {
529
+ *:first-letter {
531
530
  background: transparent !important;
532
531
  color: #000 !important;
533
532
  /* Black prints faster: http://www.sanbeiji.com/archives/953 */
534
- box-shadow: none !important;
535
- text-shadow: none !important; }
533
+ box-shadow: none !important; }
536
534
  a,
537
535
  a:visited {
538
536
  text-decoration: underline; }
@@ -4800,10 +4798,9 @@ input.mdl-button[type="submit"] {
4800
4798
  color: rgba(0, 0, 0, 0.54);
4801
4799
  padding-bottom: 8px;
4802
4800
  box-sizing: border-box; }
4803
- .mdl-data-table th .mdl-data-table__header--sorted-ascending, .mdl-data-table th .mdl-data-table__header--sorted-descending {
4801
+ .mdl-data-table th.mdl-data-table__header--sorted-ascending, .mdl-data-table th.mdl-data-table__header--sorted-descending {
4804
4802
  color: rgba(0, 0, 0, 0.87); }
4805
- .mdl-data-table th .mdl-data-table__header--sorted-ascending:before, .mdl-data-table th .mdl-data-table__header--sorted-descending:before {
4806
- font-size: 16px;
4803
+ .mdl-data-table th.mdl-data-table__header--sorted-ascending:before, .mdl-data-table th.mdl-data-table__header--sorted-descending:before {
4807
4804
  font-family: 'Material Icons';
4808
4805
  font-weight: normal;
4809
4806
  font-style: normal;
@@ -4816,10 +4813,16 @@ input.mdl-button[type="submit"] {
4816
4813
  -moz-font-feature-settings: 'liga';
4817
4814
  font-feature-settings: 'liga';
4818
4815
  -webkit-font-feature-settings: 'liga';
4819
- -webkit-font-smoothing: antialiased; }
4820
- .mdl-data-table th .mdl-data-table__header--sorted-ascending:before {
4821
- content: "\e5d8"; }
4822
- .mdl-data-table th .mdl-data-table__header--sorted-descending:before {
4816
+ -webkit-font-smoothing: antialiased;
4817
+ font-size: 16px;
4818
+ content: "\e5d8";
4819
+ margin-right: 5px;
4820
+ vertical-align: sub; }
4821
+ .mdl-data-table th.mdl-data-table__header--sorted-ascending:hover, .mdl-data-table th.mdl-data-table__header--sorted-descending:hover {
4822
+ cursor: pointer; }
4823
+ .mdl-data-table th.mdl-data-table__header--sorted-ascending:hover:before, .mdl-data-table th.mdl-data-table__header--sorted-descending:hover:before {
4824
+ color: rgba(0, 0, 0, 0.26); }
4825
+ .mdl-data-table th.mdl-data-table__header--sorted-descending:before {
4823
4826
  content: "\e5db"; }
4824
4827
 
4825
4828
  .mdl-data-table__select {
@@ -8457,17 +8460,20 @@ _:-ms-input-placeholder, :root .mdl-slider.mdl-slider.is-upgraded {
8457
8460
  position: fixed;
8458
8461
  bottom: 0;
8459
8462
  left: 50%;
8460
- margin-right: -50%;
8461
8463
  cursor: default;
8462
8464
  background-color: #323232;
8463
- z-index: 10000;
8465
+ z-index: 3;
8466
+ display: block;
8464
8467
  display: -webkit-flex;
8465
8468
  display: -ms-flexbox;
8466
8469
  display: flex;
8470
+ -webkit-justify-content: space-between;
8471
+ -ms-flex-pack: justify;
8472
+ justify-content: space-between;
8467
8473
  font-family: "Roboto", "Helvetica", "Arial", sans-serif;
8468
8474
  will-change: transform;
8469
- -webkit-transform: translate(0, 80px);
8470
- transform: translate(0, 80px);
8475
+ -webkit-transform: translate(-50%, 80px);
8476
+ transform: translate(-50%, 80px);
8471
8477
  transition: -webkit-transform 0.25s cubic-bezier(0.4, 0, 1, 1);
8472
8478
  transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1);
8473
8479
  transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1), -webkit-transform 0.25s cubic-bezier(0.4, 0, 1, 1);
@@ -8484,22 +8490,24 @@ _:-ms-input-placeholder, :root .mdl-slider.mdl-slider.is-upgraded {
8484
8490
  max-width: 568px;
8485
8491
  border-radius: 2px; } }
8486
8492
  .mdl-snackbar--active {
8487
- -webkit-transform: translate(0, 0);
8488
- transform: translate(0, 0);
8493
+ -webkit-transform: translate(-50%, 0);
8494
+ transform: translate(-50%, 0);
8489
8495
  pointer-events: auto;
8490
8496
  transition: -webkit-transform 0.25s cubic-bezier(0, 0, 0.2, 1);
8491
8497
  transition: transform 0.25s cubic-bezier(0, 0, 0.2, 1);
8492
8498
  transition: transform 0.25s cubic-bezier(0, 0, 0.2, 1), -webkit-transform 0.25s cubic-bezier(0, 0, 0.2, 1); }
8493
8499
  .mdl-snackbar__text {
8494
- padding: 14px 24px;
8500
+ padding: 14px 12px 14px 24px;
8495
8501
  vertical-align: middle;
8496
- color: white; }
8502
+ color: white;
8503
+ float: left; }
8497
8504
  .mdl-snackbar__action {
8498
8505
  background: transparent;
8499
8506
  border: none;
8500
8507
  color: rgb(255,64,129);
8508
+ float: right;
8501
8509
  text-transform: uppercase;
8502
- padding: 14px 24px;
8510
+ padding: 14px 24px 14px 12px;
8503
8511
  font-family: "Roboto", "Helvetica", "Arial", sans-serif;
8504
8512
  font-size: 14px;
8505
8513
  font-weight: 500;
@@ -8513,7 +8521,9 @@ _:-ms-input-placeholder, :root .mdl-slider.mdl-slider.is-upgraded {
8513
8521
  cursor: pointer;
8514
8522
  text-decoration: none;
8515
8523
  text-align: center;
8516
- vertical-align: middle; }
8524
+ -webkit-align-self: center;
8525
+ -ms-flex-item-align: center;
8526
+ align-self: center; }
8517
8527
  .mdl-snackbar__action::-moz-focus-inner {
8518
8528
  border: 0; }
8519
8529
  .mdl-snackbar__action:not([aria-hidden]) {
@@ -9831,22 +9841,27 @@ _:-ms-input-placeholder, :root .mdl-slider.mdl-slider.is-upgraded {
9831
9841
  overflow: hidden;
9832
9842
  white-space: nowrap;
9833
9843
  text-align: left; }
9834
- .mdl-textfield.is-dirty .mdl-textfield__label {
9844
+ .mdl-textfield.is-dirty .mdl-textfield__label,
9845
+ .mdl-textfield.has-placeholder .mdl-textfield__label {
9835
9846
  visibility: hidden; }
9836
9847
  .mdl-textfield--floating-label .mdl-textfield__label {
9837
9848
  transition-duration: 0.2s;
9838
9849
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
9850
+ .mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {
9851
+ transition: none; }
9839
9852
  fieldset[disabled] .mdl-textfield .mdl-textfield__label,
9840
9853
  .mdl-textfield.is-disabled.is-disabled .mdl-textfield__label {
9841
9854
  color: rgba(0,0,0, 0.26); }
9842
9855
  .mdl-textfield--floating-label.is-focused .mdl-textfield__label,
9843
- .mdl-textfield--floating-label.is-dirty .mdl-textfield__label {
9856
+ .mdl-textfield--floating-label.is-dirty .mdl-textfield__label,
9857
+ .mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {
9844
9858
  color: rgb(63,81,181);
9845
9859
  font-size: 12px;
9846
9860
  top: 4px;
9847
9861
  visibility: visible; }
9848
9862
  .mdl-textfield--floating-label.is-focused .mdl-textfield__expandable-holder .mdl-textfield__label,
9849
- .mdl-textfield--floating-label.is-dirty .mdl-textfield__expandable-holder .mdl-textfield__label {
9863
+ .mdl-textfield--floating-label.is-dirty .mdl-textfield__expandable-holder .mdl-textfield__label,
9864
+ .mdl-textfield--floating-label.has-placeholder .mdl-textfield__expandable-holder .mdl-textfield__label {
9850
9865
  top: -16px; }
9851
9866
  .mdl-textfield--floating-label.is-invalid .mdl-textfield__label {
9852
9867
  color: rgb(213,0,0);
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: material_design_lite-rails
3
3
  version: !ruby/object:Gem::Version
4
- version: 1.1.1
4
+ version: 1.1.2
5
5
  platform: ruby
6
6
  authors:
7
7
  - Sean Collins
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2016-02-06 00:00:00.000000000 Z
11
+ date: 2016-03-04 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: railties
@@ -60,6 +60,7 @@ extensions: []
60
60
  extra_rdoc_files: []
61
61
  files:
62
62
  - ".gitignore"
63
+ - ".npm2gem.yml"
63
64
  - ".rspec"
64
65
  - CODE_OF_CONDUCT.md
65
66
  - Gemfile