@syncfusion/ej2-angular-inputs 23.2.4 → 24.1.41

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 (142) hide show
  1. package/package.json +9 -9
  2. package/schematics/utils/lib-details.d.ts +2 -2
  3. package/schematics/utils/lib-details.js +2 -2
  4. package/schematics/utils/lib-details.ts +2 -2
  5. package/styles/bootstrap-dark.css +263 -3
  6. package/styles/bootstrap-dark.scss +1 -0
  7. package/styles/bootstrap.css +263 -3
  8. package/styles/bootstrap.scss +1 -0
  9. package/styles/bootstrap4.css +263 -3
  10. package/styles/bootstrap4.scss +1 -0
  11. package/styles/bootstrap5-dark.css +276 -3
  12. package/styles/bootstrap5-dark.scss +1 -0
  13. package/styles/bootstrap5.css +276 -3
  14. package/styles/bootstrap5.scss +1 -0
  15. package/styles/color-picker/_layout.scss +36 -0
  16. package/styles/color-picker/bootstrap5-dark.css +13 -0
  17. package/styles/color-picker/bootstrap5.css +13 -0
  18. package/styles/color-picker/fabric.css +5 -0
  19. package/styles/color-picker/fluent-dark.css +13 -0
  20. package/styles/color-picker/fluent.css +13 -0
  21. package/styles/color-picker/material.css +13 -0
  22. package/styles/color-picker/material3-dark.css +18 -0
  23. package/styles/color-picker/material3.css +18 -0
  24. package/styles/color-picker/tailwind-dark.css +13 -0
  25. package/styles/color-picker/tailwind.css +13 -0
  26. package/styles/data-form/_all.scss +2 -0
  27. package/styles/data-form/_bootstrap-dark-definition.scss +42 -0
  28. package/styles/data-form/_bootstrap-definition.scss +41 -0
  29. package/styles/data-form/_bootstrap4-definition.scss +41 -0
  30. package/styles/data-form/_bootstrap5-dark-definition.scss +1 -0
  31. package/styles/data-form/_bootstrap5-definition.scss +41 -0
  32. package/styles/data-form/_fabric-dark-definition.scss +41 -0
  33. package/styles/data-form/_fabric-definition.scss +41 -0
  34. package/styles/data-form/_fluent-dark-definition.scss +1 -0
  35. package/styles/data-form/_fluent-definition.scss +41 -0
  36. package/styles/data-form/_fusionnew-definition.scss +41 -0
  37. package/styles/data-form/_highcontrast-definition.scss +41 -0
  38. package/styles/data-form/_highcontrast-light-definition.scss +41 -0
  39. package/styles/data-form/_layout.scss +223 -0
  40. package/styles/data-form/_material-dark-definition.scss +41 -0
  41. package/styles/data-form/_material-definition.scss +42 -0
  42. package/styles/data-form/_material3-dark-definition.scss +1 -0
  43. package/styles/data-form/_material3-definition.scss +41 -0
  44. package/styles/data-form/_tailwind-dark-definition.scss +1 -0
  45. package/styles/data-form/_tailwind-definition.scss +41 -0
  46. package/styles/data-form/_theme.scss +38 -0
  47. package/styles/data-form/bootstrap-dark.css +240 -0
  48. package/styles/data-form/bootstrap-dark.scss +3 -0
  49. package/styles/data-form/bootstrap.css +240 -0
  50. package/styles/data-form/bootstrap.scss +3 -0
  51. package/styles/data-form/bootstrap4.css +240 -0
  52. package/styles/data-form/bootstrap4.scss +3 -0
  53. package/styles/data-form/bootstrap5-dark.css +240 -0
  54. package/styles/data-form/bootstrap5-dark.scss +3 -0
  55. package/styles/data-form/bootstrap5.css +240 -0
  56. package/styles/data-form/bootstrap5.scss +3 -0
  57. package/styles/data-form/fabric-dark.css +240 -0
  58. package/styles/data-form/fabric-dark.scss +3 -0
  59. package/styles/data-form/fabric.css +240 -0
  60. package/styles/data-form/fabric.scss +3 -0
  61. package/styles/data-form/fluent-dark.css +240 -0
  62. package/styles/data-form/fluent-dark.scss +3 -0
  63. package/styles/data-form/fluent.css +240 -0
  64. package/styles/data-form/fluent.scss +3 -0
  65. package/styles/data-form/highcontrast-light.css +240 -0
  66. package/styles/data-form/highcontrast-light.scss +3 -0
  67. package/styles/data-form/highcontrast.css +240 -0
  68. package/styles/data-form/highcontrast.scss +3 -0
  69. package/styles/data-form/material-dark.css +240 -0
  70. package/styles/data-form/material-dark.scss +3 -0
  71. package/styles/data-form/material.css +240 -0
  72. package/styles/data-form/material.scss +3 -0
  73. package/styles/data-form/material3-dark.css +295 -0
  74. package/styles/data-form/material3-dark.scss +4 -0
  75. package/styles/data-form/material3.css +351 -0
  76. package/styles/data-form/material3.scss +4 -0
  77. package/styles/data-form/tailwind-dark.css +240 -0
  78. package/styles/data-form/tailwind-dark.scss +3 -0
  79. package/styles/data-form/tailwind.css +240 -0
  80. package/styles/data-form/tailwind.scss +3 -0
  81. package/styles/fabric-dark.css +263 -3
  82. package/styles/fabric-dark.scss +1 -0
  83. package/styles/fabric.css +268 -3
  84. package/styles/fabric.scss +1 -0
  85. package/styles/fluent-dark.css +276 -3
  86. package/styles/fluent-dark.scss +1 -0
  87. package/styles/fluent.css +276 -3
  88. package/styles/fluent.scss +1 -0
  89. package/styles/highcontrast-light.css +263 -3
  90. package/styles/highcontrast-light.scss +1 -0
  91. package/styles/highcontrast.css +263 -3
  92. package/styles/highcontrast.scss +1 -0
  93. package/styles/material-dark.css +275 -3
  94. package/styles/material-dark.scss +1 -0
  95. package/styles/material.css +288 -3
  96. package/styles/material.scss +1 -0
  97. package/styles/material3-dark.css +293 -3
  98. package/styles/material3-dark.scss +1 -0
  99. package/styles/material3.css +293 -3
  100. package/styles/material3.scss +1 -0
  101. package/styles/rating/_bootstrap-dark-definition.scss +4 -0
  102. package/styles/rating/_bootstrap-definition.scss +4 -0
  103. package/styles/rating/_bootstrap4-definition.scss +4 -0
  104. package/styles/rating/_bootstrap5-definition.scss +4 -0
  105. package/styles/rating/_fabric-dark-definition.scss +4 -0
  106. package/styles/rating/_fabric-definition.scss +4 -0
  107. package/styles/rating/_fluent-definition.scss +4 -0
  108. package/styles/rating/_fusionnew-definition.scss +4 -0
  109. package/styles/rating/_highcontrast-definition.scss +4 -0
  110. package/styles/rating/_highcontrast-light-definition.scss +4 -0
  111. package/styles/rating/_layout.scss +21 -7
  112. package/styles/rating/_material-dark-definition.scss +4 -0
  113. package/styles/rating/_material-definition.scss +4 -0
  114. package/styles/rating/_material3-definition.scss +4 -0
  115. package/styles/rating/_tailwind-definition.scss +4 -0
  116. package/styles/rating/_theme.scss +5 -2
  117. package/styles/rating/bootstrap-dark.css +22 -3
  118. package/styles/rating/bootstrap.css +22 -3
  119. package/styles/rating/bootstrap4.css +22 -3
  120. package/styles/rating/bootstrap5-dark.css +22 -3
  121. package/styles/rating/bootstrap5.css +22 -3
  122. package/styles/rating/fabric-dark.css +22 -3
  123. package/styles/rating/fabric.css +22 -3
  124. package/styles/rating/fluent-dark.css +22 -3
  125. package/styles/rating/fluent.css +22 -3
  126. package/styles/rating/highcontrast-light.css +22 -3
  127. package/styles/rating/highcontrast.css +22 -3
  128. package/styles/rating/material-dark.css +22 -3
  129. package/styles/rating/material.css +22 -3
  130. package/styles/rating/material3-dark.css +22 -3
  131. package/styles/rating/material3.css +22 -3
  132. package/styles/rating/tailwind-dark.css +22 -3
  133. package/styles/rating/tailwind.css +22 -3
  134. package/styles/slider/_layout.scss +4 -0
  135. package/styles/slider/material-dark.css +12 -0
  136. package/styles/slider/material.css +12 -0
  137. package/styles/slider/material3-dark.css +12 -0
  138. package/styles/slider/material3.css +12 -0
  139. package/styles/tailwind-dark.css +276 -3
  140. package/styles/tailwind-dark.scss +1 -0
  141. package/styles/tailwind.css +276 -3
  142. package/styles/tailwind.scss +1 -0
@@ -12717,15 +12717,27 @@ textarea.e-filled.e-disabled.e-input::-webkit-input-placeholder {
12717
12717
  .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default .e-arrow-tip {
12718
12718
  visibility: hidden;
12719
12719
  }
12720
+ .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-slider-horizontal-before {
12721
+ transform: rotate(45deg);
12722
+ }
12720
12723
  .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-slider-horizontal-before .e-tip-content {
12721
12724
  transform: rotate(-45deg);
12722
12725
  }
12726
+ .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-slider-horizontal-after {
12727
+ transform: rotate(225deg);
12728
+ }
12723
12729
  .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-slider-horizontal-after .e-tip-content {
12724
12730
  transform: rotate(-225deg);
12725
12731
  }
12732
+ .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-slider-vertical-before {
12733
+ transform: rotate(-45deg);
12734
+ }
12726
12735
  .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-slider-vertical-before .e-tip-content {
12727
12736
  transform: rotate(45deg);
12728
12737
  }
12738
+ .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-slider-vertical-after {
12739
+ transform: rotate(-225deg);
12740
+ }
12729
12741
  .e-slider-tooltip.e-tooltip-wrap.e-popup.e-tooltip-wrap.e-popup.e-material-default.e-slider-vertical-after .e-tip-content {
12730
12742
  transform: rotate(225deg);
12731
12743
  }
@@ -14736,10 +14748,23 @@ body.e-colorpicker-overflow {
14736
14748
  height: 36px;
14737
14749
  width: 40px;
14738
14750
  }
14751
+ @media only screen and (max-width: 600px) {
14752
+ .e-bigger .e-container.e-color-picker {
14753
+ width: 100% !important; /* stylelint-disable-line declaration-no-important */
14754
+ }
14755
+ .e-bigger .e-container.e-colorpicker-popup {
14756
+ width: calc(100% - 20px) !important; /* stylelint-disable-line declaration-no-important */
14757
+ }
14758
+ }
14739
14759
  .e-bigger .e-container .e-palette .e-tile {
14740
14760
  height: 30px;
14741
14761
  width: 37px;
14742
14762
  }
14763
+ @media only screen and (max-width: 600px) {
14764
+ .e-bigger .e-container .e-palette .e-tile {
14765
+ width: 33px !important; /* stylelint-disable-line declaration-no-important */
14766
+ }
14767
+ }
14743
14768
  .e-bigger .e-container .e-hsv-container .e-hsv-color {
14744
14769
  height: 274px;
14745
14770
  }
@@ -14755,6 +14780,11 @@ body.e-colorpicker-overflow {
14755
14780
  width: 12.405%;
14756
14781
  top: 0;
14757
14782
  }
14783
+ @media only screen and (max-width: 600px) {
14784
+ .e-bigger .e-container .e-slider-preview .e-preview-container {
14785
+ margin-left: 4.6% !important; /* stylelint-disable-line declaration-no-important */
14786
+ }
14787
+ }
14758
14788
  .e-bigger .e-container .e-slider-preview .e-colorpicker-slider {
14759
14789
  width: 82.944%;
14760
14790
  }
@@ -14996,7 +15026,8 @@ body.e-colorpicker-overflow {
14996
15026
  padding: 0;
14997
15027
  margin: 4px;
14998
15028
  }
14999
- .e-rating-container .e-rating-item-list:focus-visible:not(:hover) .e-rating-focus {
15029
+ .e-rating-container .e-rating-item-list:focus-visible:not(:hover) .e-rating-focus:not(:has(svg)),
15030
+ .e-rating-container .e-rating-item-list:focus-visible:not(:hover) .e-rating-focus .e-rating-item:has(svg) {
15000
15031
  outline: 1px solid;
15001
15032
  }
15002
15033
  .e-rating-container .e-rating-item-list:focus-visible {
@@ -15015,10 +15046,13 @@ body.e-colorpicker-overflow {
15015
15046
  min-height: calc(1em + 8px);
15016
15047
  position: relative;
15017
15048
  }
15049
+ .e-rating-container .e-rating-item-container:has(svg) {
15050
+ line-height: 13px;
15051
+ }
15018
15052
  .e-rating-container .e-rating-item-container .e-rating-item {
15019
15053
  display: block;
15020
15054
  }
15021
- .e-rating-container.e-rating-animation:not(.e-disabled) .e-rating-item-container:hover .e-rating-item {
15055
+ .e-rating-container.e-rating-animation.e-touch-select:not(.e-disabled) .e-rating-item-container.e-rating-focus .e-rating-item, .e-rating-container.e-rating-animation:not(.e-disabled, .e-rating-touch) .e-rating-item-container:hover .e-rating-item {
15022
15056
  transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
15023
15057
  transform: scale(1.4);
15024
15058
  pointer-events: none;
@@ -15108,6 +15142,10 @@ body.e-colorpicker-overflow {
15108
15142
  .e-small .e-rating-container .e-rating-item-container {
15109
15143
  font-size: 16px;
15110
15144
  }
15145
+ .e-small.e-rating-container .e-rating-item-container:has(svg),
15146
+ .e-small .e-rating-container .e-rating-item-container:has(svg) {
15147
+ line-height: 9px;
15148
+ }
15111
15149
  .e-small.e-rating-container .e-rating-label,
15112
15150
  .e-small .e-rating-container .e-rating-label {
15113
15151
  font-size: 10px;
@@ -15122,6 +15160,10 @@ body.e-colorpicker-overflow {
15122
15160
  .e-bigger .e-rating-container .e-rating-item-container {
15123
15161
  font-size: 28px;
15124
15162
  }
15163
+ .e-bigger.e-rating-container .e-rating-item-container:has(svg),
15164
+ .e-bigger .e-rating-container .e-rating-item-container:has(svg) {
15165
+ line-height: 21px;
15166
+ }
15125
15167
  .e-bigger.e-rating-container .e-rating-label,
15126
15168
  .e-bigger .e-rating-container .e-rating-label {
15127
15169
  font-size: 14px;
@@ -15138,6 +15180,12 @@ body.e-colorpicker-overflow {
15138
15180
  .e-small .e-bigger.e-rating-container .e-rating-item-container {
15139
15181
  font-size: 24px;
15140
15182
  }
15183
+ .e-bigger.e-small.e-rating-container .e-rating-item-container:has(svg),
15184
+ .e-bigger.e-small .e-rating-container .e-rating-item-container:has(svg),
15185
+ .e-bigger .e-small.e-rating-container .e-rating-item-container:has(svg),
15186
+ .e-small .e-bigger.e-rating-container .e-rating-item-container:has(svg) {
15187
+ line-height: 17px;
15188
+ }
15141
15189
  .e-bigger.e-small.e-rating-container .e-rating-label,
15142
15190
  .e-bigger.e-small .e-rating-container .e-rating-label,
15143
15191
  .e-bigger .e-small.e-rating-container .e-rating-label,
@@ -15152,7 +15200,8 @@ body.e-colorpicker-overflow {
15152
15200
  font-size: 20px;
15153
15201
  }
15154
15202
 
15155
- .e-rating-container .e-rating-item-list:focus-visible:not(:hover) .e-rating-focus {
15203
+ .e-rating-container .e-rating-item-list:focus-visible:not(:hover) .e-rating-focus:not(:has(svg)),
15204
+ .e-rating-container .e-rating-item-list:focus-visible:not(:hover) .e-rating-focus .e-rating-item:has(svg) {
15156
15205
  outline-color: rgba(var(--color-sf-primary));
15157
15206
  border-radius: 0;
15158
15207
  }
@@ -15255,4 +15304,245 @@ body.e-colorpicker-overflow {
15255
15304
  /* stylelint-disable property-no-vendor-prefix */
15256
15305
  -webkit-background-clip: text;
15257
15306
  /* stylelint-enable property-no-vendor-prefix */
15307
+ }
15308
+
15309
+ /*! Form material 3 theme wise override definitions and variables */
15310
+ /*! data-form layout */
15311
+ .e-data-form .e-form-label {
15312
+ font-size: 12px;
15313
+ margin-bottom: 4px;
15314
+ font-weight: 400;
15315
+ }
15316
+ .e-data-form .e-form-layout {
15317
+ display: -ms-grid;
15318
+ display: grid;
15319
+ }
15320
+ .e-data-form .e-grid-col-2 {
15321
+ -ms-grid-columns: (minmax(0, 1fr))[2];
15322
+ grid-template-columns: repeat(2, minmax(0, 1fr));
15323
+ }
15324
+ .e-data-form .e-grid-col-3 {
15325
+ -ms-grid-columns: (minmax(0, 1fr))[3];
15326
+ grid-template-columns: repeat(3, minmax(0, 1fr));
15327
+ }
15328
+ .e-data-form .e-grid-col-4 {
15329
+ -ms-grid-columns: (minmax(0, 1fr))[4];
15330
+ grid-template-columns: repeat(4, minmax(0, 1fr));
15331
+ }
15332
+ .e-data-form .e-grid-col-5 {
15333
+ -ms-grid-columns: (minmax(0, 1fr))[5];
15334
+ grid-template-columns: repeat(5, minmax(0, 1fr));
15335
+ }
15336
+ .e-data-form .e-grid-col-6 {
15337
+ -ms-grid-columns: (minmax(0, 1fr))[6];
15338
+ grid-template-columns: repeat(6, minmax(0, 1fr));
15339
+ }
15340
+ .e-data-form .e-grid-col-7 {
15341
+ -ms-grid-columns: (minmax(0, 1fr))[7];
15342
+ grid-template-columns: repeat(7, minmax(0, 1fr));
15343
+ }
15344
+ .e-data-form .e-grid-col-8 {
15345
+ -ms-grid-columns: (minmax(0, 1fr))[8];
15346
+ grid-template-columns: repeat(8, minmax(0, 1fr));
15347
+ }
15348
+ .e-data-form .e-grid-col-9 {
15349
+ -ms-grid-columns: (minmax(0, 1fr))[9];
15350
+ grid-template-columns: repeat(9, minmax(0, 1fr));
15351
+ }
15352
+ .e-data-form .e-grid-col-10 {
15353
+ -ms-grid-columns: (minmax(0, 1fr))[10];
15354
+ grid-template-columns: repeat(10, minmax(0, 1fr));
15355
+ }
15356
+ .e-data-form .e-grid-col-11 {
15357
+ -ms-grid-columns: (minmax(0, 1fr))[11];
15358
+ grid-template-columns: repeat(11, minmax(0, 1fr));
15359
+ }
15360
+ .e-data-form .e-grid-col-12 {
15361
+ -ms-grid-columns: (minmax(0, 1fr))[12];
15362
+ grid-template-columns: repeat(12, minmax(0, 1fr));
15363
+ }
15364
+ .e-data-form .e-colspan-1 {
15365
+ -ms-grid-column-span: 1;
15366
+ -ms-grid-column: span 1;
15367
+ grid-column: span 1/span 1;
15368
+ }
15369
+ .e-data-form .e-colspan-2 {
15370
+ -ms-grid-column-span: 2;
15371
+ -ms-grid-column: span 2;
15372
+ grid-column: span 2/span 2;
15373
+ }
15374
+ .e-data-form .e-colspan-3 {
15375
+ -ms-grid-column-span: 3;
15376
+ -ms-grid-column: span 3;
15377
+ grid-column: span 3/span 3;
15378
+ }
15379
+ .e-data-form .e-colspan-4 {
15380
+ -ms-grid-column-span: 4;
15381
+ -ms-grid-column: span 4;
15382
+ grid-column: span 4/span 4;
15383
+ }
15384
+ .e-data-form .e-colspan-5 {
15385
+ -ms-grid-column-span: 5;
15386
+ -ms-grid-column: span 5;
15387
+ grid-column: span 5/span 5;
15388
+ }
15389
+ .e-data-form .e-colspan-6 {
15390
+ -ms-grid-column-span: 6;
15391
+ -ms-grid-column: span 6;
15392
+ grid-column: span 6/span 6;
15393
+ }
15394
+ .e-data-form .e-colspan-7 {
15395
+ -ms-grid-column-span: 7;
15396
+ -ms-grid-column: span 7;
15397
+ grid-column: span 7/span 7;
15398
+ }
15399
+ .e-data-form .e-colspan-8 {
15400
+ -ms-grid-column-span: 8;
15401
+ -ms-grid-column: span 8;
15402
+ grid-column: span 8/span 8;
15403
+ }
15404
+ .e-data-form .e-colspan-9 {
15405
+ -ms-grid-column-span: 9;
15406
+ -ms-grid-column: span 9;
15407
+ grid-column: span 9/span 9;
15408
+ }
15409
+ .e-data-form .e-colspan-10 {
15410
+ -ms-grid-column-span: 10;
15411
+ -ms-grid-column: span 10;
15412
+ grid-column: span 10/span 10;
15413
+ }
15414
+ .e-data-form .e-colspan-11 {
15415
+ -ms-grid-column-span: 11;
15416
+ -ms-grid-column: span 11;
15417
+ grid-column: span 11/span 11;
15418
+ }
15419
+ .e-data-form .e-colspan-12 {
15420
+ -ms-grid-column-span: 12;
15421
+ -ms-grid-column: span 12;
15422
+ grid-column: span 12/span 12;
15423
+ }
15424
+ .e-data-form .e-label-left .e-form-item-wrapper {
15425
+ -ms-flex: 1 1 auto;
15426
+ flex: 1 1 auto;
15427
+ max-width: calc(75% - 12px);
15428
+ }
15429
+ .e-data-form .e-label-left .e-form-label {
15430
+ margin-right: 12px;
15431
+ width: 25%;
15432
+ text-align: end;
15433
+ -ms-flex-direction: column;
15434
+ flex-direction: column;
15435
+ -ms-flex-align: end;
15436
+ align-items: flex-end;
15437
+ -ms-flex-pack: start;
15438
+ justify-content: flex-start;
15439
+ }
15440
+ .e-data-form .e-label-left .validation-message {
15441
+ display: -ms-flexbox;
15442
+ display: flex;
15443
+ }
15444
+ .e-data-form .e-form-group {
15445
+ border: none;
15446
+ padding: 0;
15447
+ margin: 0;
15448
+ }
15449
+ .e-data-form .e-form-group .e-group-title {
15450
+ position: relative;
15451
+ display: inline-block;
15452
+ padding-bottom: 8px;
15453
+ /* Gap between text and border */
15454
+ margin-bottom: 4px;
15455
+ font-size: 16px;
15456
+ }
15457
+ .e-data-form .e-form-group .e-group-title::after {
15458
+ content: "";
15459
+ position: absolute;
15460
+ bottom: 0;
15461
+ left: 0;
15462
+ width: 100%;
15463
+ height: 1px;
15464
+ border-bottom: 1px solid var(--color-sf-outline-variant);
15465
+ }
15466
+ .e-data-form .e-label-top {
15467
+ display: -ms-flexbox;
15468
+ display: flex;
15469
+ -ms-flex-direction: column;
15470
+ flex-direction: column;
15471
+ margin-top: 20px;
15472
+ }
15473
+ .e-data-form .e-label-top .e-label-right {
15474
+ display: -ms-flexbox;
15475
+ display: flex;
15476
+ -ms-flex-align: center;
15477
+ align-items: center;
15478
+ }
15479
+ .e-data-form .e-label-top .e-label-right .e-switch-wrapper + .e-form-label {
15480
+ margin-top: 3px;
15481
+ margin-left: 5px;
15482
+ }
15483
+ .e-data-form .e-label-top .e-label-right .e-checkbox-wrapper + .e-form-label {
15484
+ margin-top: 6px;
15485
+ }
15486
+ .e-data-form .e-label-left {
15487
+ display: -ms-flexbox;
15488
+ display: flex;
15489
+ text-align: center;
15490
+ margin-top: 20px;
15491
+ }
15492
+ .e-data-form .e-button-left {
15493
+ -ms-flex-pack: start;
15494
+ justify-content: flex-start;
15495
+ }
15496
+ .e-data-form .e-button-right {
15497
+ -ms-flex-pack: end;
15498
+ justify-content: flex-end;
15499
+ }
15500
+ .e-data-form .e-button-center {
15501
+ -ms-flex-pack: center;
15502
+ justify-content: center;
15503
+ }
15504
+ .e-data-form .e-button-left, .e-data-form .e-button-right, .e-data-form .e-button-center, .e-data-form .e-button-stretch {
15505
+ margin-top: 24px;
15506
+ display: -ms-flexbox;
15507
+ display: flex;
15508
+ gap: 10px;
15509
+ }
15510
+ .e-data-form .e-button-left .e-btn, .e-data-form .e-button-right .e-btn, .e-data-form .e-button-center .e-btn, .e-data-form .e-button-stretch .e-btn {
15511
+ border-radius: 20px;
15512
+ padding: 7px 16px;
15513
+ }
15514
+ .e-data-form .e-button-stretch .e-btn {
15515
+ width: 100%;
15516
+ }
15517
+ .e-data-form > :first-child.e-form-layout {
15518
+ margin-top: 0;
15519
+ }
15520
+ .e-data-form .e-form-group-layout {
15521
+ display: -ms-grid;
15522
+ display: grid;
15523
+ }
15524
+
15525
+ /*! data-form theme */
15526
+ .e-data-form .e-form-label {
15527
+ color: var(--color-sf-on-surface-variant);
15528
+ }
15529
+ .e-data-form .e-group-title {
15530
+ color: var(--color-sf-on-secondary-container);
15531
+ }
15532
+ .e-data-form .validation-message {
15533
+ color: var(--danger, #b3261e);
15534
+ font-size: 12px;
15535
+ font-style: italic;
15536
+ }
15537
+
15538
+ .e-tooltip-wrap.e-popup.e-error-tooltip {
15539
+ background-color: var(--color-sf-error-container);
15540
+ border: var(--color-sf-error-container);
15541
+ }
15542
+ .e-tooltip-wrap.e-popup.e-error-tooltip .e-tip-content .validation-message {
15543
+ color: var(--danger, #b3261e);
15544
+ }
15545
+ .e-tooltip-wrap.e-popup.e-error-tooltip .e-arrow-tip .e-arrow-tip-outer.e-tip-top, .e-tooltip-wrap.e-popup.e-error-tooltip .e-arrow-tip .e-arrow-tip-inner.e-tip-top {
15546
+ border-bottom-color: var(--color-sf-error-container);
15547
+ color: var(--color-sf-error-container);
15258
15548
  }
@@ -9,3 +9,4 @@
9
9
  @import 'uploader/material3.scss';
10
10
  @import 'color-picker/material3.scss';
11
11
  @import 'rating/material3.scss';
12
+ @import 'data-form/material3.scss';
@@ -1,5 +1,6 @@
1
1
  $rating-li-font-size: 20px !default;
2
2
  $rating-li-padding: 4px !default;
3
+ $rating-li-line-height: 9px !default;
3
4
  $rating-li-min-width-height: 28px !default;
4
5
  $rating-focus-border-radius: 2px !default;
5
6
  $rating-label-right-margin: 4px !default;
@@ -12,18 +13,21 @@ $rating-reset-font-size : 16px !default;
12
13
  $rating-tooltip-tip-bottom-height: 8px !default;
13
14
 
14
15
  $rating-small-li-font-size: 16px !default;
16
+ $rating-small-li-line-height: 4px !default;
15
17
  $rating-small-li-min-width-height: 24px !default;
16
18
  $rating-small-label-font-size: 10px !default;
17
19
  $rating-small-label-line-height: 16px !default;
18
20
  $rating-small-reset-font-size : 12px !default;
19
21
 
20
22
  $rating-bigger-li-font-size: 32px !default;
23
+ $rating-bigger-li-line-height: 16px !default;
21
24
  $rating-bigger-li-min-width-height: 40px !default;
22
25
  $rating-bigger-label-font-size: 14px !default;
23
26
  $rating-bigger-label-line-height: 22px !default;
24
27
  $rating-bigger-reset-font-size : 28px !default;
25
28
 
26
29
  $rating-bigger-small-li-font-size: 26px !default;
30
+ $rating-bigger-small-li-line-height: 9px !default;
27
31
  $rating-bigger-small-li-min-width-height: 34px !default;
28
32
  $rating-bigger-small-label-font-size: 12px !default;
29
33
  $rating-bigger-small-label-line-height: 18px !default;
@@ -1,5 +1,6 @@
1
1
  $rating-li-font-size: 20px !default;
2
2
  $rating-li-padding: 4px !default;
3
+ $rating-li-line-height: 9px !default;
3
4
  $rating-li-min-width-height: 28px !default;
4
5
  $rating-focus-border-radius: 2px !default;
5
6
  $rating-label-right-margin: 4px !default;
@@ -12,18 +13,21 @@ $rating-reset-font-size : 16px !default;
12
13
  $rating-tooltip-tip-bottom-height: 8px !default;
13
14
 
14
15
  $rating-small-li-font-size: 16px !default;
16
+ $rating-small-li-line-height: 4px !default;
15
17
  $rating-small-li-min-width-height: 24px !default;
16
18
  $rating-small-label-font-size: 10px !default;
17
19
  $rating-small-label-line-height: 16px !default;
18
20
  $rating-small-reset-font-size : 12px !default;
19
21
 
20
22
  $rating-bigger-li-font-size: 32px !default;
23
+ $rating-bigger-li-line-height: 16px !default;
21
24
  $rating-bigger-li-min-width-height: 40px !default;
22
25
  $rating-bigger-label-font-size: 14px !default;
23
26
  $rating-bigger-label-line-height: 22px !default;
24
27
  $rating-bigger-reset-font-size : 28px !default;
25
28
 
26
29
  $rating-bigger-small-li-font-size: 26px !default;
30
+ $rating-bigger-small-li-line-height: 9px !default;
27
31
  $rating-bigger-small-li-min-width-height: 34px !default;
28
32
  $rating-bigger-small-label-font-size: 12px !default;
29
33
  $rating-bigger-small-label-line-height: 18px !default;
@@ -1,5 +1,6 @@
1
1
  $rating-li-font-size: 20px !default;
2
2
  $rating-li-padding: 4px !default;
3
+ $rating-li-line-height: 11px !default;
3
4
  $rating-li-min-width-height: 28px !default;
4
5
  $rating-focus-border-radius: 4px !default;
5
6
  $rating-label-right-margin: 8px !default;
@@ -12,18 +13,21 @@ $rating-reset-font-size : 16px !default;
12
13
  $rating-tooltip-tip-bottom-height: 8px !default;
13
14
 
14
15
  $rating-small-li-font-size: 16px !default;
16
+ $rating-small-li-line-height: 4px !default;
15
17
  $rating-small-li-min-width-height: 24px !default;
16
18
  $rating-small-label-font-size: 10px !default;
17
19
  $rating-small-label-line-height: 16px !default;
18
20
  $rating-small-reset-font-size : 12px !default;
19
21
 
20
22
  $rating-bigger-li-font-size: 32px !default;
23
+ $rating-bigger-li-line-height: 13px !default;
21
24
  $rating-bigger-li-min-width-height: 40px !default;
22
25
  $rating-bigger-label-font-size: 14px !default;
23
26
  $rating-bigger-label-line-height: 22px !default;
24
27
  $rating-bigger-reset-font-size : 28px !default;
25
28
 
26
29
  $rating-bigger-small-li-font-size: 24px !default;
30
+ $rating-bigger-small-li-line-height: 9px !default;
27
31
  $rating-bigger-small-li-min-width-height: 32px !default;
28
32
  $rating-bigger-small-label-font-size: 12px !default;
29
33
  $rating-bigger-small-label-line-height: 18px !default;
@@ -1,5 +1,6 @@
1
1
  $rating-li-font-size: $font-icon-22 !default;
2
2
  $rating-li-padding: 4px !default;
3
+ $rating-li-line-height: 13px !default;
3
4
  $rating-li-min-width-height: 30px !default;
4
5
  $rating-focus-border-radius: 4px !default;
5
6
  $rating-label-bottom-margin: 4px !default;
@@ -12,18 +13,21 @@ $rating-reset-font-size : $font-icon-18 !default;
12
13
  $rating-tooltip-tip-bottom-height: 8px !default;
13
14
 
14
15
  $rating-small-li-font-size: $font-icon-16 !default;
16
+ $rating-small-li-line-height: 6px !default;
15
17
  $rating-small-li-min-width-height: 24px !default;
16
18
  $rating-small-label-font-size: $text-xxs !default;
17
19
  $rating-small-label-line-height: 16px !default;
18
20
  $rating-small-reset-font-size : $font-icon-12 !default;
19
21
 
20
22
  $rating-bigger-li-font-size: $font-icon-32 !default;
23
+ $rating-bigger-li-line-height: 13px !default;
21
24
  $rating-bigger-li-min-width-height: 40px !default;
22
25
  $rating-bigger-label-font-size: $text-sm !default;
23
26
  $rating-bigger-label-line-height: 22px !default;
24
27
  $rating-bigger-reset-font-size : $font-icon-28 !default;
25
28
 
26
29
  $rating-bigger-small-li-font-size: $font-icon-26 !default;
30
+ $rating-bigger-small-li-line-height: 13px !default;
27
31
  $rating-bigger-small-li-min-width-height: 34px !default;
28
32
  $rating-bigger-small-label-font-size: $text-xs !default;
29
33
  $rating-bigger-small-label-line-height: 18px !default;
@@ -1,5 +1,6 @@
1
1
  $rating-li-font-size: 20px !default;
2
2
  $rating-li-padding: 4px !default;
3
+ $rating-li-line-height: 13px !default;
3
4
  $rating-li-min-width-height: 28px !default;
4
5
  $rating-focus-border-radius: 0 !default;
5
6
  $rating-label-bottom-margin: 4px !default;
@@ -12,18 +13,21 @@ $rating-reset-font-size : 16px !default;
12
13
  $rating-tooltip-tip-bottom-height: 8px !default;
13
14
 
14
15
  $rating-small-li-font-size: 16px !default;
16
+ $rating-small-li-line-height: 10px !default;
15
17
  $rating-small-li-min-width-height: 24px !default;
16
18
  $rating-small-label-font-size: 10px !default;
17
19
  $rating-small-label-line-height: 16px !default;
18
20
  $rating-small-reset-font-size : 12px !default;
19
21
 
20
22
  $rating-bigger-li-font-size: 28px !default;
23
+ $rating-bigger-li-line-height: 21px !default;
21
24
  $rating-bigger-li-min-width-height: 36px !default;
22
25
  $rating-bigger-label-font-size: 14px !default;
23
26
  $rating-bigger-label-line-height: 22px !default;
24
27
  $rating-bigger-reset-font-size : 24px !default;
25
28
 
26
29
  $rating-bigger-small-li-font-size: 24px !default;
30
+ $rating-bigger-small-li-line-height: 19px !default;
27
31
  $rating-bigger-small-li-min-width-height: 32px !default;
28
32
  $rating-bigger-small-label-font-size: 12px !default;
29
33
  $rating-bigger-small-label-line-height: 18px !default;
@@ -1,5 +1,6 @@
1
1
  $rating-li-font-size: 20px !default;
2
2
  $rating-li-padding: 4px !default;
3
+ $rating-li-line-height: 13px !default;
3
4
  $rating-li-min-width-height: 28px !default;
4
5
  $rating-focus-border-radius: 0 !default;
5
6
  $rating-label-bottom-margin: 4px !default;
@@ -12,18 +13,21 @@ $rating-reset-font-size : 16px !default;
12
13
  $rating-tooltip-tip-bottom-height: 8px !default;
13
14
 
14
15
  $rating-small-li-font-size: 16px !default;
16
+ $rating-small-li-line-height: 13px !default;
15
17
  $rating-small-li-min-width-height: 24px !default;
16
18
  $rating-small-label-font-size: 10px !default;
17
19
  $rating-small-label-line-height: 16px !default;
18
20
  $rating-small-reset-font-size : 12px !default;
19
21
 
20
22
  $rating-bigger-li-font-size: 28px !default;
23
+ $rating-bigger-li-line-height: 21px !default;
21
24
  $rating-bigger-li-min-width-height: 36px !default;
22
25
  $rating-bigger-label-font-size: 14px !default;
23
26
  $rating-bigger-label-line-height: 22px !default;
24
27
  $rating-bigger-reset-font-size : 24px !default;
25
28
 
26
29
  $rating-bigger-small-li-font-size: 24px !default;
30
+ $rating-bigger-small-li-line-height: 19px !default;
27
31
  $rating-bigger-small-li-min-width-height: 32px !default;
28
32
  $rating-bigger-small-label-font-size: 12px !default;
29
33
  $rating-bigger-small-label-line-height: 18px !default;
@@ -1,5 +1,6 @@
1
1
  $rating-li-font-size: $font-icon-20 !default;
2
2
  $rating-li-padding: 4px !default;
3
+ $rating-li-line-height: 13px !default;
3
4
  $rating-li-min-width-height: 28px !default;
4
5
  $rating-focus-border-radius: 0 !default;
5
6
  $rating-label-bottom-margin: 4px !default;
@@ -12,18 +13,21 @@ $rating-reset-font-size : $font-icon-16 !default;
12
13
  $rating-tooltip-tip-bottom-height: 12.5px !default;
13
14
 
14
15
  $rating-small-li-font-size: $font-icon-16 !default;
16
+ $rating-small-li-line-height: 13px !default;
15
17
  $rating-small-li-min-width-height: 24px !default;
16
18
  $rating-small-label-font-size: $text-xxs !default;
17
19
  $rating-small-label-line-height: 16px !default;
18
20
  $rating-small-reset-font-size : $font-icon-12 !default;
19
21
 
20
22
  $rating-bigger-li-font-size: $font-icon-28 !default;
23
+ $rating-bigger-li-line-height: 21px !default;
21
24
  $rating-bigger-li-min-width-height: 36px !default;
22
25
  $rating-bigger-label-font-size: $text-sm !default;
23
26
  $rating-bigger-label-line-height: 22px !default;
24
27
  $rating-bigger-reset-font-size : $font-icon-24 !default;
25
28
 
26
29
  $rating-bigger-small-li-font-size: $font-icon-24 !default;
30
+ $rating-bigger-small-li-line-height: 19px !default;
27
31
  $rating-bigger-small-li-min-width-height: 32px !default;
28
32
  $rating-bigger-small-label-font-size: $text-xs !default;
29
33
  $rating-bigger-small-label-line-height: 18px !default;
@@ -1,5 +1,6 @@
1
1
  $rating-li-font-size: 22px !default;
2
2
  $rating-li-padding: 4px !default;
3
+ $rating-li-line-height: 13px !default;
3
4
  $rating-li-min-width-height: 30px !default;
4
5
  $rating-focus-border-radius: 4px !default;
5
6
  $rating-label-bottom-margin: 4px !default;
@@ -12,18 +13,21 @@ $rating-reset-font-size : 18px !default;
12
13
  $rating-tooltip-tip-bottom-height: 8px !default;
13
14
 
14
15
  $rating-small-li-font-size: 16px !default;
16
+ $rating-small-li-line-height: 6px !default;
15
17
  $rating-small-li-min-width-height: 24px !default;
16
18
  $rating-small-label-font-size: 10px !default;
17
19
  $rating-small-label-line-height: 16px !default;
18
20
  $rating-small-reset-font-size : 12px !default;
19
21
 
20
22
  $rating-bigger-li-font-size: 32px !default;
23
+ $rating-bigger-li-line-height: 13px !default;
21
24
  $rating-bigger-li-min-width-height: 40px !default;
22
25
  $rating-bigger-label-font-size: 14px !default;
23
26
  $rating-bigger-label-line-height: 22px !default;
24
27
  $rating-bigger-reset-font-size : 28px !default;
25
28
 
26
29
  $rating-bigger-small-li-font-size: 26px !default;
30
+ $rating-bigger-small-li-line-height: 13px !default;
27
31
  $rating-bigger-small-li-min-width-height: 34px !default;
28
32
  $rating-bigger-small-label-font-size: 12px !default;
29
33
  $rating-bigger-small-label-line-height: 18px !default;
@@ -1,5 +1,6 @@
1
1
  $rating-li-font-size: 20px !default;
2
2
  $rating-li-padding: 4px !default;
3
+ $rating-li-line-height: 13px !default;
3
4
  $rating-li-min-width-height: 28px !default;
4
5
  $rating-focus-border-radius: 0 !default;
5
6
  $rating-label-bottom-margin: 9px !default;
@@ -12,18 +13,21 @@ $rating-reset-font-size : 16px !default;
12
13
  $rating-tooltip-tip-bottom-height: 8px !default;
13
14
 
14
15
  $rating-small-li-font-size: 16px !default;
16
+ $rating-small-li-line-height: 13px !default;
15
17
  $rating-small-li-min-width-height: 24px !default;
16
18
  $rating-small-label-font-size: 10px !default;
17
19
  $rating-small-label-line-height: 16px !default;
18
20
  $rating-small-reset-font-size : 12px !default;
19
21
 
20
22
  $rating-bigger-li-font-size: 28px !default;
23
+ $rating-bigger-li-line-height: 21px !default;
21
24
  $rating-bigger-li-min-width-height: 36px !default;
22
25
  $rating-bigger-label-font-size: 14px !default;
23
26
  $rating-bigger-label-line-height: 22px !default;
24
27
  $rating-bigger-reset-font-size : 24px !default;
25
28
 
26
29
  $rating-bigger-small-li-font-size: 24px !default;
30
+ $rating-bigger-small-li-line-height: 19px !default;
27
31
  $rating-bigger-small-li-min-width-height: 32px !default;
28
32
  $rating-bigger-small-label-font-size: 12px !default;
29
33
  $rating-bigger-small-label-line-height: 18px !default;
@@ -1,5 +1,6 @@
1
1
  $rating-li-font-size: 20px !default;
2
2
  $rating-li-padding: 4px !default;
3
+ $rating-li-line-height: 13px !default;
3
4
  $rating-li-min-width-height: 28px !default;
4
5
  $rating-focus-border-radius: 0 !default;
5
6
  $rating-label-bottom-margin: 9px !default;
@@ -12,18 +13,21 @@ $rating-reset-font-size : 16px !default;
12
13
  $rating-tooltip-tip-bottom-height: 8px !default;
13
14
 
14
15
  $rating-small-li-font-size: 16px !default;
16
+ $rating-small-li-line-height: 13px !default;
15
17
  $rating-small-li-min-width-height: 24px !default;
16
18
  $rating-small-label-font-size: 10px !default;
17
19
  $rating-small-label-line-height: 16px !default;
18
20
  $rating-small-reset-font-size : 12px !default;
19
21
 
20
22
  $rating-bigger-li-font-size: 28px !default;
23
+ $rating-bigger-li-line-height: 21px !default;
21
24
  $rating-bigger-li-min-width-height: 36px !default;
22
25
  $rating-bigger-label-font-size: 14px !default;
23
26
  $rating-bigger-label-line-height: 22px !default;
24
27
  $rating-bigger-reset-font-size : 24px !default;
25
28
 
26
29
  $rating-bigger-small-li-font-size: 24px !default;
30
+ $rating-bigger-small-li-line-height: 19px !default;
27
31
  $rating-bigger-small-li-min-width-height: 32px !default;
28
32
  $rating-bigger-small-label-font-size: 12px !default;
29
33
  $rating-bigger-small-label-line-height: 18px !default;