Workaround for MS edge bug (#28275)

5e459e9b · Shohei Yoshida · XhmikosR · ad0f5f15 · 5e459e9b · 5e459e9b
Commit 5e459e9b authored 6 years ago by Shohei Yoshida Committed by XhmikosR 6 years ago
Hide whitespace changes
Inline Side-by-side

Showing

with 9 additions and 3 deletions
+9 -3
--- a/scss/_custom-forms.scss
+++ b/scss/_custom-forms.scss
@@ -51,7 +51,9 @@
    @include box-shadow($custom-control-indicator-active-box-shadow);
  }

-  &:disabled {
+  // Use disabled attribute instead of :disabled pseudo-class
+  // Workaround for: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11295231
+  &[disabled] {
    ~ .custom-control-label {
      color: $custom-control-label-disabled-color;

@@ -307,7 +309,9 @@
    box-shadow: $custom-file-focus-box-shadow;
  }

-  &:disabled ~ .custom-file-label {
+  // Use disabled attribute instead of :disabled pseudo-class
+  // Workaround for: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11295231
+  &[disabled] ~ .custom-file-label {
    background-color: $custom-file-disabled-bg;
  }


--- a/scss/_forms.scss
+++ b/scss/_forms.scss
@@ -210,7 +210,9 @@ textarea.form-control {
  margin-top: $form-check-input-margin-y;
  margin-left: -$form-check-input-gutter;

-  &:disabled ~ .form-check-label {
+  // Use disabled attribute instead of :disabled pseudo-class
+  // Workaround for: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/11295231
+  &[disabled] ~ .form-check-label {
    color: $text-muted;
  }
 }