@syncfusion/blazor-themes 22.1.34 → 22.1.37

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 (124) hide show
  1. package/SCSS-Themes/bootstrap-dark.scss +62 -18
  2. package/SCSS-Themes/bootstrap.scss +66 -22
  3. package/SCSS-Themes/bootstrap4.scss +65 -21
  4. package/SCSS-Themes/bootstrap5-dark.scss +62 -18
  5. package/SCSS-Themes/bootstrap5.scss +62 -18
  6. package/SCSS-Themes/fabric-dark.scss +62 -18
  7. package/SCSS-Themes/fabric.scss +65 -21
  8. package/SCSS-Themes/fluent-dark.scss +62 -18
  9. package/SCSS-Themes/fluent.scss +62 -18
  10. package/SCSS-Themes/highcontrast.scss +65 -21
  11. package/SCSS-Themes/image-editor/image-editor/bootstrap-dark.scss +2 -4
  12. package/SCSS-Themes/image-editor/image-editor/bootstrap.scss +2 -4
  13. package/SCSS-Themes/image-editor/image-editor/bootstrap4.scss +2 -4
  14. package/SCSS-Themes/image-editor/image-editor/bootstrap5-dark.scss +2 -4
  15. package/SCSS-Themes/image-editor/image-editor/bootstrap5.scss +2 -4
  16. package/SCSS-Themes/image-editor/image-editor/fabric-dark.scss +2 -4
  17. package/SCSS-Themes/image-editor/image-editor/fabric.scss +2 -4
  18. package/SCSS-Themes/image-editor/image-editor/fluent-dark.scss +2 -4
  19. package/SCSS-Themes/image-editor/image-editor/fluent.scss +2 -4
  20. package/SCSS-Themes/image-editor/image-editor/highcontrast.scss +3 -5
  21. package/SCSS-Themes/image-editor/image-editor/material-dark.scss +2 -4
  22. package/SCSS-Themes/image-editor/image-editor/material.scss +2 -4
  23. package/SCSS-Themes/image-editor/image-editor/material3-dark.scss +2 -4
  24. package/SCSS-Themes/image-editor/image-editor/material3.scss +2 -4
  25. package/SCSS-Themes/image-editor/image-editor/tailwind-dark.scss +2 -4
  26. package/SCSS-Themes/image-editor/image-editor/tailwind.scss +2 -4
  27. package/SCSS-Themes/inplace-editor/inplace-editor/bootstrap-dark.scss +10 -1
  28. package/SCSS-Themes/inplace-editor/inplace-editor/bootstrap.scss +10 -1
  29. package/SCSS-Themes/inplace-editor/inplace-editor/bootstrap4.scss +10 -1
  30. package/SCSS-Themes/inplace-editor/inplace-editor/bootstrap5-dark.scss +10 -1
  31. package/SCSS-Themes/inplace-editor/inplace-editor/bootstrap5.scss +10 -1
  32. package/SCSS-Themes/inplace-editor/inplace-editor/fabric-dark.scss +10 -1
  33. package/SCSS-Themes/inplace-editor/inplace-editor/fabric.scss +10 -1
  34. package/SCSS-Themes/inplace-editor/inplace-editor/fluent-dark.scss +10 -1
  35. package/SCSS-Themes/inplace-editor/inplace-editor/fluent.scss +10 -1
  36. package/SCSS-Themes/inplace-editor/inplace-editor/highcontrast.scss +10 -1
  37. package/SCSS-Themes/inplace-editor/inplace-editor/material-dark.scss +10 -1
  38. package/SCSS-Themes/inplace-editor/inplace-editor/material.scss +10 -1
  39. package/SCSS-Themes/inplace-editor/inplace-editor/material3-dark.scss +10 -1
  40. package/SCSS-Themes/inplace-editor/inplace-editor/material3.scss +10 -1
  41. package/SCSS-Themes/inplace-editor/inplace-editor/tailwind-dark.scss +10 -1
  42. package/SCSS-Themes/inplace-editor/inplace-editor/tailwind.scss +10 -1
  43. package/SCSS-Themes/inputs/input/bootstrap-dark.scss +34 -2
  44. package/SCSS-Themes/inputs/input/bootstrap.scss +34 -2
  45. package/SCSS-Themes/inputs/input/bootstrap4.scss +34 -2
  46. package/SCSS-Themes/inputs/input/bootstrap5-dark.scss +34 -2
  47. package/SCSS-Themes/inputs/input/bootstrap5.scss +34 -2
  48. package/SCSS-Themes/inputs/input/fabric-dark.scss +34 -2
  49. package/SCSS-Themes/inputs/input/fabric.scss +34 -2
  50. package/SCSS-Themes/inputs/input/fluent-dark.scss +34 -2
  51. package/SCSS-Themes/inputs/input/fluent.scss +34 -2
  52. package/SCSS-Themes/inputs/input/highcontrast.scss +34 -2
  53. package/SCSS-Themes/inputs/input/material-dark.scss +34 -2
  54. package/SCSS-Themes/inputs/input/material.scss +34 -2
  55. package/SCSS-Themes/inputs/input/material3-dark.scss +34 -2
  56. package/SCSS-Themes/inputs/input/material3.scss +34 -2
  57. package/SCSS-Themes/inputs/input/tailwind-dark.scss +34 -2
  58. package/SCSS-Themes/inputs/input/tailwind.scss +34 -2
  59. package/SCSS-Themes/layouts/splitter/bootstrap-dark.scss +2 -0
  60. package/SCSS-Themes/layouts/splitter/bootstrap.scss +2 -0
  61. package/SCSS-Themes/layouts/splitter/bootstrap4.scss +2 -0
  62. package/SCSS-Themes/layouts/splitter/bootstrap5-dark.scss +2 -0
  63. package/SCSS-Themes/layouts/splitter/bootstrap5.scss +2 -0
  64. package/SCSS-Themes/layouts/splitter/fabric-dark.scss +2 -0
  65. package/SCSS-Themes/layouts/splitter/fabric.scss +2 -0
  66. package/SCSS-Themes/layouts/splitter/fluent-dark.scss +2 -0
  67. package/SCSS-Themes/layouts/splitter/fluent.scss +2 -0
  68. package/SCSS-Themes/layouts/splitter/highcontrast.scss +2 -0
  69. package/SCSS-Themes/layouts/splitter/material-dark.scss +2 -0
  70. package/SCSS-Themes/layouts/splitter/material.scss +2 -0
  71. package/SCSS-Themes/layouts/splitter/material3-dark.scss +2 -0
  72. package/SCSS-Themes/layouts/splitter/material3.scss +2 -0
  73. package/SCSS-Themes/layouts/splitter/tailwind-dark.scss +2 -0
  74. package/SCSS-Themes/layouts/splitter/tailwind.scss +2 -0
  75. package/SCSS-Themes/material-dark.scss +68 -24
  76. package/SCSS-Themes/material.scss +71 -27
  77. package/SCSS-Themes/material3-dark.scss +62 -18
  78. package/SCSS-Themes/material3.scss +62 -18
  79. package/SCSS-Themes/pivotview/pivotfieldlist/bootstrap.scss +3 -3
  80. package/SCSS-Themes/pivotview/pivotfieldlist/bootstrap4.scss +2 -2
  81. package/SCSS-Themes/pivotview/pivotfieldlist/fabric.scss +2 -2
  82. package/SCSS-Themes/pivotview/pivotfieldlist/highcontrast.scss +2 -2
  83. package/SCSS-Themes/pivotview/pivotfieldlist/material-dark.scss +3 -3
  84. package/SCSS-Themes/pivotview/pivotfieldlist/material.scss +4 -4
  85. package/SCSS-Themes/pivotview/pivotview/bootstrap.scss +1 -1
  86. package/SCSS-Themes/pivotview/pivotview/bootstrap4.scss +1 -1
  87. package/SCSS-Themes/pivotview/pivotview/fabric.scss +1 -1
  88. package/SCSS-Themes/pivotview/pivotview/material-dark.scss +3 -3
  89. package/SCSS-Themes/pivotview/pivotview/material.scss +5 -5
  90. package/SCSS-Themes/querybuilder/query-builder/bootstrap-dark.scss +13 -11
  91. package/SCSS-Themes/querybuilder/query-builder/bootstrap.scss +13 -11
  92. package/SCSS-Themes/querybuilder/query-builder/bootstrap4.scss +13 -11
  93. package/SCSS-Themes/querybuilder/query-builder/bootstrap5-dark.scss +13 -11
  94. package/SCSS-Themes/querybuilder/query-builder/bootstrap5.scss +13 -11
  95. package/SCSS-Themes/querybuilder/query-builder/fabric-dark.scss +13 -11
  96. package/SCSS-Themes/querybuilder/query-builder/fabric.scss +13 -11
  97. package/SCSS-Themes/querybuilder/query-builder/fluent-dark.scss +13 -11
  98. package/SCSS-Themes/querybuilder/query-builder/fluent.scss +13 -11
  99. package/SCSS-Themes/querybuilder/query-builder/highcontrast.scss +13 -11
  100. package/SCSS-Themes/querybuilder/query-builder/material-dark.scss +13 -11
  101. package/SCSS-Themes/querybuilder/query-builder/material.scss +13 -11
  102. package/SCSS-Themes/querybuilder/query-builder/material3-dark.scss +13 -11
  103. package/SCSS-Themes/querybuilder/query-builder/material3.scss +13 -11
  104. package/SCSS-Themes/querybuilder/query-builder/tailwind-dark.scss +13 -11
  105. package/SCSS-Themes/querybuilder/query-builder/tailwind.scss +13 -11
  106. package/SCSS-Themes/ribbon/ribbon/bootstrap-dark.scss +1 -0
  107. package/SCSS-Themes/ribbon/ribbon/bootstrap.scss +1 -0
  108. package/SCSS-Themes/ribbon/ribbon/bootstrap4.scss +1 -0
  109. package/SCSS-Themes/ribbon/ribbon/bootstrap5-dark.scss +1 -0
  110. package/SCSS-Themes/ribbon/ribbon/bootstrap5.scss +1 -0
  111. package/SCSS-Themes/ribbon/ribbon/fabric-dark.scss +1 -0
  112. package/SCSS-Themes/ribbon/ribbon/fabric.scss +1 -0
  113. package/SCSS-Themes/ribbon/ribbon/fluent-dark.scss +1 -0
  114. package/SCSS-Themes/ribbon/ribbon/fluent.scss +1 -0
  115. package/SCSS-Themes/ribbon/ribbon/highcontrast.scss +1 -0
  116. package/SCSS-Themes/ribbon/ribbon/material-dark.scss +1 -0
  117. package/SCSS-Themes/ribbon/ribbon/material.scss +1 -0
  118. package/SCSS-Themes/ribbon/ribbon/material3-dark.scss +1 -0
  119. package/SCSS-Themes/ribbon/ribbon/material3.scss +1 -0
  120. package/SCSS-Themes/ribbon/ribbon/tailwind-dark.scss +1 -0
  121. package/SCSS-Themes/ribbon/ribbon/tailwind.scss +1 -0
  122. package/SCSS-Themes/tailwind-dark.scss +62 -18
  123. package/SCSS-Themes/tailwind.scss +62 -18
  124. package/package.json +1 -1
package/SCSS-Themes/querybuilder/query-builder/fluent-dark.scss CHANGED
@@ -141,8 +141,6 @@ $qrybldr-collapse-brdr-color: $border-light !default;
141
141
  &.e-not {
142
142
  @if $skin-name == 'Material3' {
143
143
  border: 1px solid $secondary-outline-border;
144
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
145
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
146
144
  }
147
145
  @else {
148
146
  border-bottom-right-radius: 0;
@@ -171,14 +169,16 @@ $qrybldr-collapse-brdr-color: $border-light !default;
171
169
  & .e-btn-group.e-rtl .e-qb-toggle.e-btn.e-small {
172
170
  @if $skin-name == 'Material3' {
173
171
  border: 1px solid $secondary-outline-border;
174
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
175
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
172
+ border-bottom-right-radius: 4px;
173
+ border-bottom-left-radius: 0;
174
+ border-top-left-radius: 0;
175
+ border-top-right-radius: 4px;
176
176
  }
177
177
  @else {
178
178
  border-bottom-left-radius: 0;
179
179
  border-top-left-radius: 0;
180
+ border-top-right-radius: 0;
180
181
  }
181
- border-top-right-radius: $qrybldr-btngrp-brdr-radius;
182
182
 
183
183
  &.e-not-readonly {
184
184
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
@@ -322,8 +322,8 @@ $qrybldr-collapse-brdr-color: $border-light !default;
322
322
  @if $skin-name == 'Material3' {
323
323
  border: 1px solid $secondary-outline-border;
324
324
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
325
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
326
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
325
+ border-bottom-left-radius: 4px;
326
+ border-top-left-radius: 4px;
327
327
  border-top-right-radius: $qrybldr-btngrp-brdr-radius;
328
328
  }
329
329
  @else {
@@ -366,6 +366,8 @@ $qrybldr-collapse-brdr-color: $border-light !default;
366
366
  &.e-not {
367
367
  @if $skin-name == 'Material3' {
368
368
  border: 1px solid $secondary-outline-border;
369
+ border-bottom-right-radius: 0;
370
+ border-top-right-radius: 0;
369
371
  }
370
372
  border-bottom-left-radius: 0;
371
373
  border-top-left-radius: 0;
@@ -384,11 +386,11 @@ $qrybldr-collapse-brdr-color: $border-light !default;
384
386
  & .e-btn.e-btngroup-or-lbl.e-small {
385
387
  @if $skin-name == 'Material3' {
386
388
  border: 1px solid $secondary-outline-border;
387
- border-bottom-right-radius: 20px;
388
- border-top-right-radius: 20px;
389
389
  }
390
- border-bottom-left-radius: 0;
391
- border-top-left-radius: 0;
390
+ @else {
391
+ border-bottom-left-radius: 0;
392
+ border-top-left-radius: 0;
393
+ }
392
394
 
393
395
  &.e-readonly-or-not {
394
396
  border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
package/SCSS-Themes/querybuilder/query-builder/fluent.scss CHANGED
@@ -141,8 +141,6 @@ $qrybldr-collapse-brdr-color: $border-light !default;
141
141
  &.e-not {
142
142
  @if $skin-name == 'Material3' {
143
143
  border: 1px solid $secondary-outline-border;
144
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
145
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
146
144
  }
147
145
  @else {
148
146
  border-bottom-right-radius: 0;
@@ -171,14 +169,16 @@ $qrybldr-collapse-brdr-color: $border-light !default;
171
169
  & .e-btn-group.e-rtl .e-qb-toggle.e-btn.e-small {
172
170
  @if $skin-name == 'Material3' {
173
171
  border: 1px solid $secondary-outline-border;
174
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
175
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
172
+ border-bottom-right-radius: 4px;
173
+ border-bottom-left-radius: 0;
174
+ border-top-left-radius: 0;
175
+ border-top-right-radius: 4px;
176
176
  }
177
177
  @else {
178
178
  border-bottom-left-radius: 0;
179
179
  border-top-left-radius: 0;
180
+ border-top-right-radius: 0;
180
181
  }
181
- border-top-right-radius: $qrybldr-btngrp-brdr-radius;
182
182
 
183
183
  &.e-not-readonly {
184
184
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
@@ -322,8 +322,8 @@ $qrybldr-collapse-brdr-color: $border-light !default;
322
322
  @if $skin-name == 'Material3' {
323
323
  border: 1px solid $secondary-outline-border;
324
324
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
325
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
326
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
325
+ border-bottom-left-radius: 4px;
326
+ border-top-left-radius: 4px;
327
327
  border-top-right-radius: $qrybldr-btngrp-brdr-radius;
328
328
  }
329
329
  @else {
@@ -366,6 +366,8 @@ $qrybldr-collapse-brdr-color: $border-light !default;
366
366
  &.e-not {
367
367
  @if $skin-name == 'Material3' {
368
368
  border: 1px solid $secondary-outline-border;
369
+ border-bottom-right-radius: 0;
370
+ border-top-right-radius: 0;
369
371
  }
370
372
  border-bottom-left-radius: 0;
371
373
  border-top-left-radius: 0;
@@ -384,11 +386,11 @@ $qrybldr-collapse-brdr-color: $border-light !default;
384
386
  & .e-btn.e-btngroup-or-lbl.e-small {
385
387
  @if $skin-name == 'Material3' {
386
388
  border: 1px solid $secondary-outline-border;
387
- border-bottom-right-radius: 20px;
388
- border-top-right-radius: 20px;
389
389
  }
390
- border-bottom-left-radius: 0;
391
- border-top-left-radius: 0;
390
+ @else {
391
+ border-bottom-left-radius: 0;
392
+ border-top-left-radius: 0;
393
+ }
392
394
 
393
395
  &.e-readonly-or-not {
394
396
  border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
package/SCSS-Themes/querybuilder/query-builder/highcontrast.scss CHANGED
@@ -138,8 +138,6 @@ $qrybldr-btngrp-brdr-radius: 0 !default;
138
138
  &.e-not {
139
139
  @if $skin-name == 'Material3' {
140
140
  border: 1px solid $secondary-outline-border;
141
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
142
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
143
141
  }
144
142
  @else {
145
143
  border-bottom-right-radius: 0;
@@ -168,14 +166,16 @@ $qrybldr-btngrp-brdr-radius: 0 !default;
168
166
  & .e-btn-group.e-rtl .e-qb-toggle.e-btn.e-small {
169
167
  @if $skin-name == 'Material3' {
170
168
  border: 1px solid $secondary-outline-border;
171
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
172
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
169
+ border-bottom-right-radius: 4px;
170
+ border-bottom-left-radius: 0;
171
+ border-top-left-radius: 0;
172
+ border-top-right-radius: 4px;
173
173
  }
174
174
  @else {
175
175
  border-bottom-left-radius: 0;
176
176
  border-top-left-radius: 0;
177
+ border-top-right-radius: 0;
177
178
  }
178
- border-top-right-radius: $qrybldr-btngrp-brdr-radius;
179
179
 
180
180
  &.e-not-readonly {
181
181
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
@@ -319,8 +319,8 @@ $qrybldr-btngrp-brdr-radius: 0 !default;
319
319
  @if $skin-name == 'Material3' {
320
320
  border: 1px solid $secondary-outline-border;
321
321
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
322
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
323
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
322
+ border-bottom-left-radius: 4px;
323
+ border-top-left-radius: 4px;
324
324
  border-top-right-radius: $qrybldr-btngrp-brdr-radius;
325
325
  }
326
326
  @else {
@@ -363,6 +363,8 @@ $qrybldr-btngrp-brdr-radius: 0 !default;
363
363
  &.e-not {
364
364
  @if $skin-name == 'Material3' {
365
365
  border: 1px solid $secondary-outline-border;
366
+ border-bottom-right-radius: 0;
367
+ border-top-right-radius: 0;
366
368
  }
367
369
  border-bottom-left-radius: 0;
368
370
  border-top-left-radius: 0;
@@ -381,11 +383,11 @@ $qrybldr-btngrp-brdr-radius: 0 !default;
381
383
  & .e-btn.e-btngroup-or-lbl.e-small {
382
384
  @if $skin-name == 'Material3' {
383
385
  border: 1px solid $secondary-outline-border;
384
- border-bottom-right-radius: 20px;
385
- border-top-right-radius: 20px;
386
386
  }
387
- border-bottom-left-radius: 0;
388
- border-top-left-radius: 0;
387
+ @else {
388
+ border-bottom-left-radius: 0;
389
+ border-top-left-radius: 0;
390
+ }
389
391
 
390
392
  &.e-readonly-or-not {
391
393
  border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
package/SCSS-Themes/querybuilder/query-builder/material-dark.scss CHANGED
@@ -139,8 +139,6 @@ $qrybldr-btngrp-brdr-radius: 2px !default;
139
139
  &.e-not {
140
140
  @if $skin-name == 'Material3' {
141
141
  border: 1px solid $secondary-outline-border;
142
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
143
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
144
142
  }
145
143
  @else {
146
144
  border-bottom-right-radius: 0;
@@ -169,14 +167,16 @@ $qrybldr-btngrp-brdr-radius: 2px !default;
169
167
  & .e-btn-group.e-rtl .e-qb-toggle.e-btn.e-small {
170
168
  @if $skin-name == 'Material3' {
171
169
  border: 1px solid $secondary-outline-border;
172
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
173
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
170
+ border-bottom-right-radius: 4px;
171
+ border-bottom-left-radius: 0;
172
+ border-top-left-radius: 0;
173
+ border-top-right-radius: 4px;
174
174
  }
175
175
  @else {
176
176
  border-bottom-left-radius: 0;
177
177
  border-top-left-radius: 0;
178
+ border-top-right-radius: 0;
178
179
  }
179
- border-top-right-radius: $qrybldr-btngrp-brdr-radius;
180
180
 
181
181
  &.e-not-readonly {
182
182
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
@@ -320,8 +320,8 @@ $qrybldr-btngrp-brdr-radius: 2px !default;
320
320
  @if $skin-name == 'Material3' {
321
321
  border: 1px solid $secondary-outline-border;
322
322
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
323
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
324
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
323
+ border-bottom-left-radius: 4px;
324
+ border-top-left-radius: 4px;
325
325
  border-top-right-radius: $qrybldr-btngrp-brdr-radius;
326
326
  }
327
327
  @else {
@@ -364,6 +364,8 @@ $qrybldr-btngrp-brdr-radius: 2px !default;
364
364
  &.e-not {
365
365
  @if $skin-name == 'Material3' {
366
366
  border: 1px solid $secondary-outline-border;
367
+ border-bottom-right-radius: 0;
368
+ border-top-right-radius: 0;
367
369
  }
368
370
  border-bottom-left-radius: 0;
369
371
  border-top-left-radius: 0;
@@ -382,11 +384,11 @@ $qrybldr-btngrp-brdr-radius: 2px !default;
382
384
  & .e-btn.e-btngroup-or-lbl.e-small {
383
385
  @if $skin-name == 'Material3' {
384
386
  border: 1px solid $secondary-outline-border;
385
- border-bottom-right-radius: 20px;
386
- border-top-right-radius: 20px;
387
387
  }
388
- border-bottom-left-radius: 0;
389
- border-top-left-radius: 0;
388
+ @else {
389
+ border-bottom-left-radius: 0;
390
+ border-top-left-radius: 0;
391
+ }
390
392
 
391
393
  &.e-readonly-or-not {
392
394
  border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
package/SCSS-Themes/querybuilder/query-builder/material.scss CHANGED
@@ -138,8 +138,6 @@ $qrybldr-btngrp-brdr-radius: 2px !default;
138
138
  &.e-not {
139
139
  @if $skin-name == 'Material3' {
140
140
  border: 1px solid $secondary-outline-border;
141
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
142
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
143
141
  }
144
142
  @else {
145
143
  border-bottom-right-radius: 0;
@@ -168,14 +166,16 @@ $qrybldr-btngrp-brdr-radius: 2px !default;
168
166
  & .e-btn-group.e-rtl .e-qb-toggle.e-btn.e-small {
169
167
  @if $skin-name == 'Material3' {
170
168
  border: 1px solid $secondary-outline-border;
171
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
172
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
169
+ border-bottom-right-radius: 4px;
170
+ border-bottom-left-radius: 0;
171
+ border-top-left-radius: 0;
172
+ border-top-right-radius: 4px;
173
173
  }
174
174
  @else {
175
175
  border-bottom-left-radius: 0;
176
176
  border-top-left-radius: 0;
177
+ border-top-right-radius: 0;
177
178
  }
178
- border-top-right-radius: $qrybldr-btngrp-brdr-radius;
179
179
 
180
180
  &.e-not-readonly {
181
181
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
@@ -319,8 +319,8 @@ $qrybldr-btngrp-brdr-radius: 2px !default;
319
319
  @if $skin-name == 'Material3' {
320
320
  border: 1px solid $secondary-outline-border;
321
321
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
322
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
323
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
322
+ border-bottom-left-radius: 4px;
323
+ border-top-left-radius: 4px;
324
324
  border-top-right-radius: $qrybldr-btngrp-brdr-radius;
325
325
  }
326
326
  @else {
@@ -363,6 +363,8 @@ $qrybldr-btngrp-brdr-radius: 2px !default;
363
363
  &.e-not {
364
364
  @if $skin-name == 'Material3' {
365
365
  border: 1px solid $secondary-outline-border;
366
+ border-bottom-right-radius: 0;
367
+ border-top-right-radius: 0;
366
368
  }
367
369
  border-bottom-left-radius: 0;
368
370
  border-top-left-radius: 0;
@@ -381,11 +383,11 @@ $qrybldr-btngrp-brdr-radius: 2px !default;
381
383
  & .e-btn.e-btngroup-or-lbl.e-small {
382
384
  @if $skin-name == 'Material3' {
383
385
  border: 1px solid $secondary-outline-border;
384
- border-bottom-right-radius: 20px;
385
- border-top-right-radius: 20px;
386
386
  }
387
- border-bottom-left-radius: 0;
388
- border-top-left-radius: 0;
387
+ @else {
388
+ border-bottom-left-radius: 0;
389
+ border-top-left-radius: 0;
390
+ }
389
391
 
390
392
  &.e-readonly-or-not {
391
393
  border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
package/SCSS-Themes/querybuilder/query-builder/material3-dark.scss CHANGED
@@ -144,8 +144,6 @@ $qrybldr-icon-color: rgba($icon-color) !default;
144
144
  &.e-not {
145
145
  @if $skin-name == 'Material3' {
146
146
  border: 1px solid $secondary-outline-border;
147
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
148
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
149
147
  }
150
148
  @else {
151
149
  border-bottom-right-radius: 0;
@@ -174,14 +172,16 @@ $qrybldr-icon-color: rgba($icon-color) !default;
174
172
  & .e-btn-group.e-rtl .e-qb-toggle.e-btn.e-small {
175
173
  @if $skin-name == 'Material3' {
176
174
  border: 1px solid $secondary-outline-border;
177
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
178
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
175
+ border-bottom-right-radius: 4px;
176
+ border-bottom-left-radius: 0;
177
+ border-top-left-radius: 0;
178
+ border-top-right-radius: 4px;
179
179
  }
180
180
  @else {
181
181
  border-bottom-left-radius: 0;
182
182
  border-top-left-radius: 0;
183
+ border-top-right-radius: 0;
183
184
  }
184
- border-top-right-radius: $qrybldr-btngrp-brdr-radius;
185
185
 
186
186
  &.e-not-readonly {
187
187
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
@@ -325,8 +325,8 @@ $qrybldr-icon-color: rgba($icon-color) !default;
325
325
  @if $skin-name == 'Material3' {
326
326
  border: 1px solid $secondary-outline-border;
327
327
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
328
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
329
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
328
+ border-bottom-left-radius: 4px;
329
+ border-top-left-radius: 4px;
330
330
  border-top-right-radius: $qrybldr-btngrp-brdr-radius;
331
331
  }
332
332
  @else {
@@ -369,6 +369,8 @@ $qrybldr-icon-color: rgba($icon-color) !default;
369
369
  &.e-not {
370
370
  @if $skin-name == 'Material3' {
371
371
  border: 1px solid $secondary-outline-border;
372
+ border-bottom-right-radius: 0;
373
+ border-top-right-radius: 0;
372
374
  }
373
375
  border-bottom-left-radius: 0;
374
376
  border-top-left-radius: 0;
@@ -387,11 +389,11 @@ $qrybldr-icon-color: rgba($icon-color) !default;
387
389
  & .e-btn.e-btngroup-or-lbl.e-small {
388
390
  @if $skin-name == 'Material3' {
389
391
  border: 1px solid $secondary-outline-border;
390
- border-bottom-right-radius: 20px;
391
- border-top-right-radius: 20px;
392
392
  }
393
- border-bottom-left-radius: 0;
394
- border-top-left-radius: 0;
393
+ @else {
394
+ border-bottom-left-radius: 0;
395
+ border-top-left-radius: 0;
396
+ }
395
397
 
396
398
  &.e-readonly-or-not {
397
399
  border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
package/SCSS-Themes/querybuilder/query-builder/material3.scss CHANGED
@@ -144,8 +144,6 @@ $qrybldr-icon-color: rgba($icon-color) !default;
144
144
  &.e-not {
145
145
  @if $skin-name == 'Material3' {
146
146
  border: 1px solid $secondary-outline-border;
147
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
148
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
149
147
  }
150
148
  @else {
151
149
  border-bottom-right-radius: 0;
@@ -174,14 +172,16 @@ $qrybldr-icon-color: rgba($icon-color) !default;
174
172
  & .e-btn-group.e-rtl .e-qb-toggle.e-btn.e-small {
175
173
  @if $skin-name == 'Material3' {
176
174
  border: 1px solid $secondary-outline-border;
177
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
178
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
175
+ border-bottom-right-radius: 4px;
176
+ border-bottom-left-radius: 0;
177
+ border-top-left-radius: 0;
178
+ border-top-right-radius: 4px;
179
179
  }
180
180
  @else {
181
181
  border-bottom-left-radius: 0;
182
182
  border-top-left-radius: 0;
183
+ border-top-right-radius: 0;
183
184
  }
184
- border-top-right-radius: $qrybldr-btngrp-brdr-radius;
185
185
 
186
186
  &.e-not-readonly {
187
187
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
@@ -325,8 +325,8 @@ $qrybldr-icon-color: rgba($icon-color) !default;
325
325
  @if $skin-name == 'Material3' {
326
326
  border: 1px solid $secondary-outline-border;
327
327
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
328
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
329
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
328
+ border-bottom-left-radius: 4px;
329
+ border-top-left-radius: 4px;
330
330
  border-top-right-radius: $qrybldr-btngrp-brdr-radius;
331
331
  }
332
332
  @else {
@@ -369,6 +369,8 @@ $qrybldr-icon-color: rgba($icon-color) !default;
369
369
  &.e-not {
370
370
  @if $skin-name == 'Material3' {
371
371
  border: 1px solid $secondary-outline-border;
372
+ border-bottom-right-radius: 0;
373
+ border-top-right-radius: 0;
372
374
  }
373
375
  border-bottom-left-radius: 0;
374
376
  border-top-left-radius: 0;
@@ -387,11 +389,11 @@ $qrybldr-icon-color: rgba($icon-color) !default;
387
389
  & .e-btn.e-btngroup-or-lbl.e-small {
388
390
  @if $skin-name == 'Material3' {
389
391
  border: 1px solid $secondary-outline-border;
390
- border-bottom-right-radius: 20px;
391
- border-top-right-radius: 20px;
392
392
  }
393
- border-bottom-left-radius: 0;
394
- border-top-left-radius: 0;
393
+ @else {
394
+ border-bottom-left-radius: 0;
395
+ border-top-left-radius: 0;
396
+ }
395
397
 
396
398
  &.e-readonly-or-not {
397
399
  border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
package/SCSS-Themes/querybuilder/query-builder/tailwind-dark.scss CHANGED
@@ -141,8 +141,6 @@ $qrybldr-collapse-brdr-color: $border-light !default;
141
141
  &.e-not {
142
142
  @if $skin-name == 'Material3' {
143
143
  border: 1px solid $secondary-outline-border;
144
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
145
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
146
144
  }
147
145
  @else {
148
146
  border-bottom-right-radius: 0;
@@ -171,14 +169,16 @@ $qrybldr-collapse-brdr-color: $border-light !default;
171
169
  & .e-btn-group.e-rtl .e-qb-toggle.e-btn.e-small {
172
170
  @if $skin-name == 'Material3' {
173
171
  border: 1px solid $secondary-outline-border;
174
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
175
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
172
+ border-bottom-right-radius: 4px;
173
+ border-bottom-left-radius: 0;
174
+ border-top-left-radius: 0;
175
+ border-top-right-radius: 4px;
176
176
  }
177
177
  @else {
178
178
  border-bottom-left-radius: 0;
179
179
  border-top-left-radius: 0;
180
+ border-top-right-radius: 0;
180
181
  }
181
- border-top-right-radius: $qrybldr-btngrp-brdr-radius;
182
182
 
183
183
  &.e-not-readonly {
184
184
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
@@ -322,8 +322,8 @@ $qrybldr-collapse-brdr-color: $border-light !default;
322
322
  @if $skin-name == 'Material3' {
323
323
  border: 1px solid $secondary-outline-border;
324
324
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
325
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
326
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
325
+ border-bottom-left-radius: 4px;
326
+ border-top-left-radius: 4px;
327
327
  border-top-right-radius: $qrybldr-btngrp-brdr-radius;
328
328
  }
329
329
  @else {
@@ -366,6 +366,8 @@ $qrybldr-collapse-brdr-color: $border-light !default;
366
366
  &.e-not {
367
367
  @if $skin-name == 'Material3' {
368
368
  border: 1px solid $secondary-outline-border;
369
+ border-bottom-right-radius: 0;
370
+ border-top-right-radius: 0;
369
371
  }
370
372
  border-bottom-left-radius: 0;
371
373
  border-top-left-radius: 0;
@@ -384,11 +386,11 @@ $qrybldr-collapse-brdr-color: $border-light !default;
384
386
  & .e-btn.e-btngroup-or-lbl.e-small {
385
387
  @if $skin-name == 'Material3' {
386
388
  border: 1px solid $secondary-outline-border;
387
- border-bottom-right-radius: 20px;
388
- border-top-right-radius: 20px;
389
389
  }
390
- border-bottom-left-radius: 0;
391
- border-top-left-radius: 0;
390
+ @else {
391
+ border-bottom-left-radius: 0;
392
+ border-top-left-radius: 0;
393
+ }
392
394
 
393
395
  &.e-readonly-or-not {
394
396
  border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
package/SCSS-Themes/querybuilder/query-builder/tailwind.scss CHANGED
@@ -141,8 +141,6 @@ $qrybldr-collapse-brdr-color: $border-light !default;
141
141
  &.e-not {
142
142
  @if $skin-name == 'Material3' {
143
143
  border: 1px solid $secondary-outline-border;
144
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
145
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
146
144
  }
147
145
  @else {
148
146
  border-bottom-right-radius: 0;
@@ -171,14 +169,16 @@ $qrybldr-collapse-brdr-color: $border-light !default;
171
169
  & .e-btn-group.e-rtl .e-qb-toggle.e-btn.e-small {
172
170
  @if $skin-name == 'Material3' {
173
171
  border: 1px solid $secondary-outline-border;
174
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
175
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
172
+ border-bottom-right-radius: 4px;
173
+ border-bottom-left-radius: 0;
174
+ border-top-left-radius: 0;
175
+ border-top-right-radius: 4px;
176
176
  }
177
177
  @else {
178
178
  border-bottom-left-radius: 0;
179
179
  border-top-left-radius: 0;
180
+ border-top-right-radius: 0;
180
181
  }
181
- border-top-right-radius: $qrybldr-btngrp-brdr-radius;
182
182
 
183
183
  &.e-not-readonly {
184
184
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
@@ -322,8 +322,8 @@ $qrybldr-collapse-brdr-color: $border-light !default;
322
322
  @if $skin-name == 'Material3' {
323
323
  border: 1px solid $secondary-outline-border;
324
324
  border-bottom-right-radius: $qrybldr-btngrp-brdr-radius;
325
- border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
326
- border-top-left-radius: $qrybldr-btngrp-brdr-radius;
325
+ border-bottom-left-radius: 4px;
326
+ border-top-left-radius: 4px;
327
327
  border-top-right-radius: $qrybldr-btngrp-brdr-radius;
328
328
  }
329
329
  @else {
@@ -366,6 +366,8 @@ $qrybldr-collapse-brdr-color: $border-light !default;
366
366
  &.e-not {
367
367
  @if $skin-name == 'Material3' {
368
368
  border: 1px solid $secondary-outline-border;
369
+ border-bottom-right-radius: 0;
370
+ border-top-right-radius: 0;
369
371
  }
370
372
  border-bottom-left-radius: 0;
371
373
  border-top-left-radius: 0;
@@ -384,11 +386,11 @@ $qrybldr-collapse-brdr-color: $border-light !default;
384
386
  & .e-btn.e-btngroup-or-lbl.e-small {
385
387
  @if $skin-name == 'Material3' {
386
388
  border: 1px solid $secondary-outline-border;
387
- border-bottom-right-radius: 20px;
388
- border-top-right-radius: 20px;
389
389
  }
390
- border-bottom-left-radius: 0;
391
- border-top-left-radius: 0;
390
+ @else {
391
+ border-bottom-left-radius: 0;
392
+ border-top-left-radius: 0;
393
+ }
392
394
 
393
395
  &.e-readonly-or-not {
394
396
  border-bottom-left-radius: $qrybldr-btngrp-brdr-radius;
package/SCSS-Themes/ribbon/ribbon/bootstrap-dark.scss CHANGED
@@ -913,6 +913,7 @@ $ribbon-overflow-box-shadow: 0 6px 12px rgba($grey-base, .175) !default;
913
913
  > .e-split-btn-wrapper .e-btn,
914
914
  > .e-btn {
915
915
  line-height: $ribbon-overflow-item-btn-height;
916
+ overflow: hidden;
916
917
  }
917
918
 
918
919
  >.e-split-btn-wrapper {
package/SCSS-Themes/ribbon/ribbon/bootstrap.scss CHANGED
@@ -913,6 +913,7 @@ $ribbon-overflow-box-shadow: 0 6px 12px rgba($grey-base, .175) !default;
913
913
  > .e-split-btn-wrapper .e-btn,
914
914
  > .e-btn {
915
915
  line-height: $ribbon-overflow-item-btn-height;
916
+ overflow: hidden;
916
917
  }
917
918
 
918
919
  >.e-split-btn-wrapper {
package/SCSS-Themes/ribbon/ribbon/bootstrap4.scss CHANGED
@@ -913,6 +913,7 @@ $ribbon-overflow-box-shadow: none !default;
913
913
  > .e-split-btn-wrapper .e-btn,
914
914
  > .e-btn {
915
915
  line-height: $ribbon-overflow-item-btn-height;
916
+ overflow: hidden;
916
917
  }
917
918
 
918
919
  >.e-split-btn-wrapper {
package/SCSS-Themes/ribbon/ribbon/bootstrap5-dark.scss CHANGED
@@ -913,6 +913,7 @@ $ribbon-overflow-box-shadow: none !default;
913
913
  > .e-split-btn-wrapper .e-btn,
914
914
  > .e-btn {
915
915
  line-height: $ribbon-overflow-item-btn-height;
916
+ overflow: hidden;
916
917
  }
917
918
 
918
919
  >.e-split-btn-wrapper {
package/SCSS-Themes/ribbon/ribbon/bootstrap5.scss CHANGED
@@ -913,6 +913,7 @@ $ribbon-overflow-box-shadow: none !default;
913
913
  > .e-split-btn-wrapper .e-btn,
914
914
  > .e-btn {
915
915
  line-height: $ribbon-overflow-item-btn-height;
916
+ overflow: hidden;
916
917
  }
917
918
 
918
919
  >.e-split-btn-wrapper {
package/SCSS-Themes/ribbon/ribbon/fabric-dark.scss CHANGED
@@ -913,6 +913,7 @@ $ribbon-overflow-box-shadow: 0 2px 5px 0 rgba($shadow, .26) !default;
913
913
  > .e-split-btn-wrapper .e-btn,
914
914
  > .e-btn {
915
915
  line-height: $ribbon-overflow-item-btn-height;
916
+ overflow: hidden;
916
917
  }
917
918
 
918
919
  >.e-split-btn-wrapper {
package/SCSS-Themes/ribbon/ribbon/fabric.scss CHANGED
@@ -913,6 +913,7 @@ $ribbon-overflow-box-shadow: 0 0 10px 0 rgba($neutral-black, .2) !default;
913
913
  > .e-split-btn-wrapper .e-btn,
914
914
  > .e-btn {
915
915
  line-height: $ribbon-overflow-item-btn-height;
916
+ overflow: hidden;
916
917
  }
917
918
 
918
919
  >.e-split-btn-wrapper {
package/SCSS-Themes/ribbon/ribbon/fluent-dark.scss CHANGED
@@ -913,6 +913,7 @@ $ribbon-overflow-box-shadow: $shadow-md !default;
913
913
  > .e-split-btn-wrapper .e-btn,
914
914
  > .e-btn {
915
915
  line-height: $ribbon-overflow-item-btn-height;
916
+ overflow: hidden;
916
917
  }
917
918
 
918
919
  >.e-split-btn-wrapper {
package/SCSS-Themes/ribbon/ribbon/fluent.scss CHANGED
@@ -913,6 +913,7 @@ $ribbon-overflow-box-shadow: $shadow-md !default;
913
913
  > .e-split-btn-wrapper .e-btn,
914
914
  > .e-btn {
915
915
  line-height: $ribbon-overflow-item-btn-height;
916
+ overflow: hidden;
916
917
  }
917
918
 
918
919
  >.e-split-btn-wrapper {