@syncfusion/blazor-themes 22.2.7 → 22.2.8

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 (33) hide show
  1. package/SCSS-Themes/bootstrap-dark.scss +5 -3
  2. package/SCSS-Themes/bootstrap.scss +5 -3
  3. package/SCSS-Themes/bootstrap4.scss +5 -3
  4. package/SCSS-Themes/bootstrap5-dark.scss +5 -3
  5. package/SCSS-Themes/bootstrap5.scss +5 -3
  6. package/SCSS-Themes/buttons/check-box/bootstrap-dark.scss +5 -3
  7. package/SCSS-Themes/buttons/check-box/bootstrap.scss +5 -3
  8. package/SCSS-Themes/buttons/check-box/bootstrap4.scss +5 -3
  9. package/SCSS-Themes/buttons/check-box/bootstrap5-dark.scss +5 -3
  10. package/SCSS-Themes/buttons/check-box/bootstrap5.scss +5 -3
  11. package/SCSS-Themes/buttons/check-box/fabric-dark.scss +5 -3
  12. package/SCSS-Themes/buttons/check-box/fabric.scss +5 -3
  13. package/SCSS-Themes/buttons/check-box/fluent-dark.scss +5 -3
  14. package/SCSS-Themes/buttons/check-box/fluent.scss +5 -3
  15. package/SCSS-Themes/buttons/check-box/highcontrast.scss +5 -3
  16. package/SCSS-Themes/buttons/check-box/material-dark.scss +5 -3
  17. package/SCSS-Themes/buttons/check-box/material.scss +5 -3
  18. package/SCSS-Themes/buttons/check-box/material3-dark.scss +5 -3
  19. package/SCSS-Themes/buttons/check-box/material3.scss +5 -3
  20. package/SCSS-Themes/buttons/check-box/tailwind-dark.scss +5 -3
  21. package/SCSS-Themes/buttons/check-box/tailwind.scss +5 -3
  22. package/SCSS-Themes/fabric-dark.scss +5 -3
  23. package/SCSS-Themes/fabric.scss +5 -3
  24. package/SCSS-Themes/fluent-dark.scss +5 -3
  25. package/SCSS-Themes/fluent.scss +5 -3
  26. package/SCSS-Themes/highcontrast.scss +5 -3
  27. package/SCSS-Themes/material-dark.scss +5 -3
  28. package/SCSS-Themes/material.scss +5 -3
  29. package/SCSS-Themes/material3-dark.scss +5 -3
  30. package/SCSS-Themes/material3.scss +5 -3
  31. package/SCSS-Themes/tailwind-dark.scss +5 -3
  32. package/SCSS-Themes/tailwind.scss +5 -3
  33. package/package.json +1 -1
@@ -28515,8 +28515,10 @@ $cbox-border-style: solid !default;
28515
28515
 
28516
28516
  &:hover {
28517
28517
  @if $skin-name != 'FluentUI' {
28518
- background-color: $cbox-hover-bgcolor;
28519
- border-color: $cbox-hover-border-color;
28518
+ &.e-check {
28519
+ background-color: $cbox-checkmark-hover-bgcolor;
28520
+ border-color: $cbox-checkmark-hover-border-color;
28521
+ }
28520
28522
  }
28521
28523
  @if $skin-name == 'FluentUI' {
28522
28524
  &:not(.e-check),
@@ -28954,7 +28956,7 @@ $cbox-border-style: solid !default;
28954
28956
  color: $cbox-icon-color;
28955
28957
  }
28956
28958
  }
28957
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
28959
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
28958
28960
  background-color: $cbox-checkmark-hover-bgcolor;
28959
28961
  border-color: $cbox-checkmark-hover-border-color;
28960
28962
  }
@@ -28289,8 +28289,10 @@ $cbox-key-focussed-bgcolor: transparent !default;
28289
28289
 
28290
28290
  &:hover {
28291
28291
  @if $skin-name != 'FluentUI' {
28292
- background-color: $cbox-hover-bgcolor;
28293
- border-color: $cbox-hover-border-color;
28292
+ &.e-check {
28293
+ background-color: $cbox-checkmark-hover-bgcolor;
28294
+ border-color: $cbox-checkmark-hover-border-color;
28295
+ }
28294
28296
  }
28295
28297
  @if $skin-name == 'FluentUI' {
28296
28298
  &:not(.e-check),
@@ -28728,7 +28730,7 @@ $cbox-key-focussed-bgcolor: transparent !default;
28728
28730
  color: $cbox-icon-color;
28729
28731
  }
28730
28732
  }
28731
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
28733
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
28732
28734
  background-color: $cbox-checkmark-hover-bgcolor;
28733
28735
  border-color: $cbox-checkmark-hover-border-color;
28734
28736
  }
@@ -28258,8 +28258,10 @@ $cbox-border-style: solid !default;
28258
28258
 
28259
28259
  &:hover {
28260
28260
  @if $skin-name != 'FluentUI' {
28261
- background-color: $cbox-hover-bgcolor;
28262
- border-color: $cbox-hover-border-color;
28261
+ &.e-check {
28262
+ background-color: $cbox-checkmark-hover-bgcolor;
28263
+ border-color: $cbox-checkmark-hover-border-color;
28264
+ }
28263
28265
  }
28264
28266
  @if $skin-name == 'FluentUI' {
28265
28267
  &:not(.e-check),
@@ -28697,7 +28699,7 @@ $cbox-border-style: solid !default;
28697
28699
  color: $cbox-icon-color;
28698
28700
  }
28699
28701
  }
28700
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
28702
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
28701
28703
  background-color: $cbox-checkmark-hover-bgcolor;
28702
28704
  border-color: $cbox-checkmark-hover-border-color;
28703
28705
  }
@@ -28580,8 +28580,10 @@ $cbox-border-style: solid !default;
28580
28580
 
28581
28581
  &:hover {
28582
28582
  @if $skin-name != 'FluentUI' {
28583
- background-color: $cbox-hover-bgcolor;
28584
- border-color: $cbox-hover-border-color;
28583
+ &.e-check {
28584
+ background-color: $cbox-checkmark-hover-bgcolor;
28585
+ border-color: $cbox-checkmark-hover-border-color;
28586
+ }
28585
28587
  }
28586
28588
  @if $skin-name == 'FluentUI' {
28587
28589
  &:not(.e-check),
@@ -29019,7 +29021,7 @@ $cbox-border-style: solid !default;
29019
29021
  color: $cbox-icon-color;
29020
29022
  }
29021
29023
  }
29022
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
29024
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
29023
29025
  background-color: $cbox-checkmark-hover-bgcolor;
29024
29026
  border-color: $cbox-checkmark-hover-border-color;
29025
29027
  }
@@ -28580,8 +28580,10 @@ $cbox-border-style: solid !default;
28580
28580
 
28581
28581
  &:hover {
28582
28582
  @if $skin-name != 'FluentUI' {
28583
- background-color: $cbox-hover-bgcolor;
28584
- border-color: $cbox-hover-border-color;
28583
+ &.e-check {
28584
+ background-color: $cbox-checkmark-hover-bgcolor;
28585
+ border-color: $cbox-checkmark-hover-border-color;
28586
+ }
28585
28587
  }
28586
28588
  @if $skin-name == 'FluentUI' {
28587
28589
  &:not(.e-check),
@@ -29019,7 +29021,7 @@ $cbox-border-style: solid !default;
29019
29021
  color: $cbox-icon-color;
29020
29022
  }
29021
29023
  }
29022
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
29024
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
29023
29025
  background-color: $cbox-checkmark-hover-bgcolor;
29024
29026
  border-color: $cbox-checkmark-hover-border-color;
29025
29027
  }
@@ -347,8 +347,10 @@ $cbox-border-style: solid !default;
347
347
 
348
348
  &:hover {
349
349
  @if $skin-name != 'FluentUI' {
350
- background-color: $cbox-hover-bgcolor;
351
- border-color: $cbox-hover-border-color;
350
+ &.e-check {
351
+ background-color: $cbox-checkmark-hover-bgcolor;
352
+ border-color: $cbox-checkmark-hover-border-color;
353
+ }
352
354
  }
353
355
  @if $skin-name == 'FluentUI' {
354
356
  &:not(.e-check),
@@ -786,7 +788,7 @@ $cbox-border-style: solid !default;
786
788
  color: $cbox-icon-color;
787
789
  }
788
790
  }
789
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
791
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
790
792
  background-color: $cbox-checkmark-hover-bgcolor;
791
793
  border-color: $cbox-checkmark-hover-border-color;
792
794
  }
@@ -344,8 +344,10 @@ $cbox-key-focussed-bgcolor: transparent !default;
344
344
 
345
345
  &:hover {
346
346
  @if $skin-name != 'FluentUI' {
347
- background-color: $cbox-hover-bgcolor;
348
- border-color: $cbox-hover-border-color;
347
+ &.e-check {
348
+ background-color: $cbox-checkmark-hover-bgcolor;
349
+ border-color: $cbox-checkmark-hover-border-color;
350
+ }
349
351
  }
350
352
  @if $skin-name == 'FluentUI' {
351
353
  &:not(.e-check),
@@ -783,7 +785,7 @@ $cbox-key-focussed-bgcolor: transparent !default;
783
785
  color: $cbox-icon-color;
784
786
  }
785
787
  }
786
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
788
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
787
789
  background-color: $cbox-checkmark-hover-bgcolor;
788
790
  border-color: $cbox-checkmark-hover-border-color;
789
791
  }
@@ -347,8 +347,10 @@ $cbox-border-style: solid !default;
347
347
 
348
348
  &:hover {
349
349
  @if $skin-name != 'FluentUI' {
350
- background-color: $cbox-hover-bgcolor;
351
- border-color: $cbox-hover-border-color;
350
+ &.e-check {
351
+ background-color: $cbox-checkmark-hover-bgcolor;
352
+ border-color: $cbox-checkmark-hover-border-color;
353
+ }
352
354
  }
353
355
  @if $skin-name == 'FluentUI' {
354
356
  &:not(.e-check),
@@ -786,7 +788,7 @@ $cbox-border-style: solid !default;
786
788
  color: $cbox-icon-color;
787
789
  }
788
790
  }
789
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
791
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
790
792
  background-color: $cbox-checkmark-hover-bgcolor;
791
793
  border-color: $cbox-checkmark-hover-border-color;
792
794
  }
@@ -347,8 +347,10 @@ $cbox-border-style: solid !default;
347
347
 
348
348
  &:hover {
349
349
  @if $skin-name != 'FluentUI' {
350
- background-color: $cbox-hover-bgcolor;
351
- border-color: $cbox-hover-border-color;
350
+ &.e-check {
351
+ background-color: $cbox-checkmark-hover-bgcolor;
352
+ border-color: $cbox-checkmark-hover-border-color;
353
+ }
352
354
  }
353
355
  @if $skin-name == 'FluentUI' {
354
356
  &:not(.e-check),
@@ -786,7 +788,7 @@ $cbox-border-style: solid !default;
786
788
  color: $cbox-icon-color;
787
789
  }
788
790
  }
789
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
791
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
790
792
  background-color: $cbox-checkmark-hover-bgcolor;
791
793
  border-color: $cbox-checkmark-hover-border-color;
792
794
  }
@@ -347,8 +347,10 @@ $cbox-border-style: solid !default;
347
347
 
348
348
  &:hover {
349
349
  @if $skin-name != 'FluentUI' {
350
- background-color: $cbox-hover-bgcolor;
351
- border-color: $cbox-hover-border-color;
350
+ &.e-check {
351
+ background-color: $cbox-checkmark-hover-bgcolor;
352
+ border-color: $cbox-checkmark-hover-border-color;
353
+ }
352
354
  }
353
355
  @if $skin-name == 'FluentUI' {
354
356
  &:not(.e-check),
@@ -786,7 +788,7 @@ $cbox-border-style: solid !default;
786
788
  color: $cbox-icon-color;
787
789
  }
788
790
  }
789
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
791
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
790
792
  background-color: $cbox-checkmark-hover-bgcolor;
791
793
  border-color: $cbox-checkmark-hover-border-color;
792
794
  }
@@ -349,8 +349,10 @@ $cbox-ripple-size: -9px !default;
349
349
 
350
350
  &:hover {
351
351
  @if $skin-name != 'FluentUI' {
352
- background-color: $cbox-hover-bgcolor;
353
- border-color: $cbox-hover-border-color;
352
+ &.e-check {
353
+ background-color: $cbox-checkmark-hover-bgcolor;
354
+ border-color: $cbox-checkmark-hover-border-color;
355
+ }
354
356
  }
355
357
  @if $skin-name == 'FluentUI' {
356
358
  &:not(.e-check),
@@ -788,7 +790,7 @@ $cbox-ripple-size: -9px !default;
788
790
  color: $cbox-icon-color;
789
791
  }
790
792
  }
791
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
793
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
792
794
  background-color: $cbox-checkmark-hover-bgcolor;
793
795
  border-color: $cbox-checkmark-hover-border-color;
794
796
  }
@@ -346,8 +346,10 @@ $cbox-checked-ripple-bgcolo: rgba(0, 0, 0, .3) !default;
346
346
 
347
347
  &:hover {
348
348
  @if $skin-name != 'FluentUI' {
349
- background-color: $cbox-hover-bgcolor;
350
- border-color: $cbox-hover-border-color;
349
+ &.e-check {
350
+ background-color: $cbox-checkmark-hover-bgcolor;
351
+ border-color: $cbox-checkmark-hover-border-color;
352
+ }
351
353
  }
352
354
  @if $skin-name == 'FluentUI' {
353
355
  &:not(.e-check),
@@ -785,7 +787,7 @@ $cbox-checked-ripple-bgcolo: rgba(0, 0, 0, .3) !default;
785
787
  color: $cbox-icon-color;
786
788
  }
787
789
  }
788
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
790
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
789
791
  background-color: $cbox-checkmark-hover-bgcolor;
790
792
  border-color: $cbox-checkmark-hover-border-color;
791
793
  }
@@ -351,8 +351,10 @@ $cbox-icon-color: $icon-color !default;
351
351
 
352
352
  &:hover {
353
353
  @if $skin-name != 'FluentUI' {
354
- background-color: $cbox-hover-bgcolor;
355
- border-color: $cbox-hover-border-color;
354
+ &.e-check {
355
+ background-color: $cbox-checkmark-hover-bgcolor;
356
+ border-color: $cbox-checkmark-hover-border-color;
357
+ }
356
358
  }
357
359
  @if $skin-name == 'FluentUI' {
358
360
  &:not(.e-check),
@@ -790,7 +792,7 @@ $cbox-icon-color: $icon-color !default;
790
792
  color: $cbox-icon-color;
791
793
  }
792
794
  }
793
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
795
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
794
796
  background-color: $cbox-checkmark-hover-bgcolor;
795
797
  border-color: $cbox-checkmark-hover-border-color;
796
798
  }
@@ -351,8 +351,10 @@ $cbox-icon-color: $icon-color !default;
351
351
 
352
352
  &:hover {
353
353
  @if $skin-name != 'FluentUI' {
354
- background-color: $cbox-hover-bgcolor;
355
- border-color: $cbox-hover-border-color;
354
+ &.e-check {
355
+ background-color: $cbox-checkmark-hover-bgcolor;
356
+ border-color: $cbox-checkmark-hover-border-color;
357
+ }
356
358
  }
357
359
  @if $skin-name == 'FluentUI' {
358
360
  &:not(.e-check),
@@ -790,7 +792,7 @@ $cbox-icon-color: $icon-color !default;
790
792
  color: $cbox-icon-color;
791
793
  }
792
794
  }
793
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
795
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
794
796
  background-color: $cbox-checkmark-hover-bgcolor;
795
797
  border-color: $cbox-checkmark-hover-border-color;
796
798
  }
@@ -345,8 +345,10 @@ $cbox-checked-ripple-bgcolo: rgba(0, 0, 0, .3) !default;
345
345
 
346
346
  &:hover {
347
347
  @if $skin-name != 'FluentUI' {
348
- background-color: $cbox-hover-bgcolor;
349
- border-color: $cbox-hover-border-color;
348
+ &.e-check {
349
+ background-color: $cbox-checkmark-hover-bgcolor;
350
+ border-color: $cbox-checkmark-hover-border-color;
351
+ }
350
352
  }
351
353
  @if $skin-name == 'FluentUI' {
352
354
  &:not(.e-check),
@@ -784,7 +786,7 @@ $cbox-checked-ripple-bgcolo: rgba(0, 0, 0, .3) !default;
784
786
  color: $cbox-icon-color;
785
787
  }
786
788
  }
787
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
789
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
788
790
  background-color: $cbox-checkmark-hover-bgcolor;
789
791
  border-color: $cbox-checkmark-hover-border-color;
790
792
  }
@@ -350,8 +350,10 @@ $cbox-border-style: solid !default;
350
350
 
351
351
  &:hover {
352
352
  @if $skin-name != 'FluentUI' {
353
- background-color: $cbox-hover-bgcolor;
354
- border-color: $cbox-hover-border-color;
353
+ &.e-check {
354
+ background-color: $cbox-checkmark-hover-bgcolor;
355
+ border-color: $cbox-checkmark-hover-border-color;
356
+ }
355
357
  }
356
358
  @if $skin-name == 'FluentUI' {
357
359
  &:not(.e-check),
@@ -789,7 +791,7 @@ $cbox-border-style: solid !default;
789
791
  color: $cbox-icon-color;
790
792
  }
791
793
  }
792
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
794
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
793
795
  background-color: $cbox-checkmark-hover-bgcolor;
794
796
  border-color: $cbox-checkmark-hover-border-color;
795
797
  }
@@ -346,8 +346,10 @@ $cbox-border-style: solid !default;
346
346
 
347
347
  &:hover {
348
348
  @if $skin-name != 'FluentUI' {
349
- background-color: $cbox-hover-bgcolor;
350
- border-color: $cbox-hover-border-color;
349
+ &.e-check {
350
+ background-color: $cbox-checkmark-hover-bgcolor;
351
+ border-color: $cbox-checkmark-hover-border-color;
352
+ }
351
353
  }
352
354
  @if $skin-name == 'FluentUI' {
353
355
  &:not(.e-check),
@@ -785,7 +787,7 @@ $cbox-border-style: solid !default;
785
787
  color: $cbox-icon-color;
786
788
  }
787
789
  }
788
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
790
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
789
791
  background-color: $cbox-checkmark-hover-bgcolor;
790
792
  border-color: $cbox-checkmark-hover-border-color;
791
793
  }
@@ -347,8 +347,10 @@ $cbox-border-style: solid !default;
347
347
 
348
348
  &:hover {
349
349
  @if $skin-name != 'FluentUI' {
350
- background-color: $cbox-hover-bgcolor;
351
- border-color: $cbox-hover-border-color;
350
+ &.e-check {
351
+ background-color: $cbox-checkmark-hover-bgcolor;
352
+ border-color: $cbox-checkmark-hover-border-color;
353
+ }
352
354
  }
353
355
  @if $skin-name == 'FluentUI' {
354
356
  &:not(.e-check),
@@ -786,7 +788,7 @@ $cbox-border-style: solid !default;
786
788
  color: $cbox-icon-color;
787
789
  }
788
790
  }
789
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
791
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
790
792
  background-color: $cbox-checkmark-hover-bgcolor;
791
793
  border-color: $cbox-checkmark-hover-border-color;
792
794
  }
@@ -347,8 +347,10 @@ $cbox-border-style: solid !default;
347
347
 
348
348
  &:hover {
349
349
  @if $skin-name != 'FluentUI' {
350
- background-color: $cbox-hover-bgcolor;
351
- border-color: $cbox-hover-border-color;
350
+ &.e-check {
351
+ background-color: $cbox-checkmark-hover-bgcolor;
352
+ border-color: $cbox-checkmark-hover-border-color;
353
+ }
352
354
  }
353
355
  @if $skin-name == 'FluentUI' {
354
356
  &:not(.e-check),
@@ -786,7 +788,7 @@ $cbox-border-style: solid !default;
786
788
  color: $cbox-icon-color;
787
789
  }
788
790
  }
789
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
791
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
790
792
  background-color: $cbox-checkmark-hover-bgcolor;
791
793
  border-color: $cbox-checkmark-hover-border-color;
792
794
  }
@@ -347,8 +347,10 @@ $cbox-border-style: solid !default;
347
347
 
348
348
  &:hover {
349
349
  @if $skin-name != 'FluentUI' {
350
- background-color: $cbox-hover-bgcolor;
351
- border-color: $cbox-hover-border-color;
350
+ &.e-check {
351
+ background-color: $cbox-checkmark-hover-bgcolor;
352
+ border-color: $cbox-checkmark-hover-border-color;
353
+ }
352
354
  }
353
355
  @if $skin-name == 'FluentUI' {
354
356
  &:not(.e-check),
@@ -786,7 +788,7 @@ $cbox-border-style: solid !default;
786
788
  color: $cbox-icon-color;
787
789
  }
788
790
  }
789
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
791
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
790
792
  background-color: $cbox-checkmark-hover-bgcolor;
791
793
  border-color: $cbox-checkmark-hover-border-color;
792
794
  }
@@ -347,8 +347,10 @@ $cbox-border-style: solid !default;
347
347
 
348
348
  &:hover {
349
349
  @if $skin-name != 'FluentUI' {
350
- background-color: $cbox-hover-bgcolor;
351
- border-color: $cbox-hover-border-color;
350
+ &.e-check {
351
+ background-color: $cbox-checkmark-hover-bgcolor;
352
+ border-color: $cbox-checkmark-hover-border-color;
353
+ }
352
354
  }
353
355
  @if $skin-name == 'FluentUI' {
354
356
  &:not(.e-check),
@@ -786,7 +788,7 @@ $cbox-border-style: solid !default;
786
788
  color: $cbox-icon-color;
787
789
  }
788
790
  }
789
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
791
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
790
792
  background-color: $cbox-checkmark-hover-bgcolor;
791
793
  border-color: $cbox-checkmark-hover-border-color;
792
794
  }
@@ -28352,8 +28352,10 @@ $cbox-ripple-size: -9px !default;
28352
28352
 
28353
28353
  &:hover {
28354
28354
  @if $skin-name != 'FluentUI' {
28355
- background-color: $cbox-hover-bgcolor;
28356
- border-color: $cbox-hover-border-color;
28355
+ &.e-check {
28356
+ background-color: $cbox-checkmark-hover-bgcolor;
28357
+ border-color: $cbox-checkmark-hover-border-color;
28358
+ }
28357
28359
  }
28358
28360
  @if $skin-name == 'FluentUI' {
28359
28361
  &:not(.e-check),
@@ -28791,7 +28793,7 @@ $cbox-ripple-size: -9px !default;
28791
28793
  color: $cbox-icon-color;
28792
28794
  }
28793
28795
  }
28794
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
28796
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
28795
28797
  background-color: $cbox-checkmark-hover-bgcolor;
28796
28798
  border-color: $cbox-checkmark-hover-border-color;
28797
28799
  }
@@ -28197,8 +28197,10 @@ $cbox-checked-ripple-bgcolo: rgba(0, 0, 0, .3) !default;
28197
28197
 
28198
28198
  &:hover {
28199
28199
  @if $skin-name != 'FluentUI' {
28200
- background-color: $cbox-hover-bgcolor;
28201
- border-color: $cbox-hover-border-color;
28200
+ &.e-check {
28201
+ background-color: $cbox-checkmark-hover-bgcolor;
28202
+ border-color: $cbox-checkmark-hover-border-color;
28203
+ }
28202
28204
  }
28203
28205
  @if $skin-name == 'FluentUI' {
28204
28206
  &:not(.e-check),
@@ -28636,7 +28638,7 @@ $cbox-checked-ripple-bgcolo: rgba(0, 0, 0, .3) !default;
28636
28638
  color: $cbox-icon-color;
28637
28639
  }
28638
28640
  }
28639
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
28641
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
28640
28642
  background-color: $cbox-checkmark-hover-bgcolor;
28641
28643
  border-color: $cbox-checkmark-hover-border-color;
28642
28644
  }
@@ -28646,8 +28646,10 @@ $cbox-icon-color: $icon-color !default;
28646
28646
 
28647
28647
  &:hover {
28648
28648
  @if $skin-name != 'FluentUI' {
28649
- background-color: $cbox-hover-bgcolor;
28650
- border-color: $cbox-hover-border-color;
28649
+ &.e-check {
28650
+ background-color: $cbox-checkmark-hover-bgcolor;
28651
+ border-color: $cbox-checkmark-hover-border-color;
28652
+ }
28651
28653
  }
28652
28654
  @if $skin-name == 'FluentUI' {
28653
28655
  &:not(.e-check),
@@ -29085,7 +29087,7 @@ $cbox-icon-color: $icon-color !default;
29085
29087
  color: $cbox-icon-color;
29086
29088
  }
29087
29089
  }
29088
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
29090
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
29089
29091
  background-color: $cbox-checkmark-hover-bgcolor;
29090
29092
  border-color: $cbox-checkmark-hover-border-color;
29091
29093
  }
@@ -28647,8 +28647,10 @@ $cbox-icon-color: $icon-color !default;
28647
28647
 
28648
28648
  &:hover {
28649
28649
  @if $skin-name != 'FluentUI' {
28650
- background-color: $cbox-hover-bgcolor;
28651
- border-color: $cbox-hover-border-color;
28650
+ &.e-check {
28651
+ background-color: $cbox-checkmark-hover-bgcolor;
28652
+ border-color: $cbox-checkmark-hover-border-color;
28653
+ }
28652
28654
  }
28653
28655
  @if $skin-name == 'FluentUI' {
28654
28656
  &:not(.e-check),
@@ -29086,7 +29088,7 @@ $cbox-icon-color: $icon-color !default;
29086
29088
  color: $cbox-icon-color;
29087
29089
  }
29088
29090
  }
29089
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
29091
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
29090
29092
  background-color: $cbox-checkmark-hover-bgcolor;
29091
29093
  border-color: $cbox-checkmark-hover-border-color;
29092
29094
  }
@@ -28278,8 +28278,10 @@ $cbox-checked-ripple-bgcolo: rgba(0, 0, 0, .3) !default;
28278
28278
 
28279
28279
  &:hover {
28280
28280
  @if $skin-name != 'FluentUI' {
28281
- background-color: $cbox-hover-bgcolor;
28282
- border-color: $cbox-hover-border-color;
28281
+ &.e-check {
28282
+ background-color: $cbox-checkmark-hover-bgcolor;
28283
+ border-color: $cbox-checkmark-hover-border-color;
28284
+ }
28283
28285
  }
28284
28286
  @if $skin-name == 'FluentUI' {
28285
28287
  &:not(.e-check),
@@ -28717,7 +28719,7 @@ $cbox-checked-ripple-bgcolo: rgba(0, 0, 0, .3) !default;
28717
28719
  color: $cbox-icon-color;
28718
28720
  }
28719
28721
  }
28720
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
28722
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
28721
28723
  background-color: $cbox-checkmark-hover-bgcolor;
28722
28724
  border-color: $cbox-checkmark-hover-border-color;
28723
28725
  }
@@ -28725,8 +28725,10 @@ $cbox-border-style: solid !default;
28725
28725
 
28726
28726
  &:hover {
28727
28727
  @if $skin-name != 'FluentUI' {
28728
- background-color: $cbox-hover-bgcolor;
28729
- border-color: $cbox-hover-border-color;
28728
+ &.e-check {
28729
+ background-color: $cbox-checkmark-hover-bgcolor;
28730
+ border-color: $cbox-checkmark-hover-border-color;
28731
+ }
28730
28732
  }
28731
28733
  @if $skin-name == 'FluentUI' {
28732
28734
  &:not(.e-check),
@@ -29164,7 +29166,7 @@ $cbox-border-style: solid !default;
29164
29166
  color: $cbox-icon-color;
29165
29167
  }
29166
29168
  }
29167
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
29169
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
29168
29170
  background-color: $cbox-checkmark-hover-bgcolor;
29169
29171
  border-color: $cbox-checkmark-hover-border-color;
29170
29172
  }
@@ -28522,8 +28522,10 @@ $cbox-border-style: solid !default;
28522
28522
 
28523
28523
  &:hover {
28524
28524
  @if $skin-name != 'FluentUI' {
28525
- background-color: $cbox-hover-bgcolor;
28526
- border-color: $cbox-hover-border-color;
28525
+ &.e-check {
28526
+ background-color: $cbox-checkmark-hover-bgcolor;
28527
+ border-color: $cbox-checkmark-hover-border-color;
28528
+ }
28527
28529
  }
28528
28530
  @if $skin-name == 'FluentUI' {
28529
28531
  &:not(.e-check),
@@ -28961,7 +28963,7 @@ $cbox-border-style: solid !default;
28961
28963
  color: $cbox-icon-color;
28962
28964
  }
28963
28965
  }
28964
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
28966
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
28965
28967
  background-color: $cbox-checkmark-hover-bgcolor;
28966
28968
  border-color: $cbox-checkmark-hover-border-color;
28967
28969
  }
@@ -28914,8 +28914,10 @@ $cbox-border-style: solid !default;
28914
28914
 
28915
28915
  &:hover {
28916
28916
  @if $skin-name != 'FluentUI' {
28917
- background-color: $cbox-hover-bgcolor;
28918
- border-color: $cbox-hover-border-color;
28917
+ &.e-check {
28918
+ background-color: $cbox-checkmark-hover-bgcolor;
28919
+ border-color: $cbox-checkmark-hover-border-color;
28920
+ }
28919
28921
  }
28920
28922
  @if $skin-name == 'FluentUI' {
28921
28923
  &:not(.e-check),
@@ -29353,7 +29355,7 @@ $cbox-border-style: solid !default;
29353
29355
  color: $cbox-icon-color;
29354
29356
  }
29355
29357
  }
29356
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
29358
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
29357
29359
  background-color: $cbox-checkmark-hover-bgcolor;
29358
29360
  border-color: $cbox-checkmark-hover-border-color;
29359
29361
  }
@@ -28996,8 +28996,10 @@ $cbox-border-style: solid !default;
28996
28996
 
28997
28997
  &:hover {
28998
28998
  @if $skin-name != 'FluentUI' {
28999
- background-color: $cbox-hover-bgcolor;
29000
- border-color: $cbox-hover-border-color;
28999
+ &.e-check {
29000
+ background-color: $cbox-checkmark-hover-bgcolor;
29001
+ border-color: $cbox-checkmark-hover-border-color;
29002
+ }
29001
29003
  }
29002
29004
  @if $skin-name == 'FluentUI' {
29003
29005
  &:not(.e-check),
@@ -29435,7 +29437,7 @@ $cbox-border-style: solid !default;
29435
29437
  color: $cbox-icon-color;
29436
29438
  }
29437
29439
  }
29438
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
29440
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
29439
29441
  background-color: $cbox-checkmark-hover-bgcolor;
29440
29442
  border-color: $cbox-checkmark-hover-border-color;
29441
29443
  }
@@ -28529,8 +28529,10 @@ $cbox-border-style: solid !default;
28529
28529
 
28530
28530
  &:hover {
28531
28531
  @if $skin-name != 'FluentUI' {
28532
- background-color: $cbox-hover-bgcolor;
28533
- border-color: $cbox-hover-border-color;
28532
+ &.e-check {
28533
+ background-color: $cbox-checkmark-hover-bgcolor;
28534
+ border-color: $cbox-checkmark-hover-border-color;
28535
+ }
28534
28536
  }
28535
28537
  @if $skin-name == 'FluentUI' {
28536
28538
  &:not(.e-check),
@@ -28968,7 +28970,7 @@ $cbox-border-style: solid !default;
28968
28970
  color: $cbox-icon-color;
28969
28971
  }
28970
28972
  }
28971
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
28973
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
28972
28974
  background-color: $cbox-checkmark-hover-bgcolor;
28973
28975
  border-color: $cbox-checkmark-hover-border-color;
28974
28976
  }
@@ -28526,8 +28526,10 @@ $cbox-border-style: solid !default;
28526
28526
 
28527
28527
  &:hover {
28528
28528
  @if $skin-name != 'FluentUI' {
28529
- background-color: $cbox-hover-bgcolor;
28530
- border-color: $cbox-hover-border-color;
28529
+ &.e-check {
28530
+ background-color: $cbox-checkmark-hover-bgcolor;
28531
+ border-color: $cbox-checkmark-hover-border-color;
28532
+ }
28531
28533
  }
28532
28534
  @if $skin-name == 'FluentUI' {
28533
28535
  &:not(.e-check),
@@ -28965,7 +28967,7 @@ $cbox-border-style: solid !default;
28965
28967
  color: $cbox-icon-color;
28966
28968
  }
28967
28969
  }
28968
- @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
28970
+ @if $skin-name == 'bootstrap4' or $skin-name == 'tailwind' {
28969
28971
  background-color: $cbox-checkmark-hover-bgcolor;
28970
28972
  border-color: $cbox-checkmark-hover-border-color;
28971
28973
  }
package/package.json CHANGED
@@ -1 +1 @@
1
- {"name":"@syncfusion/blazor-themes","version":"22.2.7","description":"This package contains the individual component wise SCSS files and single SCSS files for Syncfusion Blazor components.","author":"Syncfusion Inc.","license":"SEE LICENSE IN license","keywords":["Blazor","Blazor Themes","Syncfusion","Syncfusion Blazor","Web components","Themes","Individual Themes","Combined Themes","Syncfusion Blazor SCSS"],"repository":{"type":"git","url":"git@github.com/syncfusion/blazor-samples"}}
1
+ {"name":"@syncfusion/blazor-themes","version":"22.2.8","description":"This package contains the individual component wise SCSS files and single SCSS files for Syncfusion Blazor components.","author":"Syncfusion Inc.","license":"SEE LICENSE IN license","keywords":["Blazor","Blazor Themes","Syncfusion","Syncfusion Blazor","Web components","Themes","Individual Themes","Combined Themes","Syncfusion Blazor SCSS"],"repository":{"type":"git","url":"git@github.com/syncfusion/blazor-samples"}}