Fixed switch custom color with disabled.

examples/docs/en-US/switch.md

@@ -12,7 +12,7 @@
 
 ## Switch
 
-Switch is used for switching between two opposing states. 
+Switch is used for switching between two opposing states.
 
 ### Basic usage
 
@@ -45,7 +45,7 @@ Switch is used for switching between two opposing states.
 
 ### Disabled
 
-:::demo Adding the `disabled` attribute disables Switch. 
+:::demo Adding the `disabled` attribute disables Switch.
 
 ```html
 <el-switch

packages/switch/src/component.vue

@@ -126,7 +126,7 @@
         this.coreWidth = this.hasText ? 58 : 46;
       }
       this.handleButtonTransform();
-      if ((this.onColor || this.offColor) && !this.disabled) {
+      if (this.onColor || this.offColor) {
         this.setBackgroundColor();
       }
     }

packages/theme-default/src/switch.css

@@ -80,15 +80,15 @@
 
     @when disabled {
       .el-switch__core {
-        border-color: var(--switch-disabled-color);
-        background: var(--switch-disabled-color);
+        border-color: var(--switch-disabled-color) !important;
+        background: var(--switch-disabled-color) !important;
 
         & span {
-          background-color: var(--switch-disabled-text-color);
+          background-color: var(--switch-disabled-text-color) !important;
         }
 
         & ~ .el-switch__label * {
-          color: var(--switch-disabled-text-color);
+          color: var(--switch-disabled-text-color) !important;
         }
       }