@syncfusion/blazor-themes 24.1.41 → 24.1.44

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 (117) hide show
  1. package/SCSS-Themes/bootstrap-dark.scss +89 -9
  2. package/SCSS-Themes/bootstrap.scss +89 -9
  3. package/SCSS-Themes/bootstrap4.scss +89 -9
  4. package/SCSS-Themes/bootstrap5-dark.scss +89 -9
  5. package/SCSS-Themes/bootstrap5.scss +89 -9
  6. package/SCSS-Themes/buttons/button/bootstrap-dark.scss +52 -0
  7. package/SCSS-Themes/buttons/button/bootstrap.scss +52 -0
  8. package/SCSS-Themes/buttons/button/bootstrap4.scss +52 -0
  9. package/SCSS-Themes/buttons/button/bootstrap5-dark.scss +52 -0
  10. package/SCSS-Themes/buttons/button/bootstrap5.scss +52 -0
  11. package/SCSS-Themes/buttons/button/fabric-dark.scss +52 -0
  12. package/SCSS-Themes/buttons/button/fabric.scss +52 -0
  13. package/SCSS-Themes/buttons/button/fluent-dark.scss +52 -0
  14. package/SCSS-Themes/buttons/button/fluent.scss +52 -0
  15. package/SCSS-Themes/buttons/button/highcontrast.scss +52 -0
  16. package/SCSS-Themes/buttons/button/material-dark.scss +52 -0
  17. package/SCSS-Themes/buttons/button/material.scss +52 -0
  18. package/SCSS-Themes/buttons/button/material3-dark.scss +52 -0
  19. package/SCSS-Themes/buttons/button/material3.scss +52 -0
  20. package/SCSS-Themes/buttons/button/tailwind-dark.scss +52 -0
  21. package/SCSS-Themes/buttons/button/tailwind.scss +52 -0
  22. package/SCSS-Themes/dropdowns/drop-down-base/bootstrap-dark.scss +0 -3
  23. package/SCSS-Themes/dropdowns/drop-down-base/bootstrap.scss +0 -3
  24. package/SCSS-Themes/dropdowns/drop-down-base/bootstrap4.scss +0 -3
  25. package/SCSS-Themes/dropdowns/drop-down-base/bootstrap5-dark.scss +0 -3
  26. package/SCSS-Themes/dropdowns/drop-down-base/bootstrap5.scss +0 -3
  27. package/SCSS-Themes/dropdowns/drop-down-base/fabric-dark.scss +0 -3
  28. package/SCSS-Themes/dropdowns/drop-down-base/fabric.scss +0 -3
  29. package/SCSS-Themes/dropdowns/drop-down-base/fluent-dark.scss +0 -3
  30. package/SCSS-Themes/dropdowns/drop-down-base/fluent.scss +0 -3
  31. package/SCSS-Themes/dropdowns/drop-down-base/highcontrast.scss +0 -3
  32. package/SCSS-Themes/dropdowns/drop-down-base/material-dark.scss +0 -3
  33. package/SCSS-Themes/dropdowns/drop-down-base/material.scss +0 -3
  34. package/SCSS-Themes/dropdowns/drop-down-base/material3-dark.scss +0 -3
  35. package/SCSS-Themes/dropdowns/drop-down-base/material3.scss +0 -3
  36. package/SCSS-Themes/dropdowns/drop-down-base/tailwind-dark.scss +0 -3
  37. package/SCSS-Themes/dropdowns/drop-down-base/tailwind.scss +0 -3
  38. package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap-dark.scss +5 -0
  39. package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap.scss +5 -0
  40. package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap4.scss +5 -0
  41. package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap5-dark.scss +5 -0
  42. package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap5.scss +5 -0
  43. package/SCSS-Themes/dropdowns/drop-down-tree/fabric-dark.scss +5 -0
  44. package/SCSS-Themes/dropdowns/drop-down-tree/fabric.scss +5 -0
  45. package/SCSS-Themes/dropdowns/drop-down-tree/fluent-dark.scss +5 -0
  46. package/SCSS-Themes/dropdowns/drop-down-tree/fluent.scss +5 -0
  47. package/SCSS-Themes/dropdowns/drop-down-tree/highcontrast.scss +5 -0
  48. package/SCSS-Themes/dropdowns/drop-down-tree/material-dark.scss +5 -0
  49. package/SCSS-Themes/dropdowns/drop-down-tree/material.scss +5 -0
  50. package/SCSS-Themes/dropdowns/drop-down-tree/material3-dark.scss +5 -0
  51. package/SCSS-Themes/dropdowns/drop-down-tree/material3.scss +5 -0
  52. package/SCSS-Themes/dropdowns/drop-down-tree/tailwind-dark.scss +5 -0
  53. package/SCSS-Themes/dropdowns/drop-down-tree/tailwind.scss +5 -0
  54. package/SCSS-Themes/fabric-dark.scss +89 -9
  55. package/SCSS-Themes/fabric.scss +89 -9
  56. package/SCSS-Themes/fluent-dark.scss +90 -10
  57. package/SCSS-Themes/fluent.scss +90 -10
  58. package/SCSS-Themes/grids/grid/bootstrap-dark.scss +9 -0
  59. package/SCSS-Themes/grids/grid/bootstrap.scss +9 -0
  60. package/SCSS-Themes/grids/grid/bootstrap4.scss +9 -0
  61. package/SCSS-Themes/grids/grid/bootstrap5-dark.scss +9 -0
  62. package/SCSS-Themes/grids/grid/bootstrap5.scss +9 -0
  63. package/SCSS-Themes/grids/grid/fabric-dark.scss +9 -0
  64. package/SCSS-Themes/grids/grid/fabric.scss +9 -0
  65. package/SCSS-Themes/grids/grid/fluent-dark.scss +9 -0
  66. package/SCSS-Themes/grids/grid/fluent.scss +9 -0
  67. package/SCSS-Themes/grids/grid/highcontrast.scss +9 -0
  68. package/SCSS-Themes/grids/grid/material-dark.scss +10 -1
  69. package/SCSS-Themes/grids/grid/material.scss +9 -0
  70. package/SCSS-Themes/grids/grid/material3-dark.scss +9 -0
  71. package/SCSS-Themes/grids/grid/material3.scss +9 -0
  72. package/SCSS-Themes/grids/grid/tailwind-dark.scss +9 -0
  73. package/SCSS-Themes/grids/grid/tailwind.scss +9 -0
  74. package/SCSS-Themes/highcontrast.scss +89 -9
  75. package/SCSS-Themes/image-editor/image-editor/bootstrap-dark.scss +9 -6
  76. package/SCSS-Themes/image-editor/image-editor/bootstrap.scss +9 -6
  77. package/SCSS-Themes/image-editor/image-editor/bootstrap4.scss +9 -6
  78. package/SCSS-Themes/image-editor/image-editor/bootstrap5-dark.scss +9 -6
  79. package/SCSS-Themes/image-editor/image-editor/bootstrap5.scss +9 -6
  80. package/SCSS-Themes/image-editor/image-editor/fabric-dark.scss +9 -6
  81. package/SCSS-Themes/image-editor/image-editor/fabric.scss +9 -6
  82. package/SCSS-Themes/image-editor/image-editor/fluent-dark.scss +9 -6
  83. package/SCSS-Themes/image-editor/image-editor/fluent.scss +9 -6
  84. package/SCSS-Themes/image-editor/image-editor/highcontrast.scss +9 -6
  85. package/SCSS-Themes/image-editor/image-editor/material-dark.scss +9 -6
  86. package/SCSS-Themes/image-editor/image-editor/material.scss +9 -6
  87. package/SCSS-Themes/image-editor/image-editor/material3-dark.scss +9 -6
  88. package/SCSS-Themes/image-editor/image-editor/material3.scss +9 -6
  89. package/SCSS-Themes/image-editor/image-editor/tailwind-dark.scss +9 -6
  90. package/SCSS-Themes/image-editor/image-editor/tailwind.scss +9 -6
  91. package/SCSS-Themes/inputs/data-form/material3-dark.scss +1 -1
  92. package/SCSS-Themes/inputs/data-form/material3.scss +1 -1
  93. package/SCSS-Themes/material-dark.scss +90 -10
  94. package/SCSS-Themes/material.scss +89 -9
  95. package/SCSS-Themes/material3-dark.scss +90 -10
  96. package/SCSS-Themes/material3.scss +90 -10
  97. package/SCSS-Themes/pdfviewer/pdfviewer/fluent-dark.scss +1 -1
  98. package/SCSS-Themes/pdfviewer/pdfviewer/fluent.scss +1 -1
  99. package/SCSS-Themes/splitbuttons/progress-button/bootstrap-dark.scss +14 -0
  100. package/SCSS-Themes/splitbuttons/progress-button/bootstrap.scss +14 -0
  101. package/SCSS-Themes/splitbuttons/progress-button/bootstrap4.scss +14 -0
  102. package/SCSS-Themes/splitbuttons/progress-button/bootstrap5-dark.scss +14 -0
  103. package/SCSS-Themes/splitbuttons/progress-button/bootstrap5.scss +14 -0
  104. package/SCSS-Themes/splitbuttons/progress-button/fabric-dark.scss +14 -0
  105. package/SCSS-Themes/splitbuttons/progress-button/fabric.scss +14 -0
  106. package/SCSS-Themes/splitbuttons/progress-button/fluent-dark.scss +14 -0
  107. package/SCSS-Themes/splitbuttons/progress-button/fluent.scss +14 -0
  108. package/SCSS-Themes/splitbuttons/progress-button/highcontrast.scss +14 -0
  109. package/SCSS-Themes/splitbuttons/progress-button/material-dark.scss +14 -0
  110. package/SCSS-Themes/splitbuttons/progress-button/material.scss +14 -0
  111. package/SCSS-Themes/splitbuttons/progress-button/material3-dark.scss +14 -0
  112. package/SCSS-Themes/splitbuttons/progress-button/material3.scss +14 -0
  113. package/SCSS-Themes/splitbuttons/progress-button/tailwind-dark.scss +14 -0
  114. package/SCSS-Themes/splitbuttons/progress-button/tailwind.scss +14 -0
  115. package/SCSS-Themes/tailwind-dark.scss +89 -9
  116. package/SCSS-Themes/tailwind.scss +89 -9
  117. package/package.json +1 -1
@@ -5800,7 +5800,7 @@ $pv-comment-text-cursor-color: $black !default;
5800
5800
  }
5801
5801
 
5802
5802
  .e-pv-search-close::before {
5803
- content: '\e754';
5803
+ content: '\e7e7';
5804
5804
  font-family: 'e-icons';
5805
5805
  }
5806
5806
 
@@ -1066,3 +1066,17 @@ $btn-flat-primary-path-arc: none;
1066
1066
  }
1067
1067
  }
1068
1068
 
1069
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
1070
+ fill: $btn-outline-color;
1071
+ stroke: $btn-outline-color;
1072
+ }
1073
+
1074
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
1075
+ fill: $btn-color;
1076
+ stroke: $btn-color;
1077
+ }
1078
+
1079
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
1080
+ stroke: $btn-outline-color;
1081
+ }
1082
+
@@ -1063,3 +1063,17 @@ $btn-flat-primary-path-arc: none;
1063
1063
  }
1064
1064
  }
1065
1065
 
1066
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
1067
+ fill: $btn-outline-color;
1068
+ stroke: $btn-outline-color;
1069
+ }
1070
+
1071
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
1072
+ fill: $btn-color;
1073
+ stroke: $btn-color;
1074
+ }
1075
+
1076
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
1077
+ stroke: $btn-outline-color;
1078
+ }
1079
+
@@ -1063,3 +1063,17 @@ $btn-flat-primary-path-arc: none;
1063
1063
  }
1064
1064
  }
1065
1065
 
1066
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
1067
+ fill: $btn-outline-color;
1068
+ stroke: $btn-outline-color;
1069
+ }
1070
+
1071
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
1072
+ fill: $btn-color;
1073
+ stroke: $btn-color;
1074
+ }
1075
+
1076
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
1077
+ stroke: $btn-outline-color;
1078
+ }
1079
+
@@ -1060,3 +1060,17 @@ $btn-flat-primary-path-arc: $white;
1060
1060
  }
1061
1061
  }
1062
1062
 
1063
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
1064
+ fill: $btn-outline-color;
1065
+ stroke: $btn-outline-color;
1066
+ }
1067
+
1068
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
1069
+ fill: $btn-color;
1070
+ stroke: $btn-color;
1071
+ }
1072
+
1073
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
1074
+ stroke: $btn-outline-color;
1075
+ }
1076
+
@@ -1060,3 +1060,17 @@ $btn-flat-primary-path-arc: $white;
1060
1060
  }
1061
1061
  }
1062
1062
 
1063
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
1064
+ fill: $btn-outline-color;
1065
+ stroke: $btn-outline-color;
1066
+ }
1067
+
1068
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
1069
+ fill: $btn-color;
1070
+ stroke: $btn-color;
1071
+ }
1072
+
1073
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
1074
+ stroke: $btn-outline-color;
1075
+ }
1076
+
@@ -1066,3 +1066,17 @@ $btn-flat-primary-path-arc: none;
1066
1066
  }
1067
1067
  }
1068
1068
 
1069
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
1070
+ fill: $btn-outline-color;
1071
+ stroke: $btn-outline-color;
1072
+ }
1073
+
1074
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
1075
+ fill: $btn-color;
1076
+ stroke: $btn-color;
1077
+ }
1078
+
1079
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
1080
+ stroke: $btn-outline-color;
1081
+ }
1082
+
@@ -1063,3 +1063,17 @@ $btn-flat-primary-path-arc: none;
1063
1063
  }
1064
1064
  }
1065
1065
 
1066
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
1067
+ fill: $btn-outline-color;
1068
+ stroke: $btn-outline-color;
1069
+ }
1070
+
1071
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
1072
+ fill: $btn-color;
1073
+ stroke: $btn-color;
1074
+ }
1075
+
1076
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
1077
+ stroke: $btn-outline-color;
1078
+ }
1079
+
@@ -1060,3 +1060,17 @@ $btn-flat-primary-path-arc: $white;
1060
1060
  }
1061
1061
  }
1062
1062
 
1063
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
1064
+ fill: $btn-outline-color;
1065
+ stroke: $btn-outline-color;
1066
+ }
1067
+
1068
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
1069
+ fill: $btn-color;
1070
+ stroke: $btn-color;
1071
+ }
1072
+
1073
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
1074
+ stroke: $btn-outline-color;
1075
+ }
1076
+
@@ -1060,3 +1060,17 @@ $btn-flat-primary-path-arc: $white;
1060
1060
  }
1061
1061
  }
1062
1062
 
1063
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
1064
+ fill: $btn-outline-color;
1065
+ stroke: $btn-outline-color;
1066
+ }
1067
+
1068
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
1069
+ fill: $btn-color;
1070
+ stroke: $btn-color;
1071
+ }
1072
+
1073
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
1074
+ stroke: $btn-outline-color;
1075
+ }
1076
+
@@ -1063,3 +1063,17 @@ $btn-flat-primary-path-arc: none;
1063
1063
  }
1064
1064
  }
1065
1065
 
1066
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
1067
+ fill: $btn-outline-color;
1068
+ stroke: $btn-outline-color;
1069
+ }
1070
+
1071
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
1072
+ fill: $btn-color;
1073
+ stroke: $btn-color;
1074
+ }
1075
+
1076
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
1077
+ stroke: $btn-outline-color;
1078
+ }
1079
+
@@ -1066,3 +1066,17 @@ $btn-flat-primary-path-arc: none;
1066
1066
  }
1067
1067
  }
1068
1068
 
1069
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
1070
+ fill: $btn-outline-color;
1071
+ stroke: $btn-outline-color;
1072
+ }
1073
+
1074
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
1075
+ fill: $btn-color;
1076
+ stroke: $btn-color;
1077
+ }
1078
+
1079
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
1080
+ stroke: $btn-outline-color;
1081
+ }
1082
+
@@ -1063,3 +1063,17 @@ $btn-flat-primary-path-arc: none;
1063
1063
  }
1064
1064
  }
1065
1065
 
1066
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
1067
+ fill: $btn-outline-color;
1068
+ stroke: $btn-outline-color;
1069
+ }
1070
+
1071
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
1072
+ fill: $btn-color;
1073
+ stroke: $btn-color;
1074
+ }
1075
+
1076
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
1077
+ stroke: $btn-outline-color;
1078
+ }
1079
+
@@ -1064,3 +1064,17 @@ $btn-flat-primary-path-arc: rgba($white);
1064
1064
  }
1065
1065
  }
1066
1066
 
1067
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
1068
+ fill: $btn-outline-color;
1069
+ stroke: $btn-outline-color;
1070
+ }
1071
+
1072
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
1073
+ fill: $btn-color;
1074
+ stroke: $btn-color;
1075
+ }
1076
+
1077
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
1078
+ stroke: $btn-outline-color;
1079
+ }
1080
+
@@ -1064,3 +1064,17 @@ $btn-flat-primary-path-arc: rgba($white);
1064
1064
  }
1065
1065
  }
1066
1066
 
1067
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
1068
+ fill: $btn-outline-color;
1069
+ stroke: $btn-outline-color;
1070
+ }
1071
+
1072
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
1073
+ fill: $btn-color;
1074
+ stroke: $btn-color;
1075
+ }
1076
+
1077
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
1078
+ stroke: $btn-outline-color;
1079
+ }
1080
+
@@ -1060,3 +1060,17 @@ $btn-flat-primary-path-arc: $white;
1060
1060
  }
1061
1061
  }
1062
1062
 
1063
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
1064
+ fill: $btn-outline-color;
1065
+ stroke: $btn-outline-color;
1066
+ }
1067
+
1068
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
1069
+ fill: $btn-color;
1070
+ stroke: $btn-color;
1071
+ }
1072
+
1073
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
1074
+ stroke: $btn-outline-color;
1075
+ }
1076
+
@@ -1060,3 +1060,17 @@ $btn-flat-primary-path-arc: $white;
1060
1060
  }
1061
1061
  }
1062
1062
 
1063
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
1064
+ fill: $btn-outline-color;
1065
+ stroke: $btn-outline-color;
1066
+ }
1067
+
1068
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
1069
+ fill: $btn-color;
1070
+ stroke: $btn-color;
1071
+ }
1072
+
1073
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
1074
+ stroke: $btn-outline-color;
1075
+ }
1076
+
@@ -19711,9 +19711,6 @@ $ddl-group-list-item-text-intent: 0 !default;
19711
19711
  #{if(&, '&', '*')} .e-fixed-head {
19712
19712
  position: absolute;
19713
19713
  top: 0;
19714
- .e-rtl #{if(&, '&', '*')} {
19715
- left: 33px;
19716
- }
19717
19714
  }
19718
19715
  }
19719
19716
  }
@@ -24465,12 +24462,22 @@ $btn-focus-box-shadow: $shadow-focus-ring2 !default;
24465
24462
  @if $skin-name == 'FluentUI' {
24466
24463
  outline: none !important; /* stylelint-disable-line declaration-no-important */
24467
24464
  }
24465
+
24466
+ @if $skin-name == 'bootstrap5' {
24467
+ background: $btn-outline-active-bgcolor;
24468
+ color: $btn-outline-active-color;
24469
+ }
24468
24470
  }
24469
24471
 
24470
24472
  &:focus-visible { // only for keybord
24471
24473
  @if $skin-name == 'FluentUI' {
24472
24474
  background: $btn-outline-bgcolor;
24473
24475
  }
24476
+
24477
+ @if $skin-name == 'bootstrap5' {
24478
+ box-shadow: $btn-focus-box-shadow;
24479
+ }
24480
+
24474
24481
  @if $skin-name == 'Material3' {
24475
24482
  background: $btn-active-bgcolor;
24476
24483
  box-shadow: $btn-keyboard-focus-box-shadow;
@@ -24521,12 +24528,22 @@ $btn-focus-box-shadow: $shadow-focus-ring2 !default;
24521
24528
  @if $skin-name == 'FluentUI' {
24522
24529
  outline: none !important; /* stylelint-disable-line declaration-no-important */
24523
24530
  }
24531
+
24532
+ @if $skin-name == 'bootstrap5' {
24533
+ background: $btn-outline-primary-focus-bgcolor;
24534
+ color: $btn-outline-active-color;
24535
+ }
24524
24536
  }
24525
24537
 
24526
24538
  &:focus-visible { // only for keybord
24527
24539
  @if $skin-name == 'FluentUI' {
24528
24540
  background: $btn-outline-bgcolor;
24529
24541
  }
24542
+
24543
+ @if $skin-name == 'bootstrap5' {
24544
+ box-shadow: $btn-primary-focus-box-shadow;
24545
+ }
24546
+
24530
24547
  @if $skin-name == 'Material3' {
24531
24548
  background: $btn-primary-active-bgcolor;
24532
24549
  box-shadow: $btn-keyboard-focus-box-shadow;
@@ -24584,12 +24601,20 @@ $btn-focus-box-shadow: $shadow-focus-ring2 !default;
24584
24601
  @if $skin-name == 'FluentUI' {
24585
24602
  outline: none !important; /* stylelint-disable-line declaration-no-important */
24586
24603
  }
24604
+
24605
+ @if $skin-name == 'bootstrap5' {
24606
+ background: $btn-success-bgcolor;
24607
+ color: $btn-success-color;
24608
+ }
24587
24609
  }
24588
24610
 
24589
24611
  &:focus-visible { // only for keybord
24590
24612
  @if $skin-name == 'FluentUI' {
24591
24613
  background: $btn-outline-bgcolor;
24592
24614
  }
24615
+ @if $skin-name == 'bootstrap5' {
24616
+ box-shadow: $btn-success-focus-box-shadow;
24617
+ }
24593
24618
  @if $skin-name == 'Material3' {
24594
24619
  background: $btn-success-active-bgcolor;
24595
24620
  box-shadow: $btn-keyboard-focus-box-shadow;
@@ -24647,12 +24672,20 @@ $btn-focus-box-shadow: $shadow-focus-ring2 !default;
24647
24672
  @if $skin-name == 'FluentUI' {
24648
24673
  outline: none !important; /* stylelint-disable-line declaration-no-important */
24649
24674
  }
24675
+
24676
+ @if $skin-name == 'bootstrap5' {
24677
+ background: $btn-info-bgcolor;
24678
+ color: $btn-info-color;
24679
+ }
24650
24680
  }
24651
24681
 
24652
24682
  &:focus-visible { // only for keybord
24653
24683
  @if $skin-name == 'FluentUI' {
24654
24684
  background: $btn-outline-bgcolor;
24655
24685
  }
24686
+ @if $skin-name == 'bootstrap5' {
24687
+ box-shadow: $btn-info-focus-box-shadow;
24688
+ }
24656
24689
  @if $skin-name == 'Material3' {
24657
24690
  background: $btn-info-active-bgcolor;
24658
24691
  box-shadow: $btn-keyboard-focus-box-shadow;
@@ -24710,12 +24743,20 @@ $btn-focus-box-shadow: $shadow-focus-ring2 !default;
24710
24743
  @if $skin-name == 'FluentUI' {
24711
24744
  outline: none !important; /* stylelint-disable-line declaration-no-important */
24712
24745
  }
24746
+
24747
+ @if $skin-name == 'bootstrap5' {
24748
+ background: $btn-warning-bgcolor;
24749
+ color: $btn-warning-color;
24750
+ }
24713
24751
  }
24714
24752
 
24715
24753
  &:focus-visible { // only for keybord
24716
24754
  @if $skin-name == 'FluentUI' {
24717
24755
  background: $btn-outline-bgcolor;
24718
24756
  }
24757
+ @if $skin-name == 'bootstrap5' {
24758
+ box-shadow: $btn-warning-focus-box-shadow;
24759
+ }
24719
24760
  @if $skin-name == 'Material3' {
24720
24761
  background: $btn-warning-active-bgcolor;
24721
24762
  box-shadow: $btn-keyboard-focus-box-shadow;
@@ -24773,12 +24814,20 @@ $btn-focus-box-shadow: $shadow-focus-ring2 !default;
24773
24814
  @if $skin-name == 'FluentUI' {
24774
24815
  outline: none !important; /* stylelint-disable-line declaration-no-important */
24775
24816
  }
24817
+
24818
+ @if $skin-name == 'bootstrap5' {
24819
+ background: $btn-danger-bgcolor;
24820
+ color: $btn-danger-color;
24821
+ }
24776
24822
  }
24777
24823
 
24778
24824
  &:focus-visible { // only for keybord
24779
24825
  @if $skin-name == 'FluentUI' {
24780
24826
  background: $btn-outline-bgcolor;
24781
24827
  }
24828
+ @if $skin-name == 'bootstrap5' {
24829
+ box-shadow: $btn-danger-focus-box-shadow;
24830
+ }
24782
24831
  @if $skin-name == 'Material3' {
24783
24832
  background: $btn-danger-active-bgcolor;
24784
24833
  box-shadow: $btn-keyboard-focus-box-shadow;
@@ -59135,6 +59184,11 @@ $ddt-remains-font-color: $content-text-color-alt3 !default;
59135
59184
  }
59136
59185
  }
59137
59186
 
59187
+ &.e-input-group.e-control-wrapper.e-valid-input:hover:not(.e-disabled) .e-clear-icon,
59188
+ &.e-float-input.e-control-wrapper.e-valid-input:hover:not(.e-disabled) .e-clear-icon {
59189
+ display: flex;
59190
+ }
59191
+
59138
59192
  .e-chips-wrapper {
59139
59193
  width: 100%;
59140
59194
  }
@@ -82956,6 +83010,15 @@ margin: $grid-group-animator-cell-margin;
82956
83010
  color: $grid-cell-selection-color;
82957
83011
  }
82958
83012
 
83013
+ td.e-cellselectionbackground.e-leftfreeze:not(.e-updatedtd),
83014
+ td.e-cellselectionbackground.e-unfreeze:not(.e-updatedtd),
83015
+ td.e-cellselectionbackground.e-rightfreeze:not(.e-updatedtd),
83016
+ td.e-cellselectionbackground.e-fixedfreeze:not(.e-updatedtd) {
83017
+ @if $grid-skin == 'material3' {
83018
+ background-color: rgba($primary-container, 1);
83019
+ }
83020
+ }
83021
+
82959
83022
  .e-filterbarcell,
82960
83023
  .e-filterbarcelldisabled {
82961
83024
  background-color: $grid-header-bg-color;
@@ -89315,6 +89378,20 @@ $btn-flat-primary-path-arc: $white;
89315
89378
  }
89316
89379
  }
89317
89380
 
89381
+ .e-progress-btn.e-outline .e-spinner-pane .e-spinner-inner svg {
89382
+ fill: $btn-outline-color;
89383
+ stroke: $btn-outline-color;
89384
+ }
89385
+
89386
+ .e-progress-btn.e-outline:focus .e-spinner-pane .e-spinner-inner svg {
89387
+ fill: $btn-color;
89388
+ stroke: $btn-color;
89389
+ }
89390
+
89391
+ .e-progress-btn.e-outline.e-success .e-spinner-pane .e-spinner-inner svg .e-path-arc {
89392
+ stroke: $btn-outline-color;
89393
+ }
89394
+
89318
89395
 
89319
89396
 
89320
89397
 
@@ -121684,18 +121761,17 @@ $image-editor-device-slider-handler: calc(50% - 9px) !default;
121684
121761
  }
121685
121762
  }
121686
121763
  .e-ie-straighten-value-span,
121687
- .e-ie-straighten-span {
121688
- font-size: 14px;
121764
+ .e-ie-straighten-span,
121765
+ .e-ie-toolbar-straighten {
121766
+ font-size: 14px !important; /* stylelint-disable-line declaration-no-important */
121689
121767
  padding-left: 10px !important; /* stylelint-disable-line declaration-no-important */
121690
121768
  padding-right: 10px !important; /* stylelint-disable-line declaration-no-important */
121691
121769
  }
121692
121770
 
121693
121771
  .e-straighten .e-control-wrapper.e-slider-container.e-horizontal {
121694
121772
  height: auto;
121695
- @if $skin-name == 'Material3' {
121696
- margin-left: 8px;
121697
- padding-right: 2px;
121698
- }
121773
+ margin-left: 8px;
121774
+ padding-right: 2px;
121699
121775
  }
121700
121776
 
121701
121777
  .e-straighten .e-control-wrapper.e-slider-container.e-horizontal .e-slider {
@@ -121715,6 +121791,10 @@ $image-editor-device-slider-handler: calc(50% - 9px) !default;
121715
121791
  }
121716
121792
  }
121717
121793
 
121794
+ .e-ie-finetune-value-span {
121795
+ top: 26% !important; /* stylelint-disable-line declaration-no-important */
121796
+ }
121797
+
121718
121798
  .e-bigger .e-straighten .e-control-wrapper.e-slider-container .e-slider .e-handle {
121719
121799
  @if $skin-name == 'Material3' {
121720
121800
  height: 22px !important; /* stylelint-disable-line declaration-no-important */