@syncfusion/ej2-dropdowns 18.1.57 → 18.2.44-4569

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 (183) hide show
  1. package/.eslintrc.json +244 -0
  2. package/CHANGELOG.md +1524 -1514
  3. package/README.md +118 -118
  4. package/dist/ej2-dropdowns.umd.min.js +1 -10
  5. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  6. package/dist/es6/ej2-dropdowns.es2015.js +198 -126
  7. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  8. package/dist/es6/ej2-dropdowns.es5.js +290 -217
  9. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  10. package/dist/global/ej2-dropdowns.min.js +1 -10
  11. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  12. package/dist/global/index.d.ts +0 -9
  13. package/dist/ts/auto-complete/auto-complete.ts +527 -0
  14. package/dist/ts/combo-box/combo-box.ts +957 -0
  15. package/dist/ts/common/highlight-search.ts +47 -0
  16. package/dist/ts/common/incremental-search.ts +81 -0
  17. package/dist/ts/drop-down-base/drop-down-base.ts +1572 -0
  18. package/dist/ts/drop-down-list/drop-down-list.ts +2993 -0
  19. package/dist/ts/drop-down-tree/drop-down-tree.ts +3066 -0
  20. package/dist/ts/list-box/list-box.ts +2317 -0
  21. package/dist/ts/multi-select/checkbox-selection.ts +528 -0
  22. package/dist/ts/multi-select/float-label.ts +155 -0
  23. package/dist/ts/multi-select/interface.ts +66 -0
  24. package/dist/ts/multi-select/multi-select.ts +4216 -0
  25. package/helpers/e2e/index.js +3 -3
  26. package/license +2 -2
  27. package/package.json +77 -77
  28. package/src/auto-complete/auto-complete-model.d.ts +179 -179
  29. package/src/auto-complete/auto-complete.d.ts +12 -12
  30. package/src/auto-complete/auto-complete.js +21 -21
  31. package/src/combo-box/combo-box-model.d.ts +212 -212
  32. package/src/combo-box/combo-box.d.ts +27 -27
  33. package/src/combo-box/combo-box.js +29 -29
  34. package/src/common/incremental-search.d.ts +1 -1
  35. package/src/common/incremental-search.js +4 -2
  36. package/src/drop-down-base/drop-down-base-model.d.ts +191 -191
  37. package/src/drop-down-base/drop-down-base.d.ts +17 -17
  38. package/src/drop-down-base/drop-down-base.js +20 -20
  39. package/src/drop-down-list/drop-down-list-model.d.ts +222 -222
  40. package/src/drop-down-list/drop-down-list.d.ts +3 -2
  41. package/src/drop-down-list/drop-down-list.js +43 -30
  42. package/src/drop-down-tree/drop-down-tree-model.d.ts +344 -344
  43. package/src/drop-down-tree/drop-down-tree.js +32 -26
  44. package/src/list-box/index.d.ts +1 -0
  45. package/src/list-box/index.js +1 -0
  46. package/src/list-box/list-box-model.d.ts +156 -156
  47. package/src/list-box/list-box.d.ts +2 -2
  48. package/src/list-box/list-box.js +57 -59
  49. package/src/multi-select/index.d.ts +1 -0
  50. package/src/multi-select/index.js +1 -0
  51. package/src/multi-select/multi-select-model.d.ts +452 -452
  52. package/src/multi-select/multi-select.d.ts +2 -0
  53. package/src/multi-select/multi-select.js +98 -43
  54. package/styles/_all.scss +3 -3
  55. package/styles/auto-complete/_bootstrap-dark-definition.scss +3 -3
  56. package/styles/auto-complete/_bootstrap4-definition.scss +11 -11
  57. package/styles/auto-complete/_fabric-dark-definition.scss +2 -2
  58. package/styles/auto-complete/_highcontrast-light-definition.scss +2 -2
  59. package/styles/auto-complete/_material-dark-definition.scss +2 -2
  60. package/styles/bootstrap-dark.css +67 -61
  61. package/styles/bootstrap.css +69 -63
  62. package/styles/bootstrap4.css +81 -61
  63. package/styles/combo-box/_bootstrap-dark-definition.scss +2 -2
  64. package/styles/combo-box/_bootstrap4-definition.scss +11 -11
  65. package/styles/combo-box/_fabric-dark-definition.scss +2 -2
  66. package/styles/combo-box/_highcontrast-light-definition.scss +3 -3
  67. package/styles/combo-box/_material-dark-definition.scss +2 -2
  68. package/styles/drop-down-base/_all.scss +2 -2
  69. package/styles/drop-down-base/_bootstrap-dark-definition.scss +64 -64
  70. package/styles/drop-down-base/_bootstrap-definition.scss +64 -64
  71. package/styles/drop-down-base/_bootstrap4-definition.scss +78 -78
  72. package/styles/drop-down-base/_definition.scss +23 -23
  73. package/styles/drop-down-base/_fabric-dark-definition.scss +68 -68
  74. package/styles/drop-down-base/_fabric-definition.scss +66 -66
  75. package/styles/drop-down-base/_highcontrast-definition.scss +82 -82
  76. package/styles/drop-down-base/_highcontrast-light-definition.scss +81 -81
  77. package/styles/drop-down-base/_layout.scss +108 -108
  78. package/styles/drop-down-base/_material-dark-definition.scss +67 -67
  79. package/styles/drop-down-base/_material-definition.scss +65 -65
  80. package/styles/drop-down-base/_theme.scss +242 -242
  81. package/styles/drop-down-list/_all.scss +2 -2
  82. package/styles/drop-down-list/_bootstrap-dark-definition.scss +157 -157
  83. package/styles/drop-down-list/_bootstrap-definition.scss +156 -156
  84. package/styles/drop-down-list/_bootstrap4-definition.scss +184 -184
  85. package/styles/drop-down-list/_fabric-dark-definition.scss +127 -127
  86. package/styles/drop-down-list/_fabric-definition.scss +122 -122
  87. package/styles/drop-down-list/_highcontrast-definition.scss +131 -131
  88. package/styles/drop-down-list/_highcontrast-light-definition.scss +133 -133
  89. package/styles/drop-down-list/_layout.scss +218 -218
  90. package/styles/drop-down-list/_material-dark-definition.scss +143 -143
  91. package/styles/drop-down-list/_material-definition.scss +166 -166
  92. package/styles/drop-down-list/_theme.scss +10 -10
  93. package/styles/drop-down-list/icons/_bootstrap-dark.scss +14 -14
  94. package/styles/drop-down-list/icons/_bootstrap.scss +14 -14
  95. package/styles/drop-down-list/icons/_bootstrap4.scss +14 -14
  96. package/styles/drop-down-list/icons/_fabric-dark.scss +14 -14
  97. package/styles/drop-down-list/icons/_fabric.scss +14 -14
  98. package/styles/drop-down-list/icons/_highcontrast-light.scss +14 -14
  99. package/styles/drop-down-list/icons/_highcontrast.scss +14 -14
  100. package/styles/drop-down-list/icons/_material-dark.scss +14 -14
  101. package/styles/drop-down-list/icons/_material.scss +14 -14
  102. package/styles/drop-down-list/material.css +9 -0
  103. package/styles/drop-down-tree/_all.scss +2 -2
  104. package/styles/drop-down-tree/_bootstrap-dark-definition.scss +62 -49
  105. package/styles/drop-down-tree/_bootstrap-definition.scss +62 -49
  106. package/styles/drop-down-tree/_bootstrap4-definition.scss +63 -50
  107. package/styles/drop-down-tree/_fabric-dark-definition.scss +63 -49
  108. package/styles/drop-down-tree/_fabric-definition.scss +63 -49
  109. package/styles/drop-down-tree/_highcontrast-definition.scss +63 -49
  110. package/styles/drop-down-tree/_highcontrast-light-definition.scss +63 -49
  111. package/styles/drop-down-tree/_layout.scss +437 -398
  112. package/styles/drop-down-tree/_material-dark-definition.scss +61 -54
  113. package/styles/drop-down-tree/_material-definition.scss +61 -54
  114. package/styles/drop-down-tree/_theme.scss +68 -63
  115. package/styles/drop-down-tree/bootstrap-dark.css +67 -61
  116. package/styles/drop-down-tree/bootstrap.css +69 -63
  117. package/styles/drop-down-tree/bootstrap4.css +81 -61
  118. package/styles/drop-down-tree/fabric-dark.css +71 -63
  119. package/styles/drop-down-tree/fabric.css +71 -63
  120. package/styles/drop-down-tree/highcontrast-light.css +71 -63
  121. package/styles/drop-down-tree/highcontrast.css +75 -63
  122. package/styles/drop-down-tree/icons/_bootstrap-dark.scss +11 -11
  123. package/styles/drop-down-tree/icons/_bootstrap.scss +11 -11
  124. package/styles/drop-down-tree/icons/_bootstrap4.scss +11 -11
  125. package/styles/drop-down-tree/icons/_fabric-dark.scss +11 -11
  126. package/styles/drop-down-tree/icons/_fabric.scss +11 -11
  127. package/styles/drop-down-tree/icons/_highcontrast-light.scss +11 -11
  128. package/styles/drop-down-tree/icons/_highcontrast.scss +11 -11
  129. package/styles/drop-down-tree/icons/_material-dark.scss +11 -11
  130. package/styles/drop-down-tree/icons/_material.scss +11 -11
  131. package/styles/drop-down-tree/material-dark.css +76 -85
  132. package/styles/drop-down-tree/material.css +93 -85
  133. package/styles/fabric-dark.css +71 -63
  134. package/styles/fabric.css +71 -63
  135. package/styles/highcontrast-light.css +71 -63
  136. package/styles/highcontrast.css +75 -63
  137. package/styles/list-box/_all.scss +2 -2
  138. package/styles/list-box/_bootstrap-dark-definition.scss +118 -118
  139. package/styles/list-box/_bootstrap-definition.scss +112 -112
  140. package/styles/list-box/_bootstrap4-definition.scss +118 -118
  141. package/styles/list-box/_fabric-dark-definition.scss +118 -118
  142. package/styles/list-box/_fabric-definition.scss +112 -112
  143. package/styles/list-box/_highcontrast-definition.scss +112 -112
  144. package/styles/list-box/_highcontrast-light-definition.scss +118 -118
  145. package/styles/list-box/_layout.scss +458 -458
  146. package/styles/list-box/_material-dark-definition.scss +118 -118
  147. package/styles/list-box/_material-definition.scss +112 -112
  148. package/styles/list-box/_theme.scss +273 -273
  149. package/styles/list-box/icons/_bootstrap-dark.scss +25 -25
  150. package/styles/list-box/icons/_bootstrap.scss +25 -25
  151. package/styles/list-box/icons/_bootstrap4.scss +25 -25
  152. package/styles/list-box/icons/_fabric-dark.scss +25 -25
  153. package/styles/list-box/icons/_fabric.scss +25 -25
  154. package/styles/list-box/icons/_highcontrast-light.scss +25 -25
  155. package/styles/list-box/icons/_highcontrast.scss +25 -25
  156. package/styles/list-box/icons/_material-dark.scss +25 -25
  157. package/styles/list-box/icons/_material.scss +25 -25
  158. package/styles/list-box/material-dark.css +4 -4
  159. package/styles/list-box/material.css +4 -4
  160. package/styles/material-dark.css +80 -89
  161. package/styles/material.css +115 -89
  162. package/styles/multi-select/_all.scss +2 -2
  163. package/styles/multi-select/_bootstrap-dark-definition.scss +171 -171
  164. package/styles/multi-select/_bootstrap-definition.scss +166 -166
  165. package/styles/multi-select/_bootstrap4-definition.scss +233 -233
  166. package/styles/multi-select/_fabric-dark-definition.scss +170 -170
  167. package/styles/multi-select/_fabric-definition.scss +167 -167
  168. package/styles/multi-select/_highcontrast-definition.scss +257 -257
  169. package/styles/multi-select/_highcontrast-light-definition.scss +258 -258
  170. package/styles/multi-select/_layout.scss +1153 -1153
  171. package/styles/multi-select/_material-dark-definition.scss +186 -186
  172. package/styles/multi-select/_material-definition.scss +191 -191
  173. package/styles/multi-select/_theme.scss +384 -384
  174. package/styles/multi-select/icons/_bootstrap-dark.scss +26 -26
  175. package/styles/multi-select/icons/_bootstrap.scss +26 -26
  176. package/styles/multi-select/icons/_bootstrap4.scss +37 -37
  177. package/styles/multi-select/icons/_fabric-dark.scss +26 -26
  178. package/styles/multi-select/icons/_fabric.scss +26 -26
  179. package/styles/multi-select/icons/_highcontrast-light.scss +26 -26
  180. package/styles/multi-select/icons/_highcontrast.scss +26 -26
  181. package/styles/multi-select/icons/_material-dark.scss +26 -26
  182. package/styles/multi-select/icons/_material.scss +324 -324
  183. package/styles/multi-select/material.css +9 -0
@@ -733,13 +733,13 @@ ejs-dropdownlist {
733
733
  outline: none;
734
734
  }
735
735
 
736
- .e-ddt.e-icon-anim .e-ddt-icon::before {
737
- transform: rotate(180deg);
736
+ .e-ddt .e-ddt-icon::before {
737
+ transform: rotate(0deg);
738
738
  transition: transform 300ms ease;
739
739
  }
740
740
 
741
- .e-ddt .e-ddt-icon::before {
742
- transform: rotate(0deg);
741
+ .e-ddt.e-icon-anim .e-ddt-icon::before {
742
+ transform: rotate(180deg);
743
743
  transition: transform 300ms ease;
744
744
  }
745
745
 
@@ -762,10 +762,6 @@ ejs-dropdownlist {
762
762
  display: none;
763
763
  }
764
764
 
765
- .e-ddt.e-input-group.e-control-wrapper.e-input-focus input ~ label.e-float-text, .e-ddt.e-float-input.e-control-wrapper.e-input-focus input ~ label.e-float-text {
766
- top: 14px;
767
- }
768
-
769
765
  .e-ddt.e-input-group.e-control-wrapper.e-show-chip .e-clear-icon, .e-ddt.e-float-input.e-control-wrapper.e-show-chip .e-clear-icon {
770
766
  bottom: 0;
771
767
  position: absolute;
@@ -794,27 +790,30 @@ ejs-dropdownlist {
794
790
  }
795
791
 
796
792
  .e-ddt .e-chips-wrapper .e-chips-close {
797
- line-height: 26px;
793
+ line-height: 21px;
798
794
  min-height: 26px;
799
- min-width: 26px;
795
+ min-width: 18px;
800
796
  text-align: center;
801
797
  }
802
798
 
803
799
  .e-ddt .e-chips-wrapper .e-chips-close::before {
804
800
  font-size: 10px;
801
+ vertical-align: middle;
805
802
  }
806
803
 
807
804
  .e-ddt .e-chips-wrapper .e-chips {
808
805
  -ms-flex-align: center;
809
806
  align-items: center;
807
+ border-radius: 0;
808
+ box-sizing: border-box;
810
809
  display: -ms-inline-flexbox;
811
810
  display: inline-flex;
812
811
  float: left;
813
812
  height: 26px;
814
813
  margin: 2px 1px;
815
- max-width: 100%;
814
+ max-width: calc(100% - 2px);
816
815
  overflow: hidden;
817
- padding: 0 0 0 8px;
816
+ padding: 0 4px 0 4px;
818
817
  text-overflow: ellipsis;
819
818
  white-space: nowrap;
820
819
  }
@@ -822,22 +821,26 @@ ejs-dropdownlist {
822
821
  .e-ddt .e-chips-wrapper .e-chips > .e-chipcontent {
823
822
  max-width: 100%;
824
823
  overflow: hidden;
825
- padding: 0 8px 0 0;
824
+ padding: 0 4px 0 4px;
826
825
  text-indent: 0;
827
826
  text-overflow: ellipsis;
828
827
  white-space: nowrap;
828
+ line-height: 26px;
829
829
  }
830
830
 
831
- .e-ddt.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
832
- margin-right: 60px;
831
+ .e-ddt.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
832
+ margin-right: 30px;
833
+ max-width: calc(100% - 31px);
833
834
  }
834
835
 
835
- .e-ddt.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child {
836
+ .e-ddt.e-show-clear .e-chips-wrapper .e-chips:last-child {
836
837
  margin-right: 30px;
838
+ max-width: calc(100% - 31px);
837
839
  }
838
840
 
839
- .e-ddt.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
840
- margin-right: 30px;
841
+ .e-ddt.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
842
+ margin-right: 60px;
843
+ max-width: calc(100% - 61px);
841
844
  }
842
845
 
843
846
  .e-ddt input[readonly],
@@ -853,9 +856,8 @@ ejs-dropdownlist {
853
856
  }
854
857
 
855
858
  .e-ddt.e-popup {
856
- border: 1px solid;
859
+ border: 1px solid #969696;
857
860
  box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 0px rgba(0, 0, 0, 0.14), 0 3px 14px 0px rgba(0, 0, 0, 0.12);
858
- margin-top: 2px;
859
861
  position: absolute;
860
862
  }
861
863
 
@@ -866,7 +868,7 @@ ejs-dropdownlist {
866
868
  line-height: 36px;
867
869
  overflow: hidden;
868
870
  position: relative;
869
- text-indent: 39px;
871
+ text-indent: 38px;
870
872
  white-space: nowrap;
871
873
  width: 100%;
872
874
  }
@@ -876,7 +878,6 @@ ejs-dropdownlist {
876
878
  }
877
879
 
878
880
  .e-ddt.e-popup .e-selectall-parent .e-checkbox-wrapper {
879
- margin-right: 10px;
880
881
  position: relative;
881
882
  text-indent: 0;
882
883
  }
@@ -884,10 +885,28 @@ ejs-dropdownlist {
884
885
  .e-ddt.e-popup .e-selectall-parent .e-all-text {
885
886
  font-family: inherit;
886
887
  font-size: 14px;
888
+ margin: 10px;
889
+ }
890
+
891
+ .e-ddt.e-popup .e-filter-wrap .e-input,
892
+ .e-ddt.e-popup .e-filter-wrap .e-input:focus {
893
+ padding: 0 12px;
894
+ }
895
+
896
+ .e-ddt.e-popup .e-filter-wrap {
897
+ border: 1px solid #fff;
898
+ border-top-width: 0;
899
+ display: block;
900
+ padding: 5px;
901
+ }
902
+
903
+ .e-ddt.e-popup .e-filter-wrap {
904
+ border-left-width: 0;
905
+ border-right-width: 0;
887
906
  }
888
907
 
889
908
  .e-ddt.e-popup .e-filter-wrap .e-input-group {
890
- padding: 0 10px;
909
+ margin-bottom: 0;
891
910
  }
892
911
 
893
912
  .e-ddt.e-popup .e-popup-content {
@@ -951,29 +970,26 @@ ejs-dropdownlist {
951
970
 
952
971
  .e-ddt.e-rtl .e-chips-wrapper .e-chips {
953
972
  float: right;
954
- padding: 0 8px 0 0;
955
- }
956
-
957
- .e-ddt.e-rtl .e-chips-wrapper .e-chips > .e-chipcontent {
958
- padding: 0 0 0 8px;
959
973
  }
960
974
 
961
- .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
962
- margin-left: 60px;
975
+ .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
976
+ margin-left: 30px;
963
977
  margin-right: 1px;
964
978
  }
965
979
 
966
- .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child {
980
+ .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child {
967
981
  margin-left: 30px;
968
982
  margin-right: 1px;
969
983
  }
970
984
 
971
- .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
972
- margin-left: 30px;
985
+ .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
986
+ margin-left: 60px;
973
987
  margin-right: 1px;
974
988
  }
975
989
 
976
- .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-clear-icon, .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-chip .e-clear-icon {
990
+ .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-clear-icon,
991
+ .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-ddt-icon, .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-chip .e-clear-icon,
992
+ .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-chip .e-ddt-icon {
977
993
  left: 0;
978
994
  right: auto;
979
995
  }
@@ -982,16 +998,6 @@ ejs-dropdownlist {
982
998
  left: 30px;
983
999
  }
984
1000
 
985
- .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-ddt-icon, .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-chip .e-ddt-icon {
986
- left: 0;
987
- right: auto;
988
- }
989
-
990
- .e-ddt.e-rtl.e-popup .e-selectall-parent .e-checkbox-wrapper {
991
- margin-left: 10px;
992
- margin-right: 0;
993
- }
994
-
995
1001
  .e-ddt.e-rtl.e-popup .e-treeview .e-list-item .e-ul {
996
1002
  padding: 0 14px 0 0;
997
1003
  }
@@ -1019,24 +1025,27 @@ ejs-dropdownlist {
1019
1025
  min-height: 38px;
1020
1026
  }
1021
1027
 
1022
- .e-bigger .e-ddt.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1023
- .e-ddt.e-bigger.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1024
- margin-right: 76px;
1028
+ .e-bigger .e-ddt.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
1029
+ .e-ddt.e-bigger.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
1030
+ margin-right: 38px;
1031
+ max-width: calc(100% - 39px);
1025
1032
  }
1026
1033
 
1027
- .e-bigger .e-ddt.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1028
- .e-ddt.e-bigger.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1034
+ .e-bigger .e-ddt.e-show-clear .e-chips-wrapper .e-chips:last-child,
1035
+ .e-ddt.e-bigger.e-show-clear .e-chips-wrapper .e-chips:last-child {
1029
1036
  margin-right: 38px;
1037
+ max-width: calc(100% - 39px);
1030
1038
  }
1031
1039
 
1032
- .e-bigger .e-ddt.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1033
- .e-ddt.e-bigger.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1034
- margin-right: 38px;
1040
+ .e-bigger .e-ddt.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
1041
+ .e-ddt.e-bigger.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
1042
+ margin-right: 76px;
1043
+ max-width: calc(100% - 77px);
1035
1044
  }
1036
1045
 
1037
1046
  .e-bigger .e-ddt.e-popup .e-selectall-parent,
1038
1047
  .e-ddt.e-bigger.e-popup .e-selectall-parent {
1039
- text-indent: 44px;
1048
+ text-indent: 43px;
1040
1049
  }
1041
1050
 
1042
1051
  .e-bigger .e-ddt.e-popup .e-treeview .e-fullrow,
@@ -1044,21 +1053,21 @@ ejs-dropdownlist {
1044
1053
  height: 48px;
1045
1054
  }
1046
1055
 
1047
- .e-bigger .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1048
- .e-ddt.e-bigger.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1049
- margin-left: 76px;
1056
+ .e-bigger .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
1057
+ .e-ddt.e-bigger.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
1058
+ margin-left: 38px;
1050
1059
  margin-right: 1px;
1051
1060
  }
1052
1061
 
1053
- .e-bigger .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1054
- .e-ddt.e-bigger.e-rtl.e-show-clear .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1062
+ .e-bigger .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child,
1063
+ .e-ddt.e-bigger.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child {
1055
1064
  margin-left: 38px;
1056
1065
  margin-right: 1px;
1057
1066
  }
1058
1067
 
1059
- .e-bigger .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child,
1060
- .e-ddt.e-bigger.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips-collection .e-chips:last-child {
1061
- margin-left: 38px;
1068
+ .e-bigger .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
1069
+ .e-ddt.e-bigger.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
1070
+ margin-left: 76px;
1062
1071
  margin-right: 1px;
1063
1072
  }
1064
1073
 
@@ -1070,7 +1079,6 @@ ejs-dropdownlist {
1070
1079
 
1071
1080
  .e-ddt .e-chips {
1072
1081
  background-color: #bfbfbf;
1073
- border-radius: 0;
1074
1082
  }
1075
1083
 
1076
1084
  .e-ddt .e-chips .e-chips-close::before {
@@ -1085,6 +1093,10 @@ ejs-dropdownlist {
1085
1093
  background-color: #685708;
1086
1094
  }
1087
1095
 
1096
+ .e-ddt .e-chips:hover .e-chips-close::before {
1097
+ color: #fff;
1098
+ }
1099
+
1088
1100
  .e-ddt .e-chips:hover > .e-chipcontent {
1089
1101
  color: #fff;
1090
1102
  }
@@ -1103,7 +1115,7 @@ ejs-dropdownlist {
1103
1115
  }
1104
1116
 
1105
1117
  .e-ddt.e-popup .e-selectall-parent {
1106
- border-bottom: 1px solid #685708;
1118
+ border-bottom-color: #fff;
1107
1119
  }
1108
1120
 
1109
1121
  .e-ddt.e-popup .e-selectall-parent .e-all-text {
@@ -1,2 +1,2 @@
1
- @import 'layout.scss';
2
- @import 'theme.scss';
1
+ @import 'layout.scss';
2
+ @import 'theme.scss';
@@ -1,118 +1,118 @@
1
- //default
2
- $skin-name: 'bootstrap' !default;
3
- $listview-font-family: $font-family !default;
4
- $listview-text-color: rgba($grey-dark-font, 1) !default;
5
- $listview-text-disabled: $grey-light-font !default;
6
- $listview-icon-color: $grey-dark-font !default;
7
- $listview-icon-disabled: rgba($grey-dark-font, .5) !default;
8
- $listview-icon-margin-right: 10px !default;
9
- $listview-icon-back-margin: -2px !default;
10
- $listview-rtl-icon-back-margin: -1px !default;
11
- $listview-icon-line-height: 34px !default;
12
- $listview-icon-collapsible: '\e943' !default;
13
- $listview-icon-collapsible-rtl: '\e981' !default;
14
- $listview-icon-back-rtl: '\e85f' !default;
15
- $listview-back-icon: '\e94b' !default;
16
- $listview-background: $grey-base !default;
17
- $listview-line-color: rgba($grey-base, .1) !default;
18
- $listview-item-hover-bg: $grey !default;
19
- $listview-item-height: 40px !default;
20
- $listview-item-line-height: 36px !default;
21
- $listview-item-padding: 0 15px !default;
22
- $checkmark-bgcolor: $grey-base !default;
23
- $checkmark-border-color: $grey-dark-font !default;
24
- $checkmark-color: $grey-dark-font !default;
25
- $listview-border-bottom: 1px !default;
26
- $listview-border-top: 0 !default;
27
- $listview-border-left: 0 !default;
28
- $listview-border-right: 0 !default;
29
- $listview-hover-border-color: transparent !default;
30
- $listview-border-bottom-color: rgba($grey-44, 1) !default;
31
- $listview-border-top-color: transparent !default;
32
- $listview-border-right-color: transparent !default;
33
- $listview-border-left-color: transparent !default;
34
- $listview-group-first-border-bottom: 1px !default;
35
- $listview-group-border-top: 0 !default;
36
- $listview-group-border-bottom: 1px !default;
37
- $listview-text-hover-color: rgba($grey-light-font, .87) !default;
38
- $listview-item-active-bg: $grey-44 !default;
39
- $listview-text-active-color: rgba($grey-light-font, .87) !default;
40
- $listview-header-text-color: rgba($grey-light-font, .95) !default;
41
- $listview-header-text-disabled: $grey-light-font !default;
42
- $listview-header-text-padding: 20px !default;
43
- $listview-header-bg: $grey-white !default;
44
- $listview-header-icon-color: $grey-light-font !default;
45
- $listview-header-icon-disabled: $grey-light-font !default;
46
- $listview-header-border: $grey-44 !default;
47
- $listview-header-font-size: 14px !default;
48
- $listview-header-height: 40px !default;
49
- $listview-header-font-weight: bold !default;
50
- $listview-header-line-height: 1px !default;
51
- $listview-header-padding-bottom: 4px !default;
52
- $listview-groupheader-text-color: lighten($brand-primary, 15%) !default;
53
- $listview-groupheader-bg: $grey-base !default;
54
- $listview-groupheader-border: $grey-44 !default;
55
- $listview-groupheader-icon: $grey-dark-font !default;
56
- $listview-groupheader-item-height: 40px !default;
57
- $listview-groupheader-item-line-height: 36px !default;
58
- $listview-groupheader-font-size: 14px !default;
59
- $listview-border-size: 0 !default;
60
- $listview-font-size: 14px !default;
61
- $listview-back-padding-right: 10px !default;
62
- $listview-back-icon-height: 0 !default;
63
- $listview-back-icon-font-size: 14px !default;
64
- $listview-touch-item-height: 48px !default;
65
- $listview-touch-item-line-height: 45px !default;
66
- $listview-touch-item-font-size: 15px !default;
67
- $listview-touch-groupheader-height: 48px !default;
68
- $listview-touch-groupheader-line-height: 45px !default;
69
- $listview-touch-header-height: 48px !default;
70
- $listview-touch-header-font-weight: bold !default;
71
- $listview-touch-back-icon-padding: 2px !default;
72
- $listview-touch-header-font-size: 15px !default;
73
- $listview-touch-header-line-height: 6px !default;
74
- $listview-touch-header-icon-margin-top: 2px !default;
75
- $listview-checkbox-left-margin: -4px 10px 0 0 !default;
76
- $listview-checkbox-right-margin: -4px 0 0 10px !default;
77
- $listview-rtl-checkbox-left-margin: -4px 0 0 10px !default;
78
- $listview-rtl-checkbox-right-margin: -4px 10px 0 0 !default;
79
- //ListView In-built template variables
80
- $listview-template-padding: .7142em 1.0714em !default;
81
- $listview-template-avatar-padding-right: 1.0714em !default;
82
- $listview-template-avatar-padding-left: 4.6428em !default;
83
- $listview-template-avatar-rightposition-padding-right: 4.6428em !default;
84
- $listview-template-avatar-rightposition-padding-left: 1.0714em !default;
85
- $listview-template-avatar-size: 2.8571em !default;
86
- $listview-template-avatar-top: .7142em !default;
87
- $listview-template-avatar-left: 1.0667em !default;
88
- $listview-template-avatar-rightposition-right: 1.0667em !default;
89
- $listview-template-badge-height: 1.333em !default;
90
- $listview-template-badge-width: 2em !default;
91
- $listview-template-badge-line-height: 1.433em !default;
92
- $listview-template-badge-font-size: 15px !default;
93
- $listview-template-badge-right: 1em !default;
94
- $listview-template-avatar-badge-padding-right: 3.9285em !default;
95
- $listview-template-avatar-badge-padding-left: 4.6428em !default;
96
- $listview-template-badgewithoutavatar-padding-right: 3.9285em !default;
97
- $listview-template-badgewithoutavatar-padding-left: 1.0714em !default;
98
- $listview-template-item-padding: .83em 0 !default;
99
- $listview-template-multiline-header-color: $grey-light-font !default;
100
- $listview-template-multiline-content-color: $grey-light !default;
101
- $listview-template-multiline-header-padding: .038em 0 !default;
102
- $listview-template-multiline-content-padding: .038em 0 !default;
103
- $listview-template-multiline-header-font-size: 18px !default;
104
- $listview-template-multiline-padding: .7142em 1.0714em !default;
105
- $listview-template-multiline-content-font-size: 14px !default;
106
- $listview-template-multiline-avatar-top: .7142em !default;
107
- //enddefault
108
-
109
- $listbox-border-color: $grey-88;
110
- $badge-color: $brand-primary-font !default;
111
- $badge-bgcolor: $brand-primary !default;
112
-
113
- $select-all-border-color: $grey-88 !default;
114
-
115
- $listbox-filter-height: calc(100% - 52px) !default;
116
- $listbox-filter-small-height: calc(100% - 46px) !default;
117
- $listbox-filter-bigger-small-height: calc(100% - 54px) !default;
118
- $listbox-filter-bigger-height: calc(100% - 58px) !default;
1
+ //default
2
+ $skin-name: 'bootstrap' !default;
3
+ $listview-font-family: $font-family !default;
4
+ $listview-text-color: rgba($grey-dark-font, 1) !default;
5
+ $listview-text-disabled: $grey-light-font !default;
6
+ $listview-icon-color: $grey-dark-font !default;
7
+ $listview-icon-disabled: rgba($grey-dark-font, .5) !default;
8
+ $listview-icon-margin-right: 10px !default;
9
+ $listview-icon-back-margin: -2px !default;
10
+ $listview-rtl-icon-back-margin: -1px !default;
11
+ $listview-icon-line-height: 34px !default;
12
+ $listview-icon-collapsible: '\e943' !default;
13
+ $listview-icon-collapsible-rtl: '\e981' !default;
14
+ $listview-icon-back-rtl: '\e85f' !default;
15
+ $listview-back-icon: '\e94b' !default;
16
+ $listview-background: $grey-base !default;
17
+ $listview-line-color: rgba($grey-base, .1) !default;
18
+ $listview-item-hover-bg: $grey !default;
19
+ $listview-item-height: 40px !default;
20
+ $listview-item-line-height: 36px !default;
21
+ $listview-item-padding: 0 15px !default;
22
+ $checkmark-bgcolor: $grey-base !default;
23
+ $checkmark-border-color: $grey-dark-font !default;
24
+ $checkmark-color: $grey-dark-font !default;
25
+ $listview-border-bottom: 1px !default;
26
+ $listview-border-top: 0 !default;
27
+ $listview-border-left: 0 !default;
28
+ $listview-border-right: 0 !default;
29
+ $listview-hover-border-color: transparent !default;
30
+ $listview-border-bottom-color: rgba($grey-44, 1) !default;
31
+ $listview-border-top-color: transparent !default;
32
+ $listview-border-right-color: transparent !default;
33
+ $listview-border-left-color: transparent !default;
34
+ $listview-group-first-border-bottom: 1px !default;
35
+ $listview-group-border-top: 0 !default;
36
+ $listview-group-border-bottom: 1px !default;
37
+ $listview-text-hover-color: rgba($grey-light-font, .87) !default;
38
+ $listview-item-active-bg: $grey-44 !default;
39
+ $listview-text-active-color: rgba($grey-light-font, .87) !default;
40
+ $listview-header-text-color: rgba($grey-light-font, .95) !default;
41
+ $listview-header-text-disabled: $grey-light-font !default;
42
+ $listview-header-text-padding: 20px !default;
43
+ $listview-header-bg: $grey-white !default;
44
+ $listview-header-icon-color: $grey-light-font !default;
45
+ $listview-header-icon-disabled: $grey-light-font !default;
46
+ $listview-header-border: $grey-44 !default;
47
+ $listview-header-font-size: 14px !default;
48
+ $listview-header-height: 40px !default;
49
+ $listview-header-font-weight: bold !default;
50
+ $listview-header-line-height: 1px !default;
51
+ $listview-header-padding-bottom: 4px !default;
52
+ $listview-groupheader-text-color: lighten($brand-primary, 15%) !default;
53
+ $listview-groupheader-bg: $grey-base !default;
54
+ $listview-groupheader-border: $grey-44 !default;
55
+ $listview-groupheader-icon: $grey-dark-font !default;
56
+ $listview-groupheader-item-height: 40px !default;
57
+ $listview-groupheader-item-line-height: 36px !default;
58
+ $listview-groupheader-font-size: 14px !default;
59
+ $listview-border-size: 0 !default;
60
+ $listview-font-size: 14px !default;
61
+ $listview-back-padding-right: 10px !default;
62
+ $listview-back-icon-height: 0 !default;
63
+ $listview-back-icon-font-size: 14px !default;
64
+ $listview-touch-item-height: 48px !default;
65
+ $listview-touch-item-line-height: 45px !default;
66
+ $listview-touch-item-font-size: 15px !default;
67
+ $listview-touch-groupheader-height: 48px !default;
68
+ $listview-touch-groupheader-line-height: 45px !default;
69
+ $listview-touch-header-height: 48px !default;
70
+ $listview-touch-header-font-weight: bold !default;
71
+ $listview-touch-back-icon-padding: 2px !default;
72
+ $listview-touch-header-font-size: 15px !default;
73
+ $listview-touch-header-line-height: 6px !default;
74
+ $listview-touch-header-icon-margin-top: 2px !default;
75
+ $listview-checkbox-left-margin: -4px 10px 0 0 !default;
76
+ $listview-checkbox-right-margin: -4px 0 0 10px !default;
77
+ $listview-rtl-checkbox-left-margin: -4px 0 0 10px !default;
78
+ $listview-rtl-checkbox-right-margin: -4px 10px 0 0 !default;
79
+ //ListView In-built template variables
80
+ $listview-template-padding: .7142em 1.0714em !default;
81
+ $listview-template-avatar-padding-right: 1.0714em !default;
82
+ $listview-template-avatar-padding-left: 4.6428em !default;
83
+ $listview-template-avatar-rightposition-padding-right: 4.6428em !default;
84
+ $listview-template-avatar-rightposition-padding-left: 1.0714em !default;
85
+ $listview-template-avatar-size: 2.8571em !default;
86
+ $listview-template-avatar-top: .7142em !default;
87
+ $listview-template-avatar-left: 1.0667em !default;
88
+ $listview-template-avatar-rightposition-right: 1.0667em !default;
89
+ $listview-template-badge-height: 1.333em !default;
90
+ $listview-template-badge-width: 2em !default;
91
+ $listview-template-badge-line-height: 1.433em !default;
92
+ $listview-template-badge-font-size: 15px !default;
93
+ $listview-template-badge-right: 1em !default;
94
+ $listview-template-avatar-badge-padding-right: 3.9285em !default;
95
+ $listview-template-avatar-badge-padding-left: 4.6428em !default;
96
+ $listview-template-badgewithoutavatar-padding-right: 3.9285em !default;
97
+ $listview-template-badgewithoutavatar-padding-left: 1.0714em !default;
98
+ $listview-template-item-padding: .83em 0 !default;
99
+ $listview-template-multiline-header-color: $grey-light-font !default;
100
+ $listview-template-multiline-content-color: $grey-light !default;
101
+ $listview-template-multiline-header-padding: .038em 0 !default;
102
+ $listview-template-multiline-content-padding: .038em 0 !default;
103
+ $listview-template-multiline-header-font-size: 18px !default;
104
+ $listview-template-multiline-padding: .7142em 1.0714em !default;
105
+ $listview-template-multiline-content-font-size: 14px !default;
106
+ $listview-template-multiline-avatar-top: .7142em !default;
107
+ //enddefault
108
+
109
+ $listbox-border-color: $grey-88;
110
+ $badge-color: $brand-primary-font !default;
111
+ $badge-bgcolor: $brand-primary !default;
112
+
113
+ $select-all-border-color: $grey-88 !default;
114
+
115
+ $listbox-filter-height: calc(100% - 52px) !default;
116
+ $listbox-filter-small-height: calc(100% - 46px) !default;
117
+ $listbox-filter-bigger-small-height: calc(100% - 54px) !default;
118
+ $listbox-filter-bigger-height: calc(100% - 58px) !default;