diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 8359fc76..4fc39c80 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -1,6 +1,6 @@ ## Playground -Use this pen to test and deveop new features of Material Design for Bootstrap: +Use this pen to test and develop new features of Material Design for Bootstrap: http://codepen.io/FezVrasta/pen/ihmea diff --git a/bootstrap-elements.html b/bootstrap-elements.html index e5a61354..7fc5e112 100644 --- a/bootstrap-elements.html +++ b/bootstrap-elements.html @@ -4,7 +4,7 @@ Bootstrap Material - + @@ -2264,7 +2264,7 @@
- + - + diff --git a/index.html b/index.html index cc333bad..de413f55 100644 --- a/index.html +++ b/index.html @@ -8,7 +8,7 @@ - + @@ -1415,7 +1415,7 @@ - + diff --git a/less/_inputs.less b/less/_inputs.less index 9f31ed69..40db3a91 100644 --- a/less/_inputs.less +++ b/less/_inputs.less @@ -29,6 +29,15 @@ select[multiple].form-control { background-size: 0 2px, 100% 1px; background-repeat: no-repeat; background-position: center bottom, center calc(~"100% - 1px"); + background-color: transparent; + background-color: rgba(0,0,0,0); +} +.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control { + background-color: transparent; + background-color: rgba(0,0,0,0); +} +fieldset[disabled] .form-control:disabled, .form-control-wrapper .form-control:disabled, .form-control:disabled, fieldset[disabled] .form-control:focus:disabled, .form-control-wrapper .form-control:focus:disabled, .form-control:focus:disabled, fieldset[disabled] .form-control.focus:disabled, .form-control-wrapper .form-control.focus:disabled, .form-control.focus:disabled { + border: 0; } .form-control:focus, .form-control.focus { diff --git a/less/_togglebutton.less b/less/_togglebutton.less index 7f8001fe..7f5a7398 100644 --- a/less/_togglebutton.less +++ b/less/_togglebutton.less @@ -7,13 +7,13 @@ font-weight: 400; cursor: pointer; // Hide original checkbox - input[type=checkbox]:first-child { + input[type=checkbox]:first-of-type { opacity: 0; width: 0; height:0; } // Switch bg on - input[type=checkbox]:first-child:checked + .toggle { + input[type=checkbox]:first-of-type:checked + .toggle { background-color: rgba(0, 149, 135, 0.5); // Handle on &:after { @@ -22,7 +22,7 @@ } // Switch bg off and disabled .toggle, - input[type=checkbox][disabled]:first-child + .toggle { + input[type=checkbox][disabled]:first-of-type + .toggle { content: ""; display: inline-block; width: 30px; @@ -48,20 +48,20 @@ transition: left 0.3s ease, background 0.3s ease, box-shadow 0.1s ease; } // Handle disabled - input[type=checkbox][disabled]:first-child + .toggle:after, - input[type=checkbox][disabled]:checked:first-child + .toggle:after{ + input[type=checkbox][disabled]:first-of-type + .toggle:after, + input[type=checkbox][disabled]:checked:first-of-type + .toggle:after{ background-color: #BDBDBD; } // Ripple on - input[type=checkbox]:first-child:checked ~ .toggle:active:after { + input[type=checkbox]:first-of-type:checked ~ .toggle:active:after { box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4), 0 0 0 15px rgba(0, 149, 135, 0.1); } // Ripple off and disabled - input[type=checkbox]:first-child ~ .toggle:active:after, - input[type=checkbox][disabled]:first-child ~ .toggle:active:after { + input[type=checkbox]:first-of-type ~ .toggle:active:after, + input[type=checkbox][disabled]:first-of-type ~ .toggle:active:after { box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4), 0 0 0 15px rgba(0, 0, 0, 0.1); } - input[type=checkbox]:first-child:checked + .toggle:after { + input[type=checkbox]:first-of-type:checked + .toggle:after { left: 15px; } } diff --git a/scripts/material.js b/scripts/material.js index 93123768..615c365d 100644 --- a/scripts/material.js +++ b/scripts/material.js @@ -111,7 +111,7 @@ }) .on("keyup change", ".form-control", function() { var $this = $(this); - if($this.val() === "" && $this[0].checkValidity()) { + if ($this.val() === "" && (typeof $this[0].checkValidity != "undefined" && $this[0].checkValidity())) { $this.addClass("empty"); } else { $this.removeClass("empty");