[Fix Issue #15683] `readonly` input should not have a not-allowed cursor

[Fix Issue #15683] `readonly` input should not have a `not-allowed` cursor. Instead, this pull request displays a standard cursor and only displays the not-allowed cursor on disabled items.

Revise docs wording to clarify cursor display

diff --git a/docs/_includes/css/forms.html b/docs/_includes/css/forms.html
index 614b43f9224b59d0861862cf44f4683d46201b6d..7737ae909e9711bf4cfd378fae15efeeee99f7db 100644 (file)
--- a/docs/_includes/css/forms.html
+++ b/docs/_includes/css/forms.html
@@ -528,7 +528,7 @@
 
 
   <h2 id="forms-control-disabled">Disabled state</h2>
-  <p>Add the <code>disabled</code> boolean attribute on an input to prevent user input and trigger a slightly different look.</p>
+  <p>Add the <code>disabled</code> boolean attribute on an input to prevent user interactions. Disabled inputs appear lighter and add a <code>not-allowed</code> cursor.</p>
   <div class="bs-example" data-example-id="text-form-control-disabled">
     <form>
       <input class="form-control" id="disabledInput" type="text" placeholder="Disabled input here…" disabled>
@@ -598,7 +598,7 @@
 
 
   <h2 id="forms-control-readonly">Readonly state</h2>
-  <p>Add the <code>readonly</code> boolean attribute on an input to prevent user input and style the input as disabled.</p>
+  <p>Add the <code>readonly</code> boolean attribute on an input to prevent modification of the input's value. Read-only inputs appear lighter (just like disabled inputs), but retain the standard cursor.</p>
   <div class="bs-example" data-example-id="readonly-text-form-control">
     <form>
       <input class="form-control" type="text" placeholder="Readonly input here…" readonly>

diff --git a/less/forms.less b/less/forms.less
index 3138c2c518ab7b3a300c1a23e8b6fe7ff1f8cd63..e9d99c8dbc2d64eccd24c8796219292bb4c8d037 100644 (file)
--- a/less/forms.less
+++ b/less/forms.less
@@ -141,10 +141,14 @@ output {
   &[disabled],
   &[readonly],
   fieldset[disabled] & {
-    cursor: @cursor-disabled;
     background-color: @input-bg-disabled;
     opacity: 1; // iOS fix for unreadable disabled content; see https://github.com/twbs/bootstrap/issues/11655
   }
+  
+  &[disabled],
+  fieldset[disabled] & {
+    cursor: @cursor-disabled;
+  }
 
   // Reset height for `textarea`s
   textarea& {