From: Martijn Cuppens <martijn.cuppens@gmail.com>
Date: Wed, 25 Jul 2018 00:39:15 +0000 (+0200)
Subject: Custom input range disabled styling (#26540)
X-Git-Tag: v4.2.0~400
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=d80635c1cd503f0f017c014f3728ee4e3bc05264;p=thirdparty%2Fbootstrap.git

Custom input range disabled styling (#26540)
---

diff --git a/scss/_custom-forms.scss b/scss/_custom-forms.scss
index 8348e261c5..5e1fa19927 100644
--- a/scss/_custom-forms.scss
+++ b/scss/_custom-forms.scss
@@ -424,6 +424,28 @@
     background-color: $custom-range-track-bg;
     @include border-radius($custom-range-track-border-radius);
   }
+
+  &:disabled {
+    &::-webkit-slider-thumb {
+      background-color: $custom-range-thumb-disabled-bg;
+    }
+
+    &::-webkit-slider-runnable-track {
+      cursor: default;
+    }
+
+    &::-moz-range-thumb {
+      background-color: $custom-range-thumb-disabled-bg;
+    }
+
+    &::-moz-range-track {
+      cursor: default;
+    }
+
+    &::-ms-thumb {
+      background-color: $custom-range-thumb-disabled-bg;
+    }
+  }
 }
 
 .custom-control-label::before,
diff --git a/scss/_variables.scss b/scss/_variables.scss
index 0aa549447a..525f9be446 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -548,6 +548,7 @@ $custom-range-thumb-box-shadow:              0 .1rem .25rem rgba($black, .1) !de
 $custom-range-thumb-focus-box-shadow:        0 0 0 1px $body-bg, $input-btn-focus-box-shadow !default;
 $custom-range-thumb-focus-box-shadow-width:  $input-btn-focus-width !default; // For focus box shadow issue in IE/Edge
 $custom-range-thumb-active-bg:               lighten($component-active-bg, 35%) !default;
+$custom-range-thumb-disabled-bg:             $gray-500 !default;
 
 $custom-file-height:                $input-height !default;
 $custom-file-height-inner:          $input-height-inner !default;