@syncfusion/blazor-themes 31.1.19 → 31.1.20

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 (205) hide show
  1. package/Compiled-Themes/bds-dark-lite.css +5 -5
  2. package/Compiled-Themes/bds-dark.css +5 -5
  3. package/Compiled-Themes/bds-lite.css +5 -5
  4. package/Compiled-Themes/bds.css +5 -5
  5. package/Compiled-Themes/bootstrap-dark-lite.css +4 -2
  6. package/Compiled-Themes/bootstrap-dark.css +4 -2
  7. package/Compiled-Themes/bootstrap-lite.css +4 -2
  8. package/Compiled-Themes/bootstrap.css +4 -2
  9. package/Compiled-Themes/bootstrap4-lite.css +11 -8
  10. package/Compiled-Themes/bootstrap4.css +22 -12
  11. package/Compiled-Themes/bootstrap5-dark-lite.css +15 -13
  12. package/Compiled-Themes/bootstrap5-dark.css +31 -20
  13. package/Compiled-Themes/bootstrap5-lite.css +15 -13
  14. package/Compiled-Themes/bootstrap5.3-dark-lite.css +34 -20
  15. package/Compiled-Themes/bootstrap5.3-dark.css +51 -28
  16. package/Compiled-Themes/bootstrap5.3-lite.css +34 -20
  17. package/Compiled-Themes/bootstrap5.3.css +51 -28
  18. package/Compiled-Themes/bootstrap5.css +31 -20
  19. package/Compiled-Themes/fabric-dark-lite.css +4 -2
  20. package/Compiled-Themes/fabric-dark.css +4 -2
  21. package/Compiled-Themes/fabric-lite.css +4 -2
  22. package/Compiled-Themes/fabric.css +4 -2
  23. package/Compiled-Themes/fluent-dark-lite.css +13 -10
  24. package/Compiled-Themes/fluent-dark.css +23 -13
  25. package/Compiled-Themes/fluent-lite.css +13 -10
  26. package/Compiled-Themes/fluent.css +23 -13
  27. package/Compiled-Themes/fluent2-dark-lite.css +7 -5
  28. package/Compiled-Themes/fluent2-dark.css +8 -6
  29. package/Compiled-Themes/fluent2-highcontrast-lite.css +10 -5
  30. package/Compiled-Themes/fluent2-highcontrast.css +11 -6
  31. package/Compiled-Themes/fluent2-lite.css +7 -5
  32. package/Compiled-Themes/fluent2.css +8 -6
  33. package/Compiled-Themes/highcontrast-lite.css +12 -9
  34. package/Compiled-Themes/highcontrast.css +24 -12
  35. package/Compiled-Themes/material-dark-lite.css +17 -12
  36. package/Compiled-Themes/material-dark.css +37 -16
  37. package/Compiled-Themes/material-lite.css +17 -9
  38. package/Compiled-Themes/material.css +34 -12
  39. package/Compiled-Themes/material3-dark-lite.css +5 -6
  40. package/Compiled-Themes/material3-dark.css +6 -6
  41. package/Compiled-Themes/material3-lite.css +5 -6
  42. package/Compiled-Themes/material3.css +6 -6
  43. package/Compiled-Themes/tailwind-dark-lite.css +4 -4
  44. package/Compiled-Themes/tailwind-dark.css +4 -4
  45. package/Compiled-Themes/tailwind-lite.css +4 -4
  46. package/Compiled-Themes/tailwind.css +4 -4
  47. package/Compiled-Themes/tailwind3-dark-lite.css +9 -4
  48. package/Compiled-Themes/tailwind3-dark.css +16 -4
  49. package/Compiled-Themes/tailwind3-lite.css +9 -4
  50. package/Compiled-Themes/tailwind3.css +16 -4
  51. package/SCSS-Themes/bds-dark-lite.scss +85 -24
  52. package/SCSS-Themes/bds-dark.scss +179 -26
  53. package/SCSS-Themes/bds-lite.scss +85 -24
  54. package/SCSS-Themes/bds.scss +179 -26
  55. package/SCSS-Themes/bootstrap-dark-lite.scss +84 -23
  56. package/SCSS-Themes/bootstrap-dark.scss +178 -25
  57. package/SCSS-Themes/bootstrap-lite.scss +84 -23
  58. package/SCSS-Themes/bootstrap.scss +178 -25
  59. package/SCSS-Themes/bootstrap4-lite.scss +91 -30
  60. package/SCSS-Themes/bootstrap4.scss +185 -32
  61. package/SCSS-Themes/bootstrap5-dark-lite.scss +92 -31
  62. package/SCSS-Themes/bootstrap5-dark.scss +186 -33
  63. package/SCSS-Themes/bootstrap5-lite.scss +92 -31
  64. package/SCSS-Themes/bootstrap5.3-dark-lite.scss +100 -39
  65. package/SCSS-Themes/bootstrap5.3-dark.scss +194 -41
  66. package/SCSS-Themes/bootstrap5.3-lite.scss +100 -39
  67. package/SCSS-Themes/bootstrap5.3.scss +194 -41
  68. package/SCSS-Themes/bootstrap5.scss +186 -33
  69. package/SCSS-Themes/fabric-dark-lite.scss +84 -23
  70. package/SCSS-Themes/fabric-dark.scss +178 -25
  71. package/SCSS-Themes/fabric-lite.scss +84 -23
  72. package/SCSS-Themes/fabric.scss +178 -25
  73. package/SCSS-Themes/fluent-dark-lite.scss +90 -29
  74. package/SCSS-Themes/fluent-dark.scss +184 -31
  75. package/SCSS-Themes/fluent-lite.scss +90 -29
  76. package/SCSS-Themes/fluent.scss +184 -31
  77. package/SCSS-Themes/fluent2-dark-lite.scss +87 -26
  78. package/SCSS-Themes/fluent2-dark.scss +181 -28
  79. package/SCSS-Themes/fluent2-highcontrast-lite.scss +87 -26
  80. package/SCSS-Themes/fluent2-highcontrast.scss +181 -28
  81. package/SCSS-Themes/fluent2-lite.scss +87 -26
  82. package/SCSS-Themes/fluent2.scss +181 -28
  83. package/SCSS-Themes/highcontrast-lite.scss +90 -29
  84. package/SCSS-Themes/highcontrast.scss +184 -31
  85. package/SCSS-Themes/material-dark-lite.scss +91 -30
  86. package/SCSS-Themes/material-dark.scss +185 -32
  87. package/SCSS-Themes/material-lite.scss +90 -29
  88. package/SCSS-Themes/material.scss +184 -31
  89. package/SCSS-Themes/material3-dark-lite.scss +86 -25
  90. package/SCSS-Themes/material3-dark.scss +180 -27
  91. package/SCSS-Themes/material3-lite.scss +86 -25
  92. package/SCSS-Themes/material3.scss +180 -27
  93. package/SCSS-Themes/navigations/menu/material3-dark-lite.scss +1 -1
  94. package/SCSS-Themes/navigations/menu/material3-dark.scss +1 -1
  95. package/SCSS-Themes/navigations/menu/material3-lite.scss +1 -1
  96. package/SCSS-Themes/navigations/menu/material3.scss +1 -1
  97. package/SCSS-Themes/navigations/treeview/bds-dark-lite.scss +74 -18
  98. package/SCSS-Themes/navigations/treeview/bds-dark.scss +165 -18
  99. package/SCSS-Themes/navigations/treeview/bds-lite.scss +74 -18
  100. package/SCSS-Themes/navigations/treeview/bds.scss +165 -18
  101. package/SCSS-Themes/navigations/treeview/bootstrap-dark-lite.scss +73 -17
  102. package/SCSS-Themes/navigations/treeview/bootstrap-dark.scss +164 -17
  103. package/SCSS-Themes/navigations/treeview/bootstrap-lite.scss +73 -17
  104. package/SCSS-Themes/navigations/treeview/bootstrap.scss +164 -17
  105. package/SCSS-Themes/navigations/treeview/bootstrap4-lite.scss +80 -24
  106. package/SCSS-Themes/navigations/treeview/bootstrap4.scss +171 -24
  107. package/SCSS-Themes/navigations/treeview/bootstrap5-dark-lite.scss +75 -19
  108. package/SCSS-Themes/navigations/treeview/bootstrap5-dark.scss +166 -19
  109. package/SCSS-Themes/navigations/treeview/bootstrap5-lite.scss +75 -19
  110. package/SCSS-Themes/navigations/treeview/bootstrap5.3-dark-lite.scss +81 -25
  111. package/SCSS-Themes/navigations/treeview/bootstrap5.3-dark.scss +172 -25
  112. package/SCSS-Themes/navigations/treeview/bootstrap5.3-lite.scss +81 -25
  113. package/SCSS-Themes/navigations/treeview/bootstrap5.3.scss +172 -25
  114. package/SCSS-Themes/navigations/treeview/bootstrap5.scss +166 -19
  115. package/SCSS-Themes/navigations/treeview/fabric-dark-lite.scss +73 -17
  116. package/SCSS-Themes/navigations/treeview/fabric-dark.scss +164 -17
  117. package/SCSS-Themes/navigations/treeview/fabric-lite.scss +73 -17
  118. package/SCSS-Themes/navigations/treeview/fabric.scss +164 -17
  119. package/SCSS-Themes/navigations/treeview/fluent-dark-lite.scss +79 -23
  120. package/SCSS-Themes/navigations/treeview/fluent-dark.scss +170 -23
  121. package/SCSS-Themes/navigations/treeview/fluent-lite.scss +79 -23
  122. package/SCSS-Themes/navigations/treeview/fluent.scss +170 -23
  123. package/SCSS-Themes/navigations/treeview/fluent2-dark-lite.scss +73 -17
  124. package/SCSS-Themes/navigations/treeview/fluent2-dark.scss +164 -17
  125. package/SCSS-Themes/navigations/treeview/fluent2-highcontrast-lite.scss +73 -17
  126. package/SCSS-Themes/navigations/treeview/fluent2-highcontrast.scss +164 -17
  127. package/SCSS-Themes/navigations/treeview/fluent2-lite.scss +73 -17
  128. package/SCSS-Themes/navigations/treeview/fluent2.scss +164 -17
  129. package/SCSS-Themes/navigations/treeview/highcontrast-lite.scss +79 -23
  130. package/SCSS-Themes/navigations/treeview/highcontrast.scss +170 -23
  131. package/SCSS-Themes/navigations/treeview/material-dark-lite.scss +80 -24
  132. package/SCSS-Themes/navigations/treeview/material-dark.scss +171 -24
  133. package/SCSS-Themes/navigations/treeview/material-lite.scss +79 -23
  134. package/SCSS-Themes/navigations/treeview/material.scss +170 -23
  135. package/SCSS-Themes/navigations/treeview/material3-dark-lite.scss +73 -17
  136. package/SCSS-Themes/navigations/treeview/material3-dark.scss +164 -17
  137. package/SCSS-Themes/navigations/treeview/material3-lite.scss +73 -17
  138. package/SCSS-Themes/navigations/treeview/material3.scss +164 -17
  139. package/SCSS-Themes/navigations/treeview/tailwind-dark-lite.scss +73 -17
  140. package/SCSS-Themes/navigations/treeview/tailwind-dark.scss +164 -17
  141. package/SCSS-Themes/navigations/treeview/tailwind-lite.scss +73 -17
  142. package/SCSS-Themes/navigations/treeview/tailwind.scss +164 -17
  143. package/SCSS-Themes/navigations/treeview/tailwind3-dark-lite.scss +74 -18
  144. package/SCSS-Themes/navigations/treeview/tailwind3-dark.scss +165 -18
  145. package/SCSS-Themes/navigations/treeview/tailwind3-lite.scss +74 -18
  146. package/SCSS-Themes/navigations/treeview/tailwind3.scss +165 -18
  147. package/SCSS-Themes/notifications/toast/bds-dark-lite.scss +11 -6
  148. package/SCSS-Themes/notifications/toast/bds-dark.scss +14 -8
  149. package/SCSS-Themes/notifications/toast/bds-lite.scss +11 -6
  150. package/SCSS-Themes/notifications/toast/bds.scss +14 -8
  151. package/SCSS-Themes/notifications/toast/bootstrap-dark-lite.scss +11 -6
  152. package/SCSS-Themes/notifications/toast/bootstrap-dark.scss +14 -8
  153. package/SCSS-Themes/notifications/toast/bootstrap-lite.scss +11 -6
  154. package/SCSS-Themes/notifications/toast/bootstrap.scss +14 -8
  155. package/SCSS-Themes/notifications/toast/bootstrap4-lite.scss +11 -6
  156. package/SCSS-Themes/notifications/toast/bootstrap4.scss +14 -8
  157. package/SCSS-Themes/notifications/toast/bootstrap5-dark-lite.scss +17 -12
  158. package/SCSS-Themes/notifications/toast/bootstrap5-dark.scss +20 -14
  159. package/SCSS-Themes/notifications/toast/bootstrap5-lite.scss +17 -12
  160. package/SCSS-Themes/notifications/toast/bootstrap5.3-dark-lite.scss +19 -14
  161. package/SCSS-Themes/notifications/toast/bootstrap5.3-dark.scss +22 -16
  162. package/SCSS-Themes/notifications/toast/bootstrap5.3-lite.scss +19 -14
  163. package/SCSS-Themes/notifications/toast/bootstrap5.3.scss +22 -16
  164. package/SCSS-Themes/notifications/toast/bootstrap5.scss +20 -14
  165. package/SCSS-Themes/notifications/toast/fabric-dark-lite.scss +11 -6
  166. package/SCSS-Themes/notifications/toast/fabric-dark.scss +14 -8
  167. package/SCSS-Themes/notifications/toast/fabric-lite.scss +11 -6
  168. package/SCSS-Themes/notifications/toast/fabric.scss +14 -8
  169. package/SCSS-Themes/notifications/toast/fluent-dark-lite.scss +11 -6
  170. package/SCSS-Themes/notifications/toast/fluent-dark.scss +14 -8
  171. package/SCSS-Themes/notifications/toast/fluent-lite.scss +11 -6
  172. package/SCSS-Themes/notifications/toast/fluent.scss +14 -8
  173. package/SCSS-Themes/notifications/toast/fluent2-dark-lite.scss +14 -9
  174. package/SCSS-Themes/notifications/toast/fluent2-dark.scss +17 -11
  175. package/SCSS-Themes/notifications/toast/fluent2-highcontrast-lite.scss +14 -9
  176. package/SCSS-Themes/notifications/toast/fluent2-highcontrast.scss +17 -11
  177. package/SCSS-Themes/notifications/toast/fluent2-lite.scss +14 -9
  178. package/SCSS-Themes/notifications/toast/fluent2.scss +17 -11
  179. package/SCSS-Themes/notifications/toast/highcontrast-lite.scss +11 -6
  180. package/SCSS-Themes/notifications/toast/highcontrast.scss +14 -8
  181. package/SCSS-Themes/notifications/toast/material-dark-lite.scss +11 -6
  182. package/SCSS-Themes/notifications/toast/material-dark.scss +14 -8
  183. package/SCSS-Themes/notifications/toast/material-lite.scss +11 -6
  184. package/SCSS-Themes/notifications/toast/material.scss +14 -8
  185. package/SCSS-Themes/notifications/toast/material3-dark-lite.scss +12 -7
  186. package/SCSS-Themes/notifications/toast/material3-dark.scss +15 -9
  187. package/SCSS-Themes/notifications/toast/material3-lite.scss +12 -7
  188. package/SCSS-Themes/notifications/toast/material3.scss +15 -9
  189. package/SCSS-Themes/notifications/toast/tailwind-dark-lite.scss +11 -6
  190. package/SCSS-Themes/notifications/toast/tailwind-dark.scss +14 -8
  191. package/SCSS-Themes/notifications/toast/tailwind-lite.scss +11 -6
  192. package/SCSS-Themes/notifications/toast/tailwind.scss +14 -8
  193. package/SCSS-Themes/notifications/toast/tailwind3-dark-lite.scss +11 -6
  194. package/SCSS-Themes/notifications/toast/tailwind3-dark.scss +14 -8
  195. package/SCSS-Themes/notifications/toast/tailwind3-lite.scss +11 -6
  196. package/SCSS-Themes/notifications/toast/tailwind3.scss +14 -8
  197. package/SCSS-Themes/tailwind-dark-lite.scss +84 -23
  198. package/SCSS-Themes/tailwind-dark.scss +178 -25
  199. package/SCSS-Themes/tailwind-lite.scss +84 -23
  200. package/SCSS-Themes/tailwind.scss +178 -25
  201. package/SCSS-Themes/tailwind3-dark-lite.scss +85 -24
  202. package/SCSS-Themes/tailwind3-dark.scss +179 -26
  203. package/SCSS-Themes/tailwind3-lite.scss +85 -24
  204. package/SCSS-Themes/tailwind3.scss +179 -26
  205. package/package.json +1 -1
package/SCSS-Themes/notifications/toast/material3.scss CHANGED
@@ -42,7 +42,7 @@ $toast-progressbar-bgr-height: 4px !default;
42
42
  $toast-content-bgr-padding: 8px 0 6px 0 !default;
43
43
  $toast-bgr-border-radious: 4px !default;
44
44
  $toast-font-bgr-size: $text-sm !default;
45
- $toast-title-font-weight: $font-weight-medium !default;
45
+ $toast-title-font-weight: 500 !default;
46
46
 
47
47
  //Touch Mode End
48
48
  //Layout Variables End
@@ -242,10 +242,10 @@ $toast-warning-icon: '\e88b' !default;
242
242
  &:first-child {
243
243
  padding: 0;
244
244
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
245
- padding-bottom: 12px;
245
+ padding-bottom: 8px;
246
246
  padding-left: 12px;
247
247
  padding-right: 12px;
248
- padding-top: 12px;
248
+ padding-top: 8px;
249
249
  }
250
250
  }
251
251
 
@@ -313,7 +313,7 @@ $toast-warning-icon: '\e88b' !default;
313
313
  .e-toast-content {
314
314
  &:first-child {
315
315
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
316
- padding-left: 48px;
316
+ padding-left: 44px;
317
317
  }
318
318
  }
319
319
  }
@@ -360,9 +360,14 @@ $toast-warning-icon: '\e88b' !default;
360
360
  margin-right: $toast-icon-nrml-right-margin;
361
361
  width: $toast-icon-nrml-width;
362
362
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
363
- left: 16px;
364
- margin-left: 13px;
365
- margin-top: 13px;
363
+ left: 0;
364
+ margin-left: 12px;
365
+ margin-top: 10px;
366
+ padding-bottom: 6px;
367
+ position: absolute;
368
+ }
369
+ @if $skin-name == 'fluent2' {
370
+ margin-top: 2px;
366
371
  }
367
372
  }
368
373
 
@@ -834,8 +839,9 @@ $toast-warning-icon: '\e88b' !default;
834
839
  margin-right: $toast-icon-bgr-right-margin;
835
840
  width: $toast-icon-bgr-width;
836
841
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
837
- left: 18px;
838
- margin-top: 13px;
842
+ left: 0;
843
+ margin-top: 14px;
844
+ margin-left: 12px;
839
845
  }
840
846
  }
841
847
 
package/SCSS-Themes/notifications/toast/tailwind-dark-lite.scss CHANGED
@@ -230,10 +230,10 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
230
230
  &:first-child {
231
231
  padding: 0;
232
232
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
233
- padding-bottom: 12px;
233
+ padding-bottom: 8px;
234
234
  padding-left: 12px;
235
235
  padding-right: 12px;
236
- padding-top: 12px;
236
+ padding-top: 8px;
237
237
  }
238
238
  }
239
239
 
@@ -301,7 +301,7 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
301
301
  .e-toast-content {
302
302
  &:first-child {
303
303
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
304
- padding-left: 48px;
304
+ padding-left: 44px;
305
305
  }
306
306
  }
307
307
  }
@@ -348,9 +348,14 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
348
348
  margin-right: $toast-icon-nrml-right-margin;
349
349
  width: $toast-icon-nrml-width;
350
350
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
351
- left: 16px;
352
- margin-left: 13px;
353
- margin-top: 13px;
351
+ left: 0;
352
+ margin-left: 12px;
353
+ margin-top: 10px;
354
+ padding-bottom: 6px;
355
+ position: absolute;
356
+ }
357
+ @if $skin-name == 'fluent2' {
358
+ margin-top: 2px;
354
359
  }
355
360
  }
356
361
 
package/SCSS-Themes/notifications/toast/tailwind-dark.scss CHANGED
@@ -230,10 +230,10 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
230
230
  &:first-child {
231
231
  padding: 0;
232
232
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
233
- padding-bottom: 12px;
233
+ padding-bottom: 8px;
234
234
  padding-left: 12px;
235
235
  padding-right: 12px;
236
- padding-top: 12px;
236
+ padding-top: 8px;
237
237
  }
238
238
  }
239
239
 
@@ -301,7 +301,7 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
301
301
  .e-toast-content {
302
302
  &:first-child {
303
303
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
304
- padding-left: 48px;
304
+ padding-left: 44px;
305
305
  }
306
306
  }
307
307
  }
@@ -348,9 +348,14 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
348
348
  margin-right: $toast-icon-nrml-right-margin;
349
349
  width: $toast-icon-nrml-width;
350
350
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
351
- left: 16px;
352
- margin-left: 13px;
353
- margin-top: 13px;
351
+ left: 0;
352
+ margin-left: 12px;
353
+ margin-top: 10px;
354
+ padding-bottom: 6px;
355
+ position: absolute;
356
+ }
357
+ @if $skin-name == 'fluent2' {
358
+ margin-top: 2px;
354
359
  }
355
360
  }
356
361
 
@@ -822,8 +827,9 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
822
827
  margin-right: $toast-icon-bgr-right-margin;
823
828
  width: $toast-icon-bgr-width;
824
829
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
825
- left: 18px;
826
- margin-top: 13px;
830
+ left: 0;
831
+ margin-top: 14px;
832
+ margin-left: 12px;
827
833
  }
828
834
  }
829
835
 
package/SCSS-Themes/notifications/toast/tailwind-lite.scss CHANGED
@@ -230,10 +230,10 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
230
230
  &:first-child {
231
231
  padding: 0;
232
232
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
233
- padding-bottom: 12px;
233
+ padding-bottom: 8px;
234
234
  padding-left: 12px;
235
235
  padding-right: 12px;
236
- padding-top: 12px;
236
+ padding-top: 8px;
237
237
  }
238
238
  }
239
239
 
@@ -301,7 +301,7 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
301
301
  .e-toast-content {
302
302
  &:first-child {
303
303
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
304
- padding-left: 48px;
304
+ padding-left: 44px;
305
305
  }
306
306
  }
307
307
  }
@@ -348,9 +348,14 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
348
348
  margin-right: $toast-icon-nrml-right-margin;
349
349
  width: $toast-icon-nrml-width;
350
350
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
351
- left: 16px;
352
- margin-left: 13px;
353
- margin-top: 13px;
351
+ left: 0;
352
+ margin-left: 12px;
353
+ margin-top: 10px;
354
+ padding-bottom: 6px;
355
+ position: absolute;
356
+ }
357
+ @if $skin-name == 'fluent2' {
358
+ margin-top: 2px;
354
359
  }
355
360
  }
356
361
 
package/SCSS-Themes/notifications/toast/tailwind.scss CHANGED
@@ -230,10 +230,10 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
230
230
  &:first-child {
231
231
  padding: 0;
232
232
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
233
- padding-bottom: 12px;
233
+ padding-bottom: 8px;
234
234
  padding-left: 12px;
235
235
  padding-right: 12px;
236
- padding-top: 12px;
236
+ padding-top: 8px;
237
237
  }
238
238
  }
239
239
 
@@ -301,7 +301,7 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
301
301
  .e-toast-content {
302
302
  &:first-child {
303
303
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
304
- padding-left: 48px;
304
+ padding-left: 44px;
305
305
  }
306
306
  }
307
307
  }
@@ -348,9 +348,14 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
348
348
  margin-right: $toast-icon-nrml-right-margin;
349
349
  width: $toast-icon-nrml-width;
350
350
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
351
- left: 16px;
352
- margin-left: 13px;
353
- margin-top: 13px;
351
+ left: 0;
352
+ margin-left: 12px;
353
+ margin-top: 10px;
354
+ padding-bottom: 6px;
355
+ position: absolute;
356
+ }
357
+ @if $skin-name == 'fluent2' {
358
+ margin-top: 2px;
354
359
  }
355
360
  }
356
361
 
@@ -822,8 +827,9 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
822
827
  margin-right: $toast-icon-bgr-right-margin;
823
828
  width: $toast-icon-bgr-width;
824
829
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
825
- left: 18px;
826
- margin-top: 13px;
830
+ left: 0;
831
+ margin-top: 14px;
832
+ margin-left: 12px;
827
833
  }
828
834
  }
829
835
 
package/SCSS-Themes/notifications/toast/tailwind3-dark-lite.scss CHANGED
@@ -234,10 +234,10 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
234
234
  &:first-child {
235
235
  padding: 0;
236
236
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
237
- padding-bottom: 12px;
237
+ padding-bottom: 8px;
238
238
  padding-left: 12px;
239
239
  padding-right: 12px;
240
- padding-top: 12px;
240
+ padding-top: 8px;
241
241
  }
242
242
  }
243
243
 
@@ -305,7 +305,7 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
305
305
  .e-toast-content {
306
306
  &:first-child {
307
307
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
308
- padding-left: 48px;
308
+ padding-left: 44px;
309
309
  }
310
310
  }
311
311
  }
@@ -352,9 +352,14 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
352
352
  margin-right: $toast-icon-nrml-right-margin;
353
353
  width: $toast-icon-nrml-width;
354
354
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
355
- left: 16px;
356
- margin-left: 13px;
357
- margin-top: 13px;
355
+ left: 0;
356
+ margin-left: 12px;
357
+ margin-top: 10px;
358
+ padding-bottom: 6px;
359
+ position: absolute;
360
+ }
361
+ @if $skin-name == 'fluent2' {
362
+ margin-top: 2px;
358
363
  }
359
364
  }
360
365
 
package/SCSS-Themes/notifications/toast/tailwind3-dark.scss CHANGED
@@ -234,10 +234,10 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
234
234
  &:first-child {
235
235
  padding: 0;
236
236
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
237
- padding-bottom: 12px;
237
+ padding-bottom: 8px;
238
238
  padding-left: 12px;
239
239
  padding-right: 12px;
240
- padding-top: 12px;
240
+ padding-top: 8px;
241
241
  }
242
242
  }
243
243
 
@@ -305,7 +305,7 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
305
305
  .e-toast-content {
306
306
  &:first-child {
307
307
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
308
- padding-left: 48px;
308
+ padding-left: 44px;
309
309
  }
310
310
  }
311
311
  }
@@ -352,9 +352,14 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
352
352
  margin-right: $toast-icon-nrml-right-margin;
353
353
  width: $toast-icon-nrml-width;
354
354
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
355
- left: 16px;
356
- margin-left: 13px;
357
- margin-top: 13px;
355
+ left: 0;
356
+ margin-left: 12px;
357
+ margin-top: 10px;
358
+ padding-bottom: 6px;
359
+ position: absolute;
360
+ }
361
+ @if $skin-name == 'fluent2' {
362
+ margin-top: 2px;
358
363
  }
359
364
  }
360
365
 
@@ -826,8 +831,9 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
826
831
  margin-right: $toast-icon-bgr-right-margin;
827
832
  width: $toast-icon-bgr-width;
828
833
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
829
- left: 18px;
830
- margin-top: 13px;
834
+ left: 0;
835
+ margin-top: 14px;
836
+ margin-left: 12px;
831
837
  }
832
838
  }
833
839
 
package/SCSS-Themes/notifications/toast/tailwind3-lite.scss CHANGED
@@ -234,10 +234,10 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
234
234
  &:first-child {
235
235
  padding: 0;
236
236
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
237
- padding-bottom: 12px;
237
+ padding-bottom: 8px;
238
238
  padding-left: 12px;
239
239
  padding-right: 12px;
240
- padding-top: 12px;
240
+ padding-top: 8px;
241
241
  }
242
242
  }
243
243
 
@@ -305,7 +305,7 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
305
305
  .e-toast-content {
306
306
  &:first-child {
307
307
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
308
- padding-left: 48px;
308
+ padding-left: 44px;
309
309
  }
310
310
  }
311
311
  }
@@ -352,9 +352,14 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
352
352
  margin-right: $toast-icon-nrml-right-margin;
353
353
  width: $toast-icon-nrml-width;
354
354
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
355
- left: 16px;
356
- margin-left: 13px;
357
- margin-top: 13px;
355
+ left: 0;
356
+ margin-left: 12px;
357
+ margin-top: 10px;
358
+ padding-bottom: 6px;
359
+ position: absolute;
360
+ }
361
+ @if $skin-name == 'fluent2' {
362
+ margin-top: 2px;
358
363
  }
359
364
  }
360
365
 
package/SCSS-Themes/notifications/toast/tailwind3.scss CHANGED
@@ -234,10 +234,10 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
234
234
  &:first-child {
235
235
  padding: 0;
236
236
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
237
- padding-bottom: 12px;
237
+ padding-bottom: 8px;
238
238
  padding-left: 12px;
239
239
  padding-right: 12px;
240
- padding-top: 12px;
240
+ padding-top: 8px;
241
241
  }
242
242
  }
243
243
 
@@ -305,7 +305,7 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
305
305
  .e-toast-content {
306
306
  &:first-child {
307
307
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
308
- padding-left: 48px;
308
+ padding-left: 44px;
309
309
  }
310
310
  }
311
311
  }
@@ -352,9 +352,14 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
352
352
  margin-right: $toast-icon-nrml-right-margin;
353
353
  width: $toast-icon-nrml-width;
354
354
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
355
- left: 16px;
356
- margin-left: 13px;
357
- margin-top: 13px;
355
+ left: 0;
356
+ margin-left: 12px;
357
+ margin-top: 10px;
358
+ padding-bottom: 6px;
359
+ position: absolute;
360
+ }
361
+ @if $skin-name == 'fluent2' {
362
+ margin-top: 2px;
358
363
  }
359
364
  }
360
365
 
@@ -826,8 +831,9 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
826
831
  margin-right: $toast-icon-bgr-right-margin;
827
832
  width: $toast-icon-bgr-width;
828
833
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
829
- left: 18px;
830
- margin-top: 13px;
834
+ left: 0;
835
+ margin-top: 14px;
836
+ margin-left: 12px;
831
837
  }
832
838
  }
833
839
 
package/SCSS-Themes/tailwind-dark-lite.scss CHANGED
@@ -43357,7 +43357,7 @@ $treeview-drag-icon-color: $treeview-icon-color !default;
43357
43357
 
43358
43358
  .e-list-item {
43359
43359
  list-style: none;
43360
- @if $skin-name != 'tailwind3' and $skin-name != 'tailwind' and $skin-name != 'Material3' and $skin-name != 'fluent2' {
43360
+ @if $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' {
43361
43361
  padding: 2px 0;
43362
43362
  }
43363
43363
  @if $skin-name == 'fluent2' {
@@ -43365,13 +43365,12 @@ $treeview-drag-icon-color: $treeview-icon-color !default;
43365
43365
  }
43366
43366
 
43367
43367
  .e-ul {
43368
- margin: 2px 0 -2px;
43369
43368
  padding: $treeview-child-ul-padding;
43370
- @if $skin-name == 'tailwind' {
43371
- margin: 2px 0 0;
43369
+ @if $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' {
43370
+ margin: 2px 0 -2px;
43372
43371
  }
43373
- @else if $skin-name == 'tailwind3' or $skin-name == 'Material3' {
43374
- margin: 0;
43372
+ @if $skin-name == 'fluent2' {
43373
+ margin-top: 4px;
43375
43374
  }
43376
43375
  }
43377
43376
 
@@ -43408,6 +43407,45 @@ $treeview-drag-icon-color: $treeview-icon-color !default;
43408
43407
  .e-icons.e-icons-spinner::before {
43409
43408
  content: none;
43410
43409
  }
43410
+
43411
+ .e-text-content {
43412
+ .e-list-text {
43413
+ &:has(> .e-input-group) {
43414
+ @if $skin-name == 'material' or $skin-name == 'material-dark' {
43415
+ padding-top: 1px;
43416
+ padding-bottom: 1px;
43417
+ .e-input-group {
43418
+ height: 34px;
43419
+
43420
+ .e-input {
43421
+ line-height: 26px;
43422
+ min-height: 26px;
43423
+ }
43424
+ }
43425
+ }
43426
+ @if $skin-name == 'tailwind3' {
43427
+ padding-top: 4px;
43428
+ padding-bottom: 4px;
43429
+ }
43430
+ @if $skin-name == 'highcontrast' {
43431
+ padding-top: 3px;
43432
+ padding-bottom: 3px;
43433
+ }
43434
+ @if ($skin-name == 'FluentUI') {
43435
+ padding-top: 3px;
43436
+ padding-bottom: 3px;
43437
+ }
43438
+ @if $skin-name == 'bootstrap5.3' {
43439
+ padding-top: 2px;
43440
+ padding-bottom: 2px;
43441
+ }
43442
+ @if $skin-name == 'bootstrap4' {
43443
+ padding-top: 5px;
43444
+ padding-bottom: 5px;
43445
+ }
43446
+ }
43447
+ }
43448
+ }
43411
43449
  }
43412
43450
 
43413
43451
  .e-icons {
@@ -43425,11 +43463,14 @@ $treeview-drag-icon-color: $treeview-icon-color !default;
43425
43463
 
43426
43464
  .e-text-content {
43427
43465
  @include user-select;
43428
- border: 1px solid;
43429
43466
  cursor: pointer;
43430
43467
  margin: 0;
43431
43468
  padding: $treeview-text-wrap-padding;
43432
43469
 
43470
+ @if $skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark' {
43471
+ border: 1px solid;
43472
+ }
43473
+
43433
43474
  @if $skin-name == 'Material3' or $skin-name == 'tailwind3' {
43434
43475
  border: none;
43435
43476
  }
@@ -43515,14 +43556,13 @@ $treeview-drag-icon-color: $treeview-icon-color !default;
43515
43556
 
43516
43557
  .e-input-group {
43517
43558
  height: $treeview-input-height;
43518
- @if ($skin-name == 'FluentUI') {
43519
- margin-top: 3px;
43520
- }
43521
- @else if($skin-name == 'tailwind') {
43522
- margin-bottom: 3px;
43559
+ @if ($skin-name == 'tailwind') {
43560
+ margin-top: 4px;
43561
+ margin-bottom: 4px;
43523
43562
  }
43524
43563
  @else if($skin-name == 'bootstrap5') {
43525
- margin-bottom: 2px;
43564
+ margin-bottom: 3px;
43565
+ margin-top: 3px;
43526
43566
  }
43527
43567
  @else {
43528
43568
  margin-bottom: 0;
@@ -43532,9 +43572,20 @@ $treeview-drag-icon-color: $treeview-icon-color !default;
43532
43572
  @if ($skin-name == 'fluent2') {
43533
43573
  border-color: $treeview-input-border-color;
43534
43574
  }
43535
- @if $skin-name != 'material' {
43536
- .e-input {
43575
+ .e-input {
43576
+ @if $skin-name != 'material' and $skin-name != 'material-dark' {
43537
43577
  height: 28px;
43578
+ padding-top: 6px;
43579
+ padding-bottom: 6px;
43580
+ }
43581
+ @if $skin-name == 'tailwind3' {
43582
+ line-height: 20px;
43583
+ height: 32px;
43584
+ }
43585
+ @if $skin-name == 'bootstrap5.3' {
43586
+ height: 32px;
43587
+ padding-top: 5px;
43588
+ padding-bottom: 5px;
43538
43589
  }
43539
43590
  }
43540
43591
  }
@@ -44126,13 +44177,13 @@ $treeview-drag-icon-color: $treeview-icon-color !default;
44126
44177
  @include bg-border($treeview-item-active-check-bg, $treeview-item-active-check-border-color);
44127
44178
  color: $treeview-item-active-check-color;
44128
44179
  }
44129
- @else if $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' {
44180
+ @else if $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' or $skin-name == 'bootstrap5.3' {
44130
44181
  border-color: $content-text-color-selected;
44131
44182
  }
44132
44183
  }
44133
44184
 
44134
44185
  .e-stop {
44135
- @if $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' {
44186
+ @if $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' or $skin-name == 'bootstrap5.3' {
44136
44187
  border-color: $content-text-color-selected;
44137
44188
  }
44138
44189
  }
@@ -44183,6 +44234,11 @@ $treeview-drag-icon-color: $treeview-icon-color !default;
44183
44234
  }
44184
44235
  }
44185
44236
  }
44237
+ @if ($theme-name == 'fluent2-highcontrast') {
44238
+ .e-checkbox-wrapper .e-frame.e-check {
44239
+ border-color: $content-text-color-hover;
44240
+ }
44241
+ }
44186
44242
  }
44187
44243
 
44188
44244
  .e-sibling {
@@ -81767,10 +81823,10 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
81767
81823
  &:first-child {
81768
81824
  padding: 0;
81769
81825
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
81770
- padding-bottom: 12px;
81826
+ padding-bottom: 8px;
81771
81827
  padding-left: 12px;
81772
81828
  padding-right: 12px;
81773
- padding-top: 12px;
81829
+ padding-top: 8px;
81774
81830
  }
81775
81831
  }
81776
81832
 
@@ -81838,7 +81894,7 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
81838
81894
  .e-toast-content {
81839
81895
  &:first-child {
81840
81896
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
81841
- padding-left: 48px;
81897
+ padding-left: 44px;
81842
81898
  }
81843
81899
  }
81844
81900
  }
@@ -81885,9 +81941,14 @@ $toast-close-icon-hover-color: $icon-color-hover !default;
81885
81941
  margin-right: $toast-icon-nrml-right-margin;
81886
81942
  width: $toast-icon-nrml-width;
81887
81943
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
81888
- left: 16px;
81889
- margin-left: 13px;
81890
- margin-top: 13px;
81944
+ left: 0;
81945
+ margin-left: 12px;
81946
+ margin-top: 10px;
81947
+ padding-bottom: 6px;
81948
+ position: absolute;
81949
+ }
81950
+ @if $skin-name == 'fluent2' {
81951
+ margin-top: 2px;
81891
81952
  }
81892
81953
  }
81893
81954