diff --git a/bootstrap-elements.html b/bootstrap-elements.html
index 12b877f1..fd28bfaf 100644
--- a/bootstrap-elements.html
+++ b/bootstrap-elements.html
@@ -8,7 +8,7 @@
Bootstrap Material
-
+
diff --git a/less/_inputs.less b/less/_inputs.less
index a5ada103..f6a065d4 100644
--- a/less/_inputs.less
+++ b/less/_inputs.less
@@ -1,5 +1,19 @@
@import '_inputs-size.less';
+// Ugly reset of Bootstrap border
+fieldset[disabled] .form-control:disabled,
+.form-group .form-control:disabled,
+.form-control:disabled,
+fieldset[disabled] .form-control:focus:disabled,
+.form-group .form-control:focus:disabled,
+.form-control:focus:disabled,
+.form-group.is-focused fieldset[disabled] .form-control:disabled,
+.form-group.is-focused .form-group .form-control:disabled,
+.form-group.is-focused .form-control:disabled {
+ border: 0;
+}
+
+
// usage: .form-group-validation-state(@input-danger);
.form-group-validation-state(@name, @color) {
@@ -17,52 +31,53 @@
}
}
-.form-control {
- border: 0;
- background-image: linear-gradient(@primary, @primary), linear-gradient(@input-underline-color, @input-underline-color);
- background-size: 0 2px, 100% 1px;
- background-repeat: no-repeat;
- background-position: center bottom, center calc(~"100% - 1px");
- background-color: rgba(0, 0, 0, 0);
- transition: background 0s ease-out;
-
- .form-group.is-focused & {
- outline: none;
+.form-group {
+ .form-control {
+ border: 0;
background-image: linear-gradient(@primary, @primary), linear-gradient(@input-underline-color, @input-underline-color);
- background-size: 100% 2px, 100% 1px;
- box-shadow: none;
- transition-duration: 0.3s;
+ background-size: 0 2px, 100% 1px;
+ background-repeat: no-repeat;
+ background-position: center bottom, center calc(~"100% - 1px");
+ background-color: rgba(0, 0, 0, 0);
+ transition: background 0s ease-out;
- .material-input:after {
- background-color: @input-default;
- }
- }
+ .form-group.is-focused & {
+ outline: none;
+ background-image: linear-gradient(@primary, @primary), linear-gradient(@input-underline-color, @input-underline-color);
+ background-size: 100% 2px, 100% 1px;
+ box-shadow: none;
+ transition-duration: 0.3s;
- &,
- fieldset[disabled] & {
-
- &:textarea {
- height: 40px;
+ .material-input:after {
+ background-color: @input-default;
+ }
}
&,
- .form-group.is-focused & {
- float: none;
- border: 0;
- box-shadow: none;
- border-radius: 0;
- &:disabled {
- border-style: dashed;
- border-bottom: 1px solid #757575;
+ fieldset[disabled] & {
+
+ &:textarea {
+ height: 40px;
+ }
+
+ &,
+ .form-group.is-focused & {
+ float: none;
+ border: 0;
+ box-shadow: none;
+ border-radius: 0;
+ &:disabled {
+ background-image: none;
+ border-bottom: 1px dotted @input-underline-color;
+ }
}
}
- }
- &[disabled],
- &[readonly],
- fieldset[disabled] & {
- //background-color: transparent;
- background-color: rgba(0, 0, 0, 0);
+ &[disabled],
+ &[readonly],
+ fieldset[disabled] & {
+ background-color: rgba(0, 0, 0, 0);
+ }
}
}
@@ -309,15 +324,3 @@ select.form-control {
z-index: 100;
}
-// Ugly override of Bootstrap border
-fieldset[disabled] .form-control:disabled,
-.form-group .form-control:disabled,
-.form-control:disabled,
-fieldset[disabled] .form-control:focus:disabled,
-.form-group .form-control:focus:disabled,
-.form-control:focus:disabled,
-.form-group.is-focused fieldset[disabled] .form-control:disabled,
-.form-group.is-focused .form-group .form-control:disabled,
-.form-group.is-focused .form-control:disabled {
- border: 0;
-}