Fixes #8159: Be more specific about disabled inputs to avoid iOS bug

Attached disabled styles to the exact input types rather than all
inputs and reseting the checkbox/radios. If setting `background-color:
transparent;`, iOS renders no background on the disabled control.

1 files changed, 11 insertions, 29 deletions

diff --git a/less/forms.less b/less/forms.less
index 0d55cd148..609580928 100644
--- a/less/forms.less
+++ b/less/forms.less
@@ -72,6 +72,17 @@ input[type="color"] {
     outline: 0;
     .box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6)");
   }
+
+  // Disabled and read-only inputs
+  // Note: HTML5 says that inputs under a fieldset > legend:first-child won't be
+  //   disabled if the fieldset is disabled. Due to implementation difficulty,
+  //   we don't honor that edge case; we style them as disabled anyway.
+  &[disabled],
+  &[readonly],
+  fieldset[disabled] & {
+    cursor: not-allowed;
+    background-color: @input-bg-disabled;
+  }
 }
 
 // Reset appearance properties for textual inputs and textarea
@@ -241,35 +252,6 @@ input[type="color"] {
 }
 
 
-// DISABLED STATE
-// --------------
-
-// Disabled and read-only inputs
-// Note: HTML5 says that inputs under a fieldset > legend:first-child won't be
-//   disabled if the fieldset is disabled. Due to implementation difficulty,
-//   we don't honor that edge case; we style them as disabled anyway.
-input,
-select,
-textarea {
-  &[disabled],
-  &[readonly],
-  fieldset[disabled] & {
-    cursor: not-allowed;
-    background-color: @input-bg-disabled;
-  }
-}
-// Explicitly reset the colors here
-input[type="radio"],
-input[type="checkbox"] {
-  &[disabled],
-  &[readonly],
-  fieldset[disabled] & {
-    background-color: transparent;
-  }
-}
-
-
-
 
 // FORM FIELD FEEDBACK STATES
 // --------------------------