@syncfusion/ej2-lists 25.2.3 → 26.1.35-750253

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 (105) hide show
  1. package/.eslintrc.json +3 -2
  2. package/dist/ej2-lists.min.js +2 -2
  3. package/dist/ej2-lists.umd.min.js +2 -2
  4. package/dist/ej2-lists.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-lists.es2015.js +255 -279
  6. package/dist/es6/ej2-lists.es2015.js.map +1 -1
  7. package/dist/es6/ej2-lists.es5.js +241 -265
  8. package/dist/es6/ej2-lists.es5.js.map +1 -1
  9. package/dist/global/ej2-lists.min.js +2 -2
  10. package/dist/global/ej2-lists.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +10 -10
  13. package/src/common/list-base.d.ts +61 -30
  14. package/src/common/list-base.js +167 -94
  15. package/src/list-view/list-view.d.ts +7 -9
  16. package/src/list-view/list-view.js +42 -75
  17. package/src/list-view/virtualization.d.ts +0 -1
  18. package/src/list-view/virtualization.js +10 -66
  19. package/src/sortable/sortable.d.ts +5 -0
  20. package/src/sortable/sortable.js +14 -7
  21. package/styles/bootstrap-dark.css +100 -122
  22. package/styles/bootstrap-dark.scss +8 -2
  23. package/styles/bootstrap.css +100 -122
  24. package/styles/bootstrap.scss +8 -2
  25. package/styles/bootstrap4.css +139 -161
  26. package/styles/bootstrap4.scss +8 -2
  27. package/styles/bootstrap5-dark.css +101 -125
  28. package/styles/bootstrap5-dark.scss +8 -2
  29. package/styles/bootstrap5.css +101 -125
  30. package/styles/bootstrap5.scss +8 -2
  31. package/styles/fabric-dark.css +100 -122
  32. package/styles/fabric-dark.scss +8 -2
  33. package/styles/fabric.css +100 -122
  34. package/styles/fabric.scss +8 -2
  35. package/styles/fluent-dark.css +143 -165
  36. package/styles/fluent-dark.scss +8 -2
  37. package/styles/fluent.css +143 -165
  38. package/styles/fluent.scss +8 -2
  39. package/styles/fluent2.css +1485 -0
  40. package/styles/fluent2.scss +8 -0
  41. package/styles/highcontrast-light.css +100 -122
  42. package/styles/highcontrast-light.scss +8 -2
  43. package/styles/highcontrast.css +100 -122
  44. package/styles/highcontrast.scss +8 -2
  45. package/styles/list-view/_bootstrap4-definition.scss +5 -0
  46. package/styles/list-view/_bootstrap5.3-definition.scss +132 -0
  47. package/styles/list-view/_fluent2-definition.scss +132 -0
  48. package/styles/list-view/_layout.scss +377 -393
  49. package/styles/list-view/_material3-definition.scss +0 -7
  50. package/styles/list-view/_theme.scss +84 -95
  51. package/styles/list-view/bootstrap-dark.css +97 -121
  52. package/styles/list-view/bootstrap.css +97 -121
  53. package/styles/list-view/bootstrap4.css +136 -160
  54. package/styles/list-view/bootstrap5-dark.css +98 -124
  55. package/styles/list-view/bootstrap5.css +98 -124
  56. package/styles/list-view/fabric-dark.css +97 -121
  57. package/styles/list-view/fabric.css +97 -121
  58. package/styles/list-view/fluent-dark.css +140 -164
  59. package/styles/list-view/fluent.css +140 -164
  60. package/styles/list-view/fluent2.css +1455 -0
  61. package/styles/list-view/fluent2.scss +5 -0
  62. package/styles/list-view/highcontrast-light.css +97 -121
  63. package/styles/list-view/highcontrast.css +97 -121
  64. package/styles/list-view/icons/_bootstrap5.3.scss +8 -0
  65. package/styles/list-view/icons/_fluent2.scss +10 -0
  66. package/styles/list-view/material-dark.css +97 -121
  67. package/styles/list-view/material.css +97 -121
  68. package/styles/list-view/material3-dark.css +112 -136
  69. package/styles/list-view/material3.css +112 -136
  70. package/styles/list-view/tailwind-dark.css +207 -235
  71. package/styles/list-view/tailwind.css +207 -235
  72. package/styles/material-dark.css +100 -122
  73. package/styles/material-dark.scss +8 -2
  74. package/styles/material.css +100 -122
  75. package/styles/material.scss +8 -2
  76. package/styles/material3-dark.css +115 -137
  77. package/styles/material3-dark.scss +8 -2
  78. package/styles/material3.css +115 -137
  79. package/styles/material3.scss +8 -2
  80. package/styles/sortable/_bootstrap5.3-definition.scss +1 -0
  81. package/styles/sortable/_fluent2-definition.scss +1 -0
  82. package/styles/sortable/bootstrap-dark.css +3 -1
  83. package/styles/sortable/bootstrap.css +3 -1
  84. package/styles/sortable/bootstrap4.css +3 -1
  85. package/styles/sortable/bootstrap5-dark.css +3 -1
  86. package/styles/sortable/bootstrap5.css +3 -1
  87. package/styles/sortable/fabric-dark.css +3 -1
  88. package/styles/sortable/fabric.css +3 -1
  89. package/styles/sortable/fluent-dark.css +3 -1
  90. package/styles/sortable/fluent.css +3 -1
  91. package/styles/sortable/fluent2.css +1063 -0
  92. package/styles/sortable/fluent2.scss +3 -0
  93. package/styles/sortable/highcontrast-light.css +3 -1
  94. package/styles/sortable/highcontrast.css +3 -1
  95. package/styles/sortable/material-dark.css +3 -1
  96. package/styles/sortable/material.css +3 -1
  97. package/styles/sortable/material3-dark.css +4 -2
  98. package/styles/sortable/material3.css +4 -2
  99. package/styles/sortable/tailwind-dark.css +3 -1
  100. package/styles/sortable/tailwind.css +3 -1
  101. package/styles/tailwind-dark.css +210 -236
  102. package/styles/tailwind-dark.scss +8 -2
  103. package/styles/tailwind.css +210 -236
  104. package/styles/tailwind.scss +8 -2
  105. package/CHANGELOG.md +0 -544
@@ -8,97 +8,6 @@
8
8
  }
9
9
 
10
10
  /* stylelint-disable property-no-vendor-prefix */
11
- .e-bigger .e-listview .e-list-item,
12
- .e-listview.e-bigger .e-list-item {
13
- border-bottom: 0 solid #edebe9;
14
- border-left: 0 solid transparent;
15
- border-right: 0 solid transparent;
16
- border-top: 0 solid transparent;
17
- }
18
- .e-bigger .e-listview:not(.e-list-template) .e-list-item,
19
- .e-listview.e-bigger:not(.e-list-template) .e-list-item {
20
- height: 44px;
21
- line-height: 24px;
22
- position: relative;
23
- }
24
- .e-bigger .e-listview .e-text-content,
25
- .e-listview.e-bigger .e-text-content {
26
- font-size: 16px;
27
- }
28
- .e-bigger .e-listview .e-list-group-item,
29
- .e-listview.e-bigger .e-list-group-item {
30
- height: 44px;
31
- line-height: 24px;
32
- padding: 10px 16px;
33
- font-size: 16px;
34
- }
35
- .e-bigger .e-listview .e-list-header,
36
- .e-listview.e-bigger .e-list-header {
37
- -ms-flex-align: center;
38
- align-items: center;
39
- display: -ms-flexbox;
40
- display: flex;
41
- font-weight: 600;
42
- height: 44px;
43
- font-size: 14px;
44
- line-height: 22px;
45
- padding: 10px 16px;
46
- }
47
- .e-bigger .e-listview .e-list-header .e-text.header,
48
- .e-listview.e-bigger .e-list-header .e-text.header {
49
- display: none;
50
- }
51
- .e-bigger .e-listview .e-list-header .e-headertemplate-text.nested-header,
52
- .e-listview.e-bigger .e-list-header .e-headertemplate-text.nested-header {
53
- display: none;
54
- }
55
- .e-bigger .e-listview .e-list-header .e-text,
56
- .e-listview.e-bigger .e-list-header .e-text {
57
- font-size: 14px;
58
- }
59
- .e-bigger .e-listview .e-listview-checkbox.e-checkbox-left,
60
- .e-listview.e-bigger .e-listview-checkbox.e-checkbox-left {
61
- margin: 0 16px 0 0;
62
- border: 0;
63
- padding: 0;
64
- }
65
- .e-bigger .e-listview.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
66
- .e-listview.e-bigger.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
67
- margin: 7px 12px 7px 16px;
68
- }
69
- .e-bigger .e-listview .e-text-content.e-checkbox .e-list-text,
70
- .e-listview.e-bigger .e-text-content.e-checkbox .e-list-text {
71
- width: calc(100% - 60px);
72
- }
73
- .e-bigger .e-listview.e-list-template .e-list-wrapper:not(.e-list-multi-line),
74
- .e-listview.e-bigger.e-list-template .e-list-wrapper:not(.e-list-multi-line) {
75
- padding: 12px 16px;
76
- }
77
- .e-bigger .e-listview.e-list-template .e-list-wrapper.e-list-multi-line,
78
- .e-listview.e-bigger.e-list-template .e-list-wrapper.e-list-multi-line {
79
- padding: 8px 4px;
80
- }
81
- .e-bigger .e-listview.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header,
82
- .e-listview.e-bigger.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header {
83
- font-size: 16px;
84
- line-height: 24px;
85
- }
86
- .e-bigger .e-listview.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content,
87
- .e-listview.e-bigger.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content {
88
- font-size: 14px;
89
- line-height: 22px;
90
- }
91
- .e-bigger .e-listview.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
92
- .e-listview.e-bigger.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
93
- height: 48px;
94
- width: 48px;
95
- }
96
- .e-bigger .e-listview.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content,
97
- .e-listview.e-bigger.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content {
98
- font-size: 16px;
99
- line-height: 24px;
100
- }
101
-
102
11
  .e-listview {
103
12
  -webkit-overflow-scrolling: touch;
104
13
  border: 1px solid;
@@ -111,8 +20,8 @@
111
20
  .e-listview:not(.e-list-template) .e-list-item {
112
21
  height: 38px;
113
22
  line-height: 22px;
114
- padding: 7px 12px 7px 12px;
115
23
  position: relative;
24
+ padding: 7px 12px 7px 12px;
116
25
  }
117
26
  .e-listview .e-list-item {
118
27
  border-bottom: 1px solid;
@@ -124,28 +33,33 @@
124
33
  padding: 0;
125
34
  }
126
35
 
127
- .e-listview .e-list-header .e-text.header {
128
- display: none;
129
- }
130
-
131
36
  .e-listview .e-icon-back {
132
37
  margin-top: 0;
133
38
  margin-right: 12px;
134
39
  }
135
40
 
136
- .e-listview .e-list-header .e-headertemplate-text.nested-header {
137
- display: none;
138
- }
139
-
140
41
  .e-listview .e-list-header {
141
- -ms-flex-align: center;
142
- align-items: center;
42
+ -webkit-box-align: center;
43
+ -ms-flex-align: center;
44
+ align-items: center;
45
+ display: -webkit-box;
143
46
  display: -ms-flexbox;
144
47
  display: flex;
145
48
  font-weight: 600;
146
49
  height: 38px;
147
50
  padding: 0 12px;
148
51
  }
52
+ .e-listview .e-list-header .e-text.header,
53
+ .e-listview .e-list-header .e-headertemplate-text.nested-header {
54
+ display: none;
55
+ }
56
+ .e-listview .e-list-header.e-list-navigation .e-text {
57
+ cursor: pointer;
58
+ }
59
+ .e-listview .e-list-header .e-text {
60
+ cursor: default;
61
+ text-indent: 0;
62
+ }
149
63
 
150
64
  .e-listview .e-has-header > .e-view {
151
65
  top: 45px;
@@ -157,11 +71,6 @@
157
71
  font-size: 12px;
158
72
  }
159
73
 
160
- .e-listview .e-list-group-item:first-child {
161
- border: 0;
162
- border-bottom: 0 solid #edebe9;
163
- }
164
-
165
74
  .e-listview .e-list-group-item {
166
75
  border-bottom: 0 solid #edebe9;
167
76
  border-top: 1px solid;
@@ -173,6 +82,10 @@
173
82
  .e-listview .e-list-group-item .e-list-text {
174
83
  cursor: default;
175
84
  }
85
+ .e-listview .e-list-group-item:first-child {
86
+ border: 0;
87
+ border-bottom: 0 solid #edebe9;
88
+ }
176
89
 
177
90
  .e-listview .e-icon-collapsible {
178
91
  cursor: pointer;
@@ -180,7 +93,8 @@
180
93
  position: absolute;
181
94
  right: 0%;
182
95
  top: 50%;
183
- transform: translateY(-50%);
96
+ -webkit-transform: translateY(-50%);
97
+ transform: translateY(-50%);
184
98
  }
185
99
 
186
100
  .e-listview .e-text-content {
@@ -188,24 +102,21 @@
188
102
  position: relative;
189
103
  vertical-align: middle;
190
104
  }
191
-
192
- .e-listview .e-text-content * {
193
- display: inline-block;
194
- vertical-align: middle;
195
- }
196
-
197
105
  .e-listview .e-text-content.e-checkbox .e-list-text {
198
106
  width: calc(100% - 40px);
199
107
  }
200
-
201
108
  .e-listview .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text {
202
109
  width: calc(100% - 90px);
203
110
  }
204
-
205
111
  .e-listview .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
206
112
  width: calc(100% - 80px);
207
113
  }
208
114
 
115
+ .e-listview .e-text-content * {
116
+ display: inline-block;
117
+ vertical-align: middle;
118
+ }
119
+
209
120
  .e-listview .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
210
121
  width: calc(100% - 92px);
211
122
  }
@@ -213,7 +124,6 @@
213
124
  .e-listview .e-checkbox .e-checkbox-left {
214
125
  margin: -2px 10px 0 0;
215
126
  }
216
-
217
127
  .e-listview .e-checkbox .e-checkbox-right {
218
128
  margin: -2px 0 0 8px;
219
129
  }
@@ -228,15 +138,7 @@
228
138
  width: 100%;
229
139
  }
230
140
 
231
- .e-listview .e-list-icon + .e-list-text {
232
- width: calc(100% - 60px);
233
- }
234
-
235
- .e-listview .e-icon-wrapper .e-list-text {
236
- width: calc(100% - 60px);
237
- }
238
-
239
- .e-listview .e-icon-wrapper.e-text-content.e-checkbox .e-list-text {
141
+ .e-listview .e-list-icon + .e-list-text, .e-listview .e-icon-wrapper .e-list-text, .e-listview .e-icon-wrapper.e-text-content.e-checkbox .e-list-text {
240
142
  width: calc(100% - 60px);
241
143
  }
242
144
 
@@ -251,15 +153,6 @@
251
153
  position: relative;
252
154
  }
253
155
 
254
- .e-listview .e-list-header.e-list-navigation .e-text {
255
- cursor: pointer;
256
- }
257
-
258
- .e-listview .e-list-header .e-text {
259
- cursor: default;
260
- text-indent: 0;
261
- }
262
-
263
156
  .e-listview .e-text .e-headertext {
264
157
  display: inline-block;
265
158
  line-height: 18px;
@@ -280,13 +173,15 @@
280
173
  left: 0%;
281
174
  right: initial;
282
175
  top: 50%;
283
- transform: translateY(-50%) rotate(180deg);
176
+ -webkit-transform: translateY(-50%) rotate(180deg);
177
+ transform: translateY(-50%) rotate(180deg);
284
178
  }
285
179
  .e-listview.e-rtl .e-list-header .e-text {
286
180
  cursor: pointer;
287
181
  }
288
182
  .e-listview.e-rtl .e-back-button {
289
- transform: rotate(180deg);
183
+ -webkit-transform: rotate(180deg);
184
+ transform: rotate(180deg);
290
185
  }
291
186
  .e-listview.e-rtl .e-icon-back {
292
187
  margin-top: 4px;
@@ -298,6 +193,97 @@
298
193
  margin: -2px 8px 0 0;
299
194
  }
300
195
 
196
+ .e-bigger .e-listview .e-list-item,
197
+ .e-listview.e-bigger .e-list-item {
198
+ border-bottom: 0 solid #edebe9;
199
+ border-left: 0 solid transparent;
200
+ border-right: 0 solid transparent;
201
+ border-top: 0 solid transparent;
202
+ }
203
+ .e-bigger .e-listview:not(.e-list-template) .e-list-item,
204
+ .e-listview.e-bigger:not(.e-list-template) .e-list-item {
205
+ height: 44px;
206
+ line-height: 24px;
207
+ position: relative;
208
+ }
209
+ .e-bigger .e-listview .e-text-content,
210
+ .e-listview.e-bigger .e-text-content {
211
+ font-size: 16px;
212
+ }
213
+ .e-bigger .e-listview .e-list-group-item,
214
+ .e-listview.e-bigger .e-list-group-item {
215
+ height: 44px;
216
+ line-height: 24px;
217
+ padding: 10px 16px;
218
+ font-size: 16px;
219
+ }
220
+ .e-bigger .e-listview .e-list-header,
221
+ .e-listview.e-bigger .e-list-header {
222
+ -webkit-box-align: center;
223
+ -ms-flex-align: center;
224
+ align-items: center;
225
+ display: -webkit-box;
226
+ display: -ms-flexbox;
227
+ display: flex;
228
+ font-weight: 600;
229
+ height: 44px;
230
+ font-size: 14px;
231
+ line-height: 22px;
232
+ padding: 10px 16px;
233
+ }
234
+ .e-bigger .e-listview .e-list-header .e-text.header,
235
+ .e-bigger .e-listview .e-list-header .e-headertemplate-text.nested-header,
236
+ .e-listview.e-bigger .e-list-header .e-text.header,
237
+ .e-listview.e-bigger .e-list-header .e-headertemplate-text.nested-header {
238
+ display: none;
239
+ }
240
+ .e-bigger .e-listview .e-list-header .e-text,
241
+ .e-listview.e-bigger .e-list-header .e-text {
242
+ font-size: 14px;
243
+ }
244
+ .e-bigger .e-listview .e-listview-checkbox.e-checkbox-left,
245
+ .e-listview.e-bigger .e-listview-checkbox.e-checkbox-left {
246
+ border: 0;
247
+ padding: 0;
248
+ margin: 0 16px 0 0;
249
+ }
250
+ .e-bigger .e-listview.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
251
+ .e-listview.e-bigger.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
252
+ margin: 7px 12px 7px 16px;
253
+ }
254
+ .e-bigger .e-listview .e-text-content.e-checkbox .e-list-text,
255
+ .e-listview.e-bigger .e-text-content.e-checkbox .e-list-text {
256
+ width: calc(100% - 60px);
257
+ }
258
+ .e-bigger .e-listview.e-list-template .e-list-wrapper:not(.e-list-multi-line),
259
+ .e-listview.e-bigger.e-list-template .e-list-wrapper:not(.e-list-multi-line) {
260
+ padding: 12px 16px;
261
+ }
262
+ .e-bigger .e-listview.e-list-template .e-list-wrapper.e-list-multi-line,
263
+ .e-listview.e-bigger.e-list-template .e-list-wrapper.e-list-multi-line {
264
+ padding: 8px 4px;
265
+ }
266
+ .e-bigger .e-listview.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header,
267
+ .e-listview.e-bigger.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header {
268
+ font-size: 16px;
269
+ line-height: 24px;
270
+ }
271
+ .e-bigger .e-listview.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content,
272
+ .e-listview.e-bigger.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content {
273
+ font-size: 14px;
274
+ line-height: 22px;
275
+ }
276
+ .e-bigger .e-listview.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
277
+ .e-listview.e-bigger.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
278
+ height: 48px;
279
+ width: 48px;
280
+ }
281
+ .e-bigger .e-listview.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content,
282
+ .e-listview.e-bigger.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content {
283
+ font-size: 16px;
284
+ line-height: 24px;
285
+ }
286
+
301
287
  .e-listview {
302
288
  border-color: #edebe9;
303
289
  font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, "Roboto", "Helvetica Neue", sans-serif;
@@ -305,8 +291,8 @@
305
291
  }
306
292
  .e-listview .e-list-header {
307
293
  background-color: transparent;
308
- border-color: #edebe9;
309
294
  color: #0078d4;
295
+ border-color: #edebe9;
310
296
  font-size: 14px;
311
297
  }
312
298
 
@@ -315,45 +301,40 @@
315
301
  }
316
302
 
317
303
  .e-listview .e-list-item {
318
- background-color: transparent;
319
304
  border-bottom: 0 solid #edebe9;
320
305
  border-left: 0 solid transparent;
321
306
  border-right: 0 solid transparent;
322
307
  border-top: 0 solid transparent;
308
+ background-color: transparent;
323
309
  color: #201f1e;
324
310
  }
325
-
326
311
  .e-listview .e-list-item.e-hover, .e-listview .e-list-item.e-hover.e-active.e-checklist {
327
312
  background-color: #f3f2f1;
328
- border-color: #edebe9;
329
313
  color: #201f1e;
314
+ border-color: #edebe9;
330
315
  }
331
-
332
316
  .e-listview .e-list-item.e-active {
333
317
  background-color: #edebe9;
334
318
  color: #201f1e;
335
319
  }
336
-
337
320
  .e-listview .e-list-item.e-active.e-checklist {
338
321
  background-color: transparent;
339
322
  color: #201f1e;
340
323
  }
341
-
342
324
  .e-listview .e-list-item.e-focused, .e-listview .e-list-item.e-focused.e-active.e-checklist {
343
325
  background-color: #edebe9;
344
326
  color: #201f1e;
345
327
  }
346
-
347
328
  .e-listview .e-list-item.e-focused .e-checkbox-wrapper .e-frame.e-check, .e-listview .e-list-item.e-focused .e-css.e-checkbox-wrapper .e-frame.e-check {
348
329
  background-color: #fff;
349
- border-color: #fff;
350
330
  color: #0078d4;
331
+ border-color: #fff;
351
332
  }
352
333
 
353
334
  .e-listview .e-list-group-item {
354
335
  background-color: transparent;
355
- border-color: #edebe9;
356
336
  color: #0078d4;
337
+ border-color: #edebe9;
357
338
  font-size: 14px;
358
339
  }
359
340
 
@@ -399,10 +380,10 @@
399
380
  }
400
381
  .e-listview.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
401
382
  height: 40px;
383
+ width: 40px;
384
+ top: 0;
402
385
  left: 0;
403
386
  position: absolute;
404
- top: 0;
405
- width: 40px;
406
387
  margin: 7px 16px 7px 12px;
407
388
  }
408
389
  .e-listview.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
@@ -415,10 +396,10 @@
415
396
  }
416
397
  .e-listview.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
417
398
  height: 40px;
418
- position: absolute;
419
- right: 0;
420
- top: 0;
421
399
  width: 40px;
400
+ top: 0;
401
+ right: 0;
402
+ position: absolute;
422
403
  }
423
404
  .e-listview.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar {
424
405
  top: 0;
@@ -429,13 +410,14 @@
429
410
  .e-listview.e-list-template .e-list-wrapper.e-list-badge .e-badge {
430
411
  font-size: 10px;
431
412
  height: 18px;
413
+ width: 20px;
414
+ top: 50%;
415
+ right: 12px;
432
416
  line-height: 16px;
433
417
  padding: 0;
434
418
  position: absolute;
435
- right: 12px;
436
- top: 50%;
437
- transform: translateY(-50%);
438
- width: 20px;
419
+ -webkit-transform: translateY(-50%);
420
+ transform: translateY(-50%);
439
421
  border-radius: 10px;
440
422
  }
441
423
  .e-listview.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
@@ -454,16 +436,10 @@
454
436
  text-overflow: ellipsis;
455
437
  white-space: nowrap;
456
438
  }
457
- .e-listview.e-list-template .e-list-item.e-hover .e-list-item-header {
458
- color: #201f1e;
459
- }
460
- .e-listview.e-list-template .e-list-item.e-hover .e-list-content {
461
- color: #201f1e;
462
- }
463
- .e-listview.e-list-template .e-list-item.e-active .e-list-item-header {
439
+ .e-listview.e-list-template .e-list-item.e-hover .e-list-item-header, .e-listview.e-list-template .e-list-item.e-hover .e-list-content {
464
440
  color: #201f1e;
465
441
  }
466
- .e-listview.e-list-template .e-list-item.e-active .e-list-content {
442
+ .e-listview.e-list-template .e-list-item.e-active .e-list-item-header, .e-listview.e-list-template .e-list-item.e-active .e-list-content {
467
443
  color: #201f1e;
468
444
  }
469
445
  .e-listview.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {