npm - @syncfusion/blazor-themes - Versions diffs - 22.2.7 → 22.2.9 - Mend

@syncfusion/blazor-themes 22.2.7 → 22.2.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (85) hide show

package/SCSS-Themes/bootstrap-dark.scss CHANGED Viewed

@@ -28515,8 +28515,10 @@ $cbox-border-style: solid !default;
       &:hover {
         @if $skin-name != 'FluentUI' {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          &.e-check {
+            background-color: $cbox-checkmark-hover-bgcolor;
+            border-color: $cbox-checkmark-hover-border-color;
+          }
         }
         @if $skin-name == 'FluentUI' {
           &:not(.e-check),
@@ -28611,8 +28613,12 @@ $cbox-border-style: solid !default;
         margin: 0;
         &:hover {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          @if $skin-name != 'FluentUI' {
+            &.e-check {
+              background-color: $cbox-checkmark-hover-bgcolor;
+              border-color: $cbox-checkmark-hover-border-color;
+            }
+          }
           @if $skin-name == 'FluentUI' {
             &:not(.e-check),
             &:not(.e-stop)::before {
@@ -28954,7 +28960,7 @@ $cbox-border-style: solid !default;
                 color: $cbox-icon-color;
               }
             }
-            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
+            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
               background-color: $cbox-checkmark-hover-bgcolor;
               border-color: $cbox-checkmark-hover-border-color;
             }
@@ -63985,6 +63991,7 @@ $de-para-dlg-rtl-btn-font-size: 12px;
 $de-para-dlg-rtl-btn-width: 200px;
 $de-de-rtl-btn-div-e-de-rtl-margin-right: 24px;
 $de-de-rtl-btn-div-e-de-rtl-margin-left: 12px;
+$de-svg-border-stroke: rgba($grey-dark-font, 1) !default;
 // Table properties
 $de-row-height-bottom-margin: 8px;
@@ -64001,6 +64008,14 @@ $de-column-presets-font-size: 60px !default;
     display: flex;
   }
+  .e-de-svg-border-color {
+    stroke: $de-svg-border-stroke;
+  }
+  .e-de-svg-border-fill-color {
+    fill: $de-svg-border-stroke;
+  }
   .e-de-container-row {
     display: flex;
     padding-bottom: $de-padding-full;
@@ -68767,7 +68782,9 @@ $de-prop-btn-icon-clr: #ccc;
   .e-de-toolbar {
     height: 100%;
   }
+  .e-documenteditorcontainer {
+    display: block;
+  }
   .e-de-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn-text .e-de-text-wrap {
     height: 0;
     @if $skin-name == 'tailwind' {
@@ -91043,7 +91060,7 @@ $gantt-masked-table-background-color: #e1dfdd;
         pointer-events: none;
         position: absolute;
         top: 50%;
-        width: 99%;
+        width: 99.5%;
       }
       .e-gantt-child-taskbar-inner-div,

package/SCSS-Themes/bootstrap.scss CHANGED Viewed

@@ -28289,8 +28289,10 @@ $cbox-key-focussed-bgcolor: transparent !default;
       &:hover {
         @if $skin-name != 'FluentUI' {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          &.e-check {
+            background-color: $cbox-checkmark-hover-bgcolor;
+            border-color: $cbox-checkmark-hover-border-color;
+          }
         }
         @if $skin-name == 'FluentUI' {
           &:not(.e-check),
@@ -28385,8 +28387,12 @@ $cbox-key-focussed-bgcolor: transparent !default;
         margin: 0;
         &:hover {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          @if $skin-name != 'FluentUI' {
+            &.e-check {
+              background-color: $cbox-checkmark-hover-bgcolor;
+              border-color: $cbox-checkmark-hover-border-color;
+            }
+          }
           @if $skin-name == 'FluentUI' {
             &:not(.e-check),
             &:not(.e-stop)::before {
@@ -28728,7 +28734,7 @@ $cbox-key-focussed-bgcolor: transparent !default;
                 color: $cbox-icon-color;
               }
             }
-            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
+            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
               background-color: $cbox-checkmark-hover-bgcolor;
               border-color: $cbox-checkmark-hover-border-color;
             }
@@ -63691,6 +63697,7 @@ $de-para-dlg-rtl-btn-font-size: 12px;
 $de-para-dlg-rtl-btn-width: 200px;
 $de-de-rtl-btn-div-e-de-rtl-margin-right: 24px;
 $de-de-rtl-btn-div-e-de-rtl-margin-left: 12px;
+$de-svg-border-stroke: rgba($grey-light-font, 1) !default;
 // Table properties
 $de-row-height-bottom-margin: 8px;
@@ -63707,6 +63714,14 @@ $de-column-presets-font-size: 60px !default;
     display: flex;
   }
+  .e-de-svg-border-color {
+    stroke: $de-svg-border-stroke;
+  }
+  .e-de-svg-border-fill-color {
+    fill: $de-svg-border-stroke;
+  }
   .e-de-container-row {
     display: flex;
     padding-bottom: $de-padding-full;
@@ -68473,7 +68488,9 @@ $de-prop-btn-icon-clr: #ccc;
   .e-de-toolbar {
     height: 100%;
   }
+  .e-documenteditorcontainer {
+    display: block;
+  }
   .e-de-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn-text .e-de-text-wrap {
     height: 0;
     @if $skin-name == 'tailwind' {
@@ -90808,7 +90825,7 @@ $gantt-masked-table-background-color: #e1dfdd;
         pointer-events: none;
         position: absolute;
         top: 50%;
-        width: 99%;
+        width: 99.5%;
       }
       .e-gantt-child-taskbar-inner-div,

package/SCSS-Themes/bootstrap4.scss CHANGED Viewed

@@ -28258,8 +28258,10 @@ $cbox-border-style: solid !default;
       &:hover {
         @if $skin-name != 'FluentUI' {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          &.e-check {
+            background-color: $cbox-checkmark-hover-bgcolor;
+            border-color: $cbox-checkmark-hover-border-color;
+          }
         }
         @if $skin-name == 'FluentUI' {
           &:not(.e-check),
@@ -28354,8 +28356,12 @@ $cbox-border-style: solid !default;
         margin: 0;
         &:hover {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          @if $skin-name != 'FluentUI' {
+            &.e-check {
+              background-color: $cbox-checkmark-hover-bgcolor;
+              border-color: $cbox-checkmark-hover-border-color;
+            }
+          }
           @if $skin-name == 'FluentUI' {
             &:not(.e-check),
             &:not(.e-stop)::before {
@@ -28697,7 +28703,7 @@ $cbox-border-style: solid !default;
                 color: $cbox-icon-color;
               }
             }
-            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
+            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
               background-color: $cbox-checkmark-hover-bgcolor;
               border-color: $cbox-checkmark-hover-border-color;
             }
@@ -63866,6 +63872,7 @@ $de-para-dlg-rtl-btn-font-size: 12px;
 $de-para-dlg-rtl-btn-width: 200px;
 $de-de-rtl-btn-div-e-de-rtl-margin-right: 24px;
 $de-de-rtl-btn-div-e-de-rtl-margin-left: 12px;
+$de-svg-border-stroke: rgba($gray-900, 1) !default;
 // Table properties
 $de-row-height-bottom-margin: 8px;
@@ -63882,6 +63889,14 @@ $de-column-presets-font-size: 60px !default;
     display: flex;
   }
+  .e-de-svg-border-color {
+    stroke: $de-svg-border-stroke;
+  }
+  .e-de-svg-border-fill-color {
+    fill: $de-svg-border-stroke;
+  }
   .e-de-container-row {
     display: flex;
     padding-bottom: $de-padding-full;
@@ -68649,7 +68664,9 @@ $de-hlt-clr-height-bigger: 25px;
   .e-de-toolbar {
     height: 100%;
   }
+  .e-documenteditorcontainer {
+    display: block;
+  }
   .e-de-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn-text .e-de-text-wrap {
     height: 0;
     @if $skin-name == 'tailwind' {
@@ -91125,7 +91142,7 @@ $gantt-masked-table-background-color: #e1dfdd;
         pointer-events: none;
         position: absolute;
         top: 50%;
-        width: 99%;
+        width: 99.5%;
       }
       .e-gantt-child-taskbar-inner-div,

package/SCSS-Themes/bootstrap5-dark.scss CHANGED Viewed

@@ -28580,8 +28580,10 @@ $cbox-border-style: solid !default;
       &:hover {
         @if $skin-name != 'FluentUI' {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          &.e-check {
+            background-color: $cbox-checkmark-hover-bgcolor;
+            border-color: $cbox-checkmark-hover-border-color;
+          }
         }
         @if $skin-name == 'FluentUI' {
           &:not(.e-check),
@@ -28676,8 +28678,12 @@ $cbox-border-style: solid !default;
         margin: 0;
         &:hover {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          @if $skin-name != 'FluentUI' {
+            &.e-check {
+              background-color: $cbox-checkmark-hover-bgcolor;
+              border-color: $cbox-checkmark-hover-border-color;
+            }
+          }
           @if $skin-name == 'FluentUI' {
             &:not(.e-check),
             &:not(.e-stop)::before {
@@ -29019,7 +29025,7 @@ $cbox-border-style: solid !default;
                 color: $cbox-icon-color;
               }
             }
-            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
+            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
               background-color: $cbox-checkmark-hover-bgcolor;
               border-color: $cbox-checkmark-hover-border-color;
             }
@@ -64085,6 +64091,7 @@ $de-para-dlg-rtl-btn-width: 200px !default;
 $de-de-rtl-btn-div-e-de-rtl-margin-right: 24px !default;
 $de-de-rtl-btn-div-e-de-rtl-margin-left: 12px !default;
 $de-para-dlg-spacing-div-mrgn-left: 40px !default;
+$de-svg-border-stroke: $content-text-color !default;
 // Color variable
 $de-background: $content-bg-color-alt1 !default;
@@ -64189,6 +64196,14 @@ $de-column-presets-font-size: $text-6xl !default;
     display: flex;
   }
+  .e-de-svg-border-color {
+    stroke: $de-svg-border-stroke;
+  }
+  .e-de-svg-border-fill-color {
+    fill: $de-svg-border-stroke;
+  }
   .e-de-container-row {
     display: flex;
     padding-bottom: $de-padding-full;
@@ -69020,7 +69035,9 @@ $de-hover-bg: $content-bg-color-alt2 !default;
   .e-de-toolbar {
     height: 100%;
   }
+  .e-documenteditorcontainer {
+    display: block;
+  }
   .e-de-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn-text .e-de-text-wrap {
     height: 0;
     @if $skin-name == 'tailwind' {
@@ -91340,7 +91357,7 @@ $gantt-masked-table-background-color: rgb(225,223,221);
         pointer-events: none;
         position: absolute;
         top: 50%;
-        width: 99%;
+        width: 99.5%;
       }
       .e-gantt-child-taskbar-inner-div,

package/SCSS-Themes/bootstrap5.scss CHANGED Viewed

@@ -28580,8 +28580,10 @@ $cbox-border-style: solid !default;
       &:hover {
         @if $skin-name != 'FluentUI' {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          &.e-check {
+            background-color: $cbox-checkmark-hover-bgcolor;
+            border-color: $cbox-checkmark-hover-border-color;
+          }
         }
         @if $skin-name == 'FluentUI' {
           &:not(.e-check),
@@ -28676,8 +28678,12 @@ $cbox-border-style: solid !default;
         margin: 0;
         &:hover {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          @if $skin-name != 'FluentUI' {
+            &.e-check {
+              background-color: $cbox-checkmark-hover-bgcolor;
+              border-color: $cbox-checkmark-hover-border-color;
+            }
+          }
           @if $skin-name == 'FluentUI' {
             &:not(.e-check),
             &:not(.e-stop)::before {
@@ -29019,7 +29025,7 @@ $cbox-border-style: solid !default;
                 color: $cbox-icon-color;
               }
             }
-            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
+            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
               background-color: $cbox-checkmark-hover-bgcolor;
               border-color: $cbox-checkmark-hover-border-color;
             }
@@ -64085,6 +64091,7 @@ $de-para-dlg-rtl-btn-width: 200px !default;
 $de-de-rtl-btn-div-e-de-rtl-margin-right: 24px !default;
 $de-de-rtl-btn-div-e-de-rtl-margin-left: 12px !default;
 $de-para-dlg-spacing-div-mrgn-left: 40px !default;
+$de-svg-border-stroke: $content-text-color !default;
 // Color variable
 $de-background: $content-bg-color-alt1 !default;
@@ -64189,6 +64196,14 @@ $de-column-presets-font-size: $text-6xl !default;
     display: flex;
   }
+  .e-de-svg-border-color {
+    stroke: $de-svg-border-stroke;
+  }
+  .e-de-svg-border-fill-color {
+    fill: $de-svg-border-stroke;
+  }
   .e-de-container-row {
     display: flex;
     padding-bottom: $de-padding-full;
@@ -69020,7 +69035,9 @@ $de-hover-bg: $content-bg-color-alt2 !default;
   .e-de-toolbar {
     height: 100%;
   }
+  .e-documenteditorcontainer {
+    display: block;
+  }
   .e-de-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn-text .e-de-text-wrap {
     height: 0;
     @if $skin-name == 'tailwind' {
@@ -91340,7 +91357,7 @@ $gantt-masked-table-background-color: rgb(225,223,221);
         pointer-events: none;
         position: absolute;
         top: 50%;
-        width: 99%;
+        width: 99.5%;
       }
       .e-gantt-child-taskbar-inner-div,

package/SCSS-Themes/buttons/check-box/bootstrap-dark.scss CHANGED Viewed

@@ -347,8 +347,10 @@ $cbox-border-style: solid !default;
       &:hover {
         @if $skin-name != 'FluentUI' {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          &.e-check {
+            background-color: $cbox-checkmark-hover-bgcolor;
+            border-color: $cbox-checkmark-hover-border-color;
+          }
         }
         @if $skin-name == 'FluentUI' {
           &:not(.e-check),
@@ -443,8 +445,12 @@ $cbox-border-style: solid !default;
         margin: 0;
         &:hover {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          @if $skin-name != 'FluentUI' {
+            &.e-check {
+              background-color: $cbox-checkmark-hover-bgcolor;
+              border-color: $cbox-checkmark-hover-border-color;
+            }
+          }
           @if $skin-name == 'FluentUI' {
             &:not(.e-check),
             &:not(.e-stop)::before {
@@ -786,7 +792,7 @@ $cbox-border-style: solid !default;
                 color: $cbox-icon-color;
               }
             }
-            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
+            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
               background-color: $cbox-checkmark-hover-bgcolor;
               border-color: $cbox-checkmark-hover-border-color;
             }

package/SCSS-Themes/buttons/check-box/bootstrap.scss CHANGED Viewed

@@ -344,8 +344,10 @@ $cbox-key-focussed-bgcolor: transparent !default;
       &:hover {
         @if $skin-name != 'FluentUI' {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          &.e-check {
+            background-color: $cbox-checkmark-hover-bgcolor;
+            border-color: $cbox-checkmark-hover-border-color;
+          }
         }
         @if $skin-name == 'FluentUI' {
           &:not(.e-check),
@@ -440,8 +442,12 @@ $cbox-key-focussed-bgcolor: transparent !default;
         margin: 0;
         &:hover {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          @if $skin-name != 'FluentUI' {
+            &.e-check {
+              background-color: $cbox-checkmark-hover-bgcolor;
+              border-color: $cbox-checkmark-hover-border-color;
+            }
+          }
           @if $skin-name == 'FluentUI' {
             &:not(.e-check),
             &:not(.e-stop)::before {
@@ -783,7 +789,7 @@ $cbox-key-focussed-bgcolor: transparent !default;
                 color: $cbox-icon-color;
               }
             }
-            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
+            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
               background-color: $cbox-checkmark-hover-bgcolor;
               border-color: $cbox-checkmark-hover-border-color;
             }

package/SCSS-Themes/buttons/check-box/bootstrap4.scss CHANGED Viewed

@@ -347,8 +347,10 @@ $cbox-border-style: solid !default;
       &:hover {
         @if $skin-name != 'FluentUI' {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          &.e-check {
+            background-color: $cbox-checkmark-hover-bgcolor;
+            border-color: $cbox-checkmark-hover-border-color;
+          }
         }
         @if $skin-name == 'FluentUI' {
           &:not(.e-check),
@@ -443,8 +445,12 @@ $cbox-border-style: solid !default;
         margin: 0;
         &:hover {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          @if $skin-name != 'FluentUI' {
+            &.e-check {
+              background-color: $cbox-checkmark-hover-bgcolor;
+              border-color: $cbox-checkmark-hover-border-color;
+            }
+          }
           @if $skin-name == 'FluentUI' {
             &:not(.e-check),
             &:not(.e-stop)::before {
@@ -786,7 +792,7 @@ $cbox-border-style: solid !default;
                 color: $cbox-icon-color;
               }
             }
-            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
+            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
               background-color: $cbox-checkmark-hover-bgcolor;
               border-color: $cbox-checkmark-hover-border-color;
             }

package/SCSS-Themes/buttons/check-box/bootstrap5-dark.scss CHANGED Viewed

@@ -347,8 +347,10 @@ $cbox-border-style: solid !default;
       &:hover {
         @if $skin-name != 'FluentUI' {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          &.e-check {
+            background-color: $cbox-checkmark-hover-bgcolor;
+            border-color: $cbox-checkmark-hover-border-color;
+          }
         }
         @if $skin-name == 'FluentUI' {
           &:not(.e-check),
@@ -443,8 +445,12 @@ $cbox-border-style: solid !default;
         margin: 0;
         &:hover {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          @if $skin-name != 'FluentUI' {
+            &.e-check {
+              background-color: $cbox-checkmark-hover-bgcolor;
+              border-color: $cbox-checkmark-hover-border-color;
+            }
+          }
           @if $skin-name == 'FluentUI' {
             &:not(.e-check),
             &:not(.e-stop)::before {
@@ -786,7 +792,7 @@ $cbox-border-style: solid !default;
                 color: $cbox-icon-color;
               }
             }
-            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
+            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
               background-color: $cbox-checkmark-hover-bgcolor;
               border-color: $cbox-checkmark-hover-border-color;
             }

package/SCSS-Themes/buttons/check-box/bootstrap5.scss CHANGED Viewed

@@ -347,8 +347,10 @@ $cbox-border-style: solid !default;
       &:hover {
         @if $skin-name != 'FluentUI' {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          &.e-check {
+            background-color: $cbox-checkmark-hover-bgcolor;
+            border-color: $cbox-checkmark-hover-border-color;
+          }
         }
         @if $skin-name == 'FluentUI' {
           &:not(.e-check),
@@ -443,8 +445,12 @@ $cbox-border-style: solid !default;
         margin: 0;
         &:hover {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          @if $skin-name != 'FluentUI' {
+            &.e-check {
+              background-color: $cbox-checkmark-hover-bgcolor;
+              border-color: $cbox-checkmark-hover-border-color;
+            }
+          }
           @if $skin-name == 'FluentUI' {
             &:not(.e-check),
             &:not(.e-stop)::before {
@@ -786,7 +792,7 @@ $cbox-border-style: solid !default;
                 color: $cbox-icon-color;
               }
             }
-            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
+            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
               background-color: $cbox-checkmark-hover-bgcolor;
               border-color: $cbox-checkmark-hover-border-color;
             }

package/SCSS-Themes/buttons/check-box/fabric-dark.scss CHANGED Viewed

@@ -349,8 +349,10 @@ $cbox-ripple-size: -9px !default;
       &:hover {
         @if $skin-name != 'FluentUI' {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          &.e-check {
+            background-color: $cbox-checkmark-hover-bgcolor;
+            border-color: $cbox-checkmark-hover-border-color;
+          }
         }
         @if $skin-name == 'FluentUI' {
           &:not(.e-check),
@@ -445,8 +447,12 @@ $cbox-ripple-size: -9px !default;
         margin: 0;
         &:hover {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          @if $skin-name != 'FluentUI' {
+            &.e-check {
+              background-color: $cbox-checkmark-hover-bgcolor;
+              border-color: $cbox-checkmark-hover-border-color;
+            }
+          }
           @if $skin-name == 'FluentUI' {
             &:not(.e-check),
             &:not(.e-stop)::before {
@@ -788,7 +794,7 @@ $cbox-ripple-size: -9px !default;
                 color: $cbox-icon-color;
               }
             }
-            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
+            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
               background-color: $cbox-checkmark-hover-bgcolor;
               border-color: $cbox-checkmark-hover-border-color;
             }

package/SCSS-Themes/buttons/check-box/fabric.scss CHANGED Viewed

@@ -346,8 +346,10 @@ $cbox-checked-ripple-bgcolo: rgba(0, 0, 0, .3) !default;
       &:hover {
         @if $skin-name != 'FluentUI' {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          &.e-check {
+            background-color: $cbox-checkmark-hover-bgcolor;
+            border-color: $cbox-checkmark-hover-border-color;
+          }
         }
         @if $skin-name == 'FluentUI' {
           &:not(.e-check),
@@ -442,8 +444,12 @@ $cbox-checked-ripple-bgcolo: rgba(0, 0, 0, .3) !default;
         margin: 0;
         &:hover {
-          background-color: $cbox-hover-bgcolor;
-          border-color: $cbox-hover-border-color;
+          @if $skin-name != 'FluentUI' {
+            &.e-check {
+              background-color: $cbox-checkmark-hover-bgcolor;
+              border-color: $cbox-checkmark-hover-border-color;
+            }
+          }
           @if $skin-name == 'FluentUI' {
             &:not(.e-check),
             &:not(.e-stop)::before {
@@ -785,7 +791,7 @@ $cbox-checked-ripple-bgcolo: rgba(0, 0, 0, .3) !default;
                 color: $cbox-icon-color;
               }
             }
-            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
+            @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
               background-color: $cbox-checkmark-hover-bgcolor;
               border-color: $cbox-checkmark-hover-border-color;
             }