@syncfusion/ej2-layouts 26.2.10 → 27.1.48

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 (274) hide show
  1. package/README.md +33 -33
  2. package/dist/ej2-layouts.min.js +2 -2
  3. package/dist/ej2-layouts.umd.min.js +2 -2
  4. package/dist/ej2-layouts.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-layouts.es2015.js +3 -1
  6. package/dist/es6/ej2-layouts.es2015.js.map +1 -1
  7. package/dist/es6/ej2-layouts.es5.js +3 -1
  8. package/dist/es6/ej2-layouts.es5.js.map +1 -1
  9. package/dist/global/ej2-layouts.min.js +2 -2
  10. package/dist/global/ej2-layouts.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +8 -7
  13. package/src/splitter/splitter.js +3 -1
  14. package/styles/avatar/_layout.scss +6 -6
  15. package/styles/avatar/bootstrap5.3.css +66 -0
  16. package/styles/avatar/bootstrap5.3.scss +3 -0
  17. package/styles/bootstrap-dark-lite.css +1521 -0
  18. package/styles/bootstrap-dark-lite.scss +14 -0
  19. package/styles/bootstrap-dark.css +213 -211
  20. package/styles/bootstrap-dark.scss +5 -1
  21. package/styles/bootstrap-lite.css +1521 -0
  22. package/styles/bootstrap-lite.scss +14 -0
  23. package/styles/bootstrap.css +214 -212
  24. package/styles/bootstrap.scss +5 -1
  25. package/styles/bootstrap4-lite.css +1517 -0
  26. package/styles/bootstrap4-lite.scss +14 -0
  27. package/styles/bootstrap4.css +222 -220
  28. package/styles/bootstrap4.scss +5 -1
  29. package/styles/bootstrap5-dark-lite.css +1538 -0
  30. package/styles/bootstrap5-dark-lite.scss +14 -0
  31. package/styles/bootstrap5-dark.css +214 -212
  32. package/styles/bootstrap5-dark.scss +5 -1
  33. package/styles/bootstrap5-lite.css +1538 -0
  34. package/styles/bootstrap5-lite.scss +14 -0
  35. package/styles/bootstrap5.3-lite.css +1530 -0
  36. package/styles/bootstrap5.3-lite.scss +14 -0
  37. package/styles/bootstrap5.3.css +1764 -0
  38. package/styles/bootstrap5.3.scss +18 -0
  39. package/styles/bootstrap5.css +214 -212
  40. package/styles/bootstrap5.scss +5 -1
  41. package/styles/card/_bigger.scss +165 -0
  42. package/styles/card/_layout.scss +2 -164
  43. package/styles/card/bootstrap-dark.css +135 -135
  44. package/styles/card/bootstrap-dark.scss +1 -0
  45. package/styles/card/bootstrap.css +136 -136
  46. package/styles/card/bootstrap.scss +1 -0
  47. package/styles/card/bootstrap4.css +144 -144
  48. package/styles/card/bootstrap4.scss +1 -0
  49. package/styles/card/bootstrap5-dark.css +136 -136
  50. package/styles/card/bootstrap5-dark.scss +1 -0
  51. package/styles/card/bootstrap5.3.css +560 -0
  52. package/styles/card/bootstrap5.3.scss +4 -0
  53. package/styles/card/bootstrap5.css +136 -136
  54. package/styles/card/bootstrap5.scss +1 -0
  55. package/styles/card/fabric-dark.css +135 -135
  56. package/styles/card/fabric-dark.scss +1 -0
  57. package/styles/card/fabric.css +136 -136
  58. package/styles/card/fabric.scss +1 -0
  59. package/styles/card/fluent-dark.css +143 -143
  60. package/styles/card/fluent-dark.scss +1 -0
  61. package/styles/card/fluent.css +143 -143
  62. package/styles/card/fluent.scss +1 -0
  63. package/styles/card/fluent2.css +138 -138
  64. package/styles/card/fluent2.scss +1 -0
  65. package/styles/card/highcontrast-light.css +135 -135
  66. package/styles/card/highcontrast-light.scss +1 -0
  67. package/styles/card/highcontrast.css +136 -136
  68. package/styles/card/highcontrast.scss +1 -0
  69. package/styles/card/material-dark.css +135 -135
  70. package/styles/card/material-dark.scss +1 -0
  71. package/styles/card/material.css +135 -135
  72. package/styles/card/material.scss +1 -0
  73. package/styles/card/material3-dark.css +135 -135
  74. package/styles/card/material3-dark.scss +1 -0
  75. package/styles/card/material3.css +135 -135
  76. package/styles/card/material3.scss +1 -0
  77. package/styles/card/tailwind-dark.css +135 -135
  78. package/styles/card/tailwind-dark.scss +1 -0
  79. package/styles/card/tailwind.css +135 -135
  80. package/styles/card/tailwind.scss +1 -0
  81. package/styles/dashboard-layout/_bigger.scss +39 -0
  82. package/styles/dashboard-layout/_bootstrap5.3-definition.scss +5 -5
  83. package/styles/dashboard-layout/_fluent2-definition.scss +3 -4
  84. package/styles/dashboard-layout/_layout.scss +0 -32
  85. package/styles/dashboard-layout/_theme.scss +0 -6
  86. package/styles/dashboard-layout/bootstrap-dark.css +14 -13
  87. package/styles/dashboard-layout/bootstrap-dark.scss +1 -0
  88. package/styles/dashboard-layout/bootstrap.css +14 -13
  89. package/styles/dashboard-layout/bootstrap.scss +1 -0
  90. package/styles/dashboard-layout/bootstrap4.css +14 -13
  91. package/styles/dashboard-layout/bootstrap4.scss +1 -0
  92. package/styles/dashboard-layout/bootstrap5-dark.css +14 -13
  93. package/styles/dashboard-layout/bootstrap5-dark.scss +1 -0
  94. package/styles/dashboard-layout/bootstrap5.3.css +300 -0
  95. package/styles/dashboard-layout/bootstrap5.3.scss +5 -0
  96. package/styles/dashboard-layout/bootstrap5.css +14 -13
  97. package/styles/dashboard-layout/bootstrap5.scss +1 -0
  98. package/styles/dashboard-layout/fabric-dark.css +14 -13
  99. package/styles/dashboard-layout/fabric-dark.scss +1 -0
  100. package/styles/dashboard-layout/fabric.css +14 -13
  101. package/styles/dashboard-layout/fabric.scss +1 -0
  102. package/styles/dashboard-layout/fluent-dark.css +14 -13
  103. package/styles/dashboard-layout/fluent-dark.scss +1 -0
  104. package/styles/dashboard-layout/fluent.css +14 -13
  105. package/styles/dashboard-layout/fluent.scss +1 -0
  106. package/styles/dashboard-layout/fluent2.css +18 -17
  107. package/styles/dashboard-layout/fluent2.scss +1 -0
  108. package/styles/dashboard-layout/highcontrast-light.css +14 -13
  109. package/styles/dashboard-layout/highcontrast-light.scss +1 -0
  110. package/styles/dashboard-layout/highcontrast.css +14 -13
  111. package/styles/dashboard-layout/highcontrast.scss +1 -0
  112. package/styles/dashboard-layout/material-dark.css +14 -13
  113. package/styles/dashboard-layout/material-dark.scss +1 -0
  114. package/styles/dashboard-layout/material.css +14 -13
  115. package/styles/dashboard-layout/material.scss +1 -0
  116. package/styles/dashboard-layout/material3-dark.css +14 -13
  117. package/styles/dashboard-layout/material3-dark.scss +1 -0
  118. package/styles/dashboard-layout/material3.css +14 -13
  119. package/styles/dashboard-layout/material3.scss +1 -0
  120. package/styles/dashboard-layout/tailwind-dark.css +21 -19
  121. package/styles/dashboard-layout/tailwind-dark.scss +1 -0
  122. package/styles/dashboard-layout/tailwind.css +21 -19
  123. package/styles/dashboard-layout/tailwind.scss +1 -0
  124. package/styles/fabric-dark-lite.css +1521 -0
  125. package/styles/fabric-dark-lite.scss +14 -0
  126. package/styles/fabric-dark.css +213 -211
  127. package/styles/fabric-dark.scss +5 -1
  128. package/styles/fabric-lite.css +1531 -0
  129. package/styles/fabric-lite.scss +14 -0
  130. package/styles/fabric.css +214 -212
  131. package/styles/fabric.scss +5 -1
  132. package/styles/fluent-dark-lite.css +1546 -0
  133. package/styles/fluent-dark-lite.scss +14 -0
  134. package/styles/fluent-dark.css +221 -219
  135. package/styles/fluent-dark.scss +5 -1
  136. package/styles/fluent-lite.css +1546 -0
  137. package/styles/fluent-lite.scss +14 -0
  138. package/styles/fluent.css +221 -219
  139. package/styles/fluent.scss +5 -1
  140. package/styles/fluent2-lite.css +1545 -0
  141. package/styles/fluent2-lite.scss +14 -0
  142. package/styles/fluent2.css +225 -219
  143. package/styles/fluent2.scss +5 -1
  144. package/styles/highcontrast-light-lite.css +1458 -0
  145. package/styles/highcontrast-light-lite.scss +13 -0
  146. package/styles/highcontrast-light.css +213 -211
  147. package/styles/highcontrast-light.scss +5 -1
  148. package/styles/highcontrast-lite.css +1530 -0
  149. package/styles/highcontrast-lite.scss +14 -0
  150. package/styles/highcontrast.css +214 -212
  151. package/styles/highcontrast.scss +5 -1
  152. package/styles/material-dark-lite.css +1519 -0
  153. package/styles/material-dark-lite.scss +14 -0
  154. package/styles/material-dark.css +213 -211
  155. package/styles/material-dark.scss +5 -1
  156. package/styles/material-lite.css +1521 -0
  157. package/styles/material-lite.scss +14 -0
  158. package/styles/material.css +213 -211
  159. package/styles/material.scss +5 -1
  160. package/styles/material3-dark-lite.css +1536 -0
  161. package/styles/material3-dark-lite.scss +14 -0
  162. package/styles/material3-dark.css +213 -211
  163. package/styles/material3-dark.scss +5 -1
  164. package/styles/material3-lite.css +1538 -0
  165. package/styles/material3-lite.scss +14 -0
  166. package/styles/material3.css +213 -211
  167. package/styles/material3.scss +5 -1
  168. package/styles/splitter/_bigger.scss +78 -0
  169. package/styles/splitter/_layout.scss +0 -58
  170. package/styles/splitter/bootstrap-dark.css +40 -41
  171. package/styles/splitter/bootstrap-dark.scss +1 -0
  172. package/styles/splitter/bootstrap.css +40 -41
  173. package/styles/splitter/bootstrap.scss +1 -0
  174. package/styles/splitter/bootstrap4.css +40 -41
  175. package/styles/splitter/bootstrap4.scss +1 -0
  176. package/styles/splitter/bootstrap5-dark.css +40 -41
  177. package/styles/splitter/bootstrap5-dark.scss +1 -0
  178. package/styles/splitter/bootstrap5.3.css +547 -0
  179. package/styles/splitter/bootstrap5.3.scss +5 -0
  180. package/styles/splitter/bootstrap5.css +40 -41
  181. package/styles/splitter/bootstrap5.scss +1 -0
  182. package/styles/splitter/fabric-dark.css +40 -41
  183. package/styles/splitter/fabric-dark.scss +1 -0
  184. package/styles/splitter/fabric.css +40 -41
  185. package/styles/splitter/fabric.scss +1 -0
  186. package/styles/splitter/fluent-dark.css +40 -41
  187. package/styles/splitter/fluent-dark.scss +1 -0
  188. package/styles/splitter/fluent.css +40 -41
  189. package/styles/splitter/fluent.scss +1 -0
  190. package/styles/splitter/fluent2.css +40 -41
  191. package/styles/splitter/fluent2.scss +1 -0
  192. package/styles/splitter/highcontrast-light.css +40 -41
  193. package/styles/splitter/highcontrast-light.scss +1 -0
  194. package/styles/splitter/highcontrast.css +40 -41
  195. package/styles/splitter/highcontrast.scss +1 -0
  196. package/styles/splitter/icons/_bds.scss +0 -18
  197. package/styles/splitter/icons/_bootstrap-dark.scss +0 -18
  198. package/styles/splitter/icons/_bootstrap.scss +0 -18
  199. package/styles/splitter/icons/_bootstrap4.scss +0 -18
  200. package/styles/splitter/icons/_bootstrap5.3.scss +0 -18
  201. package/styles/splitter/icons/_bootstrap5.scss +0 -18
  202. package/styles/splitter/icons/_fabric-dark.scss +0 -18
  203. package/styles/splitter/icons/_fabric.scss +0 -18
  204. package/styles/splitter/icons/_fluent.scss +0 -18
  205. package/styles/splitter/icons/_fluent2.scss +0 -18
  206. package/styles/splitter/icons/_fusionnew.scss +0 -18
  207. package/styles/splitter/icons/_highcontrast-light.scss +0 -18
  208. package/styles/splitter/icons/_highcontrast.scss +0 -18
  209. package/styles/splitter/icons/_material-dark.scss +0 -18
  210. package/styles/splitter/icons/_material.scss +0 -18
  211. package/styles/splitter/icons/_material3.scss +0 -18
  212. package/styles/splitter/icons/_tailwind.scss +0 -18
  213. package/styles/splitter/material-dark.css +40 -41
  214. package/styles/splitter/material-dark.scss +1 -0
  215. package/styles/splitter/material.css +40 -41
  216. package/styles/splitter/material.scss +1 -0
  217. package/styles/splitter/material3-dark.css +40 -41
  218. package/styles/splitter/material3-dark.scss +1 -0
  219. package/styles/splitter/material3.css +40 -41
  220. package/styles/splitter/material3.scss +1 -0
  221. package/styles/splitter/tailwind-dark.css +40 -41
  222. package/styles/splitter/tailwind-dark.scss +1 -0
  223. package/styles/splitter/tailwind.css +40 -41
  224. package/styles/splitter/tailwind.scss +1 -0
  225. package/styles/tailwind-dark-lite.css +1546 -0
  226. package/styles/tailwind-dark-lite.scss +14 -0
  227. package/styles/tailwind-dark.css +220 -217
  228. package/styles/tailwind-dark.scss +5 -1
  229. package/styles/tailwind-lite.css +1546 -0
  230. package/styles/tailwind-lite.scss +14 -0
  231. package/styles/tailwind.css +220 -217
  232. package/styles/tailwind.scss +5 -1
  233. package/styles/timeline/_bigger.scss +48 -0
  234. package/styles/timeline/_layout.scss +6 -42
  235. package/styles/timeline/_theme.scss +13 -1
  236. package/styles/timeline/bootstrap-dark.css +24 -23
  237. package/styles/timeline/bootstrap-dark.scss +1 -0
  238. package/styles/timeline/bootstrap.css +24 -23
  239. package/styles/timeline/bootstrap.scss +1 -0
  240. package/styles/timeline/bootstrap4.css +24 -23
  241. package/styles/timeline/bootstrap4.scss +1 -0
  242. package/styles/timeline/bootstrap5-dark.css +24 -23
  243. package/styles/timeline/bootstrap5-dark.scss +1 -0
  244. package/styles/timeline/bootstrap5.3.css +303 -0
  245. package/styles/timeline/bootstrap5.3.scss +4 -0
  246. package/styles/timeline/bootstrap5.css +24 -23
  247. package/styles/timeline/bootstrap5.scss +1 -0
  248. package/styles/timeline/fabric-dark.css +24 -23
  249. package/styles/timeline/fabric-dark.scss +1 -0
  250. package/styles/timeline/fabric.css +24 -23
  251. package/styles/timeline/fabric.scss +1 -0
  252. package/styles/timeline/fluent-dark.css +24 -23
  253. package/styles/timeline/fluent-dark.scss +1 -0
  254. package/styles/timeline/fluent.css +24 -23
  255. package/styles/timeline/fluent.scss +1 -0
  256. package/styles/timeline/fluent2.css +29 -24
  257. package/styles/timeline/fluent2.scss +1 -0
  258. package/styles/timeline/highcontrast-light.css +24 -23
  259. package/styles/timeline/highcontrast-light.scss +1 -0
  260. package/styles/timeline/highcontrast.css +24 -23
  261. package/styles/timeline/highcontrast.scss +1 -0
  262. package/styles/timeline/material-dark.css +24 -23
  263. package/styles/timeline/material-dark.scss +1 -0
  264. package/styles/timeline/material.css +24 -23
  265. package/styles/timeline/material.scss +1 -0
  266. package/styles/timeline/material3-dark.css +24 -23
  267. package/styles/timeline/material3-dark.scss +1 -0
  268. package/styles/timeline/material3.css +24 -23
  269. package/styles/timeline/material3.scss +1 -0
  270. package/styles/timeline/tailwind-dark.css +24 -23
  271. package/styles/timeline/tailwind-dark.scss +1 -0
  272. package/styles/timeline/tailwind.css +24 -23
  273. package/styles/timeline/tailwind.scss +1 -0
  274. package/hotfix/26.1.35_Vol2.txt +0 -1
@@ -234,6 +234,29 @@
234
234
  width: auto;
235
235
  }
236
236
 
237
+ .e-timeline .e-dot {
238
+ background-color: #676767;
239
+ border-color: #676767;
240
+ color: #f0f0f0;
241
+ outline-color: #393939;
242
+ }
243
+ .e-timeline.e-outline .e-dot {
244
+ background-color: #393939;
245
+ }
246
+ .e-timeline .e-timeline-item.e-connector::after {
247
+ border-color: #676767;
248
+ }
249
+ .e-timeline .e-content {
250
+ color: #f0f0f0;
251
+ }
252
+ .e-timeline .e-opposite-content {
253
+ color: #f0f0f0;
254
+ }
255
+ .e-timeline .e-item-disabled .e-content,
256
+ .e-timeline .e-item-disabled .e-opposite-content {
257
+ color: #767676;
258
+ }
259
+
237
260
  .e-bigger.e-timeline [class^="e-dot "]::before,
238
261
  .e-bigger .e-timeline [class^="e-dot "]::before {
239
262
  min-width: 40px;
@@ -272,27 +295,5 @@
272
295
  .e-bigger.e-timeline .e-content,
273
296
  .e-bigger .e-timeline .e-content {
274
297
  font-size: 16px;
275
- }
276
-
277
- .e-timeline .e-dot {
278
- background-color: #676767;
279
- border-color: #676767;
280
- color: #f0f0f0;
281
- outline-color: #393939;
282
- }
283
- .e-timeline.e-outline .e-dot {
284
- background-color: #393939;
285
- }
286
- .e-timeline .e-timeline-item.e-connector::after {
287
- border-color: #676767;
288
- }
289
- .e-timeline .e-content {
290
- color: #f0f0f0;
291
- }
292
- .e-timeline .e-opposite-content {
293
- color: #f0f0f0;
294
- }
295
- .e-timeline .e-item-disabled .e-content,
296
- .e-timeline .e-item-disabled .e-opposite-content {
297
- color: #767676;
298
+ font-weight: 500;
298
299
  }
@@ -1,3 +1,4 @@
1
1
  @import 'ej2-base/styles/definition/bootstrap-dark.scss';
2
2
  @import 'bootstrap-dark-definition.scss';
3
3
  @import 'all.scss';
4
+ @import 'bigger.scss';
@@ -234,6 +234,29 @@
234
234
  width: auto;
235
235
  }
236
236
 
237
+ .e-timeline .e-dot {
238
+ background-color: #e6e6e6;
239
+ border-color: #e6e6e6;
240
+ color: #333;
241
+ outline-color: #fff;
242
+ }
243
+ .e-timeline.e-outline .e-dot {
244
+ background-color: #fff;
245
+ }
246
+ .e-timeline .e-timeline-item.e-connector::after {
247
+ border-color: #e6e6e6;
248
+ }
249
+ .e-timeline .e-content {
250
+ color: #333;
251
+ }
252
+ .e-timeline .e-opposite-content {
253
+ color: #333;
254
+ }
255
+ .e-timeline .e-item-disabled .e-content,
256
+ .e-timeline .e-item-disabled .e-opposite-content {
257
+ color: #adadad;
258
+ }
259
+
237
260
  .e-bigger.e-timeline [class^="e-dot "]::before,
238
261
  .e-bigger .e-timeline [class^="e-dot "]::before {
239
262
  min-width: 40px;
@@ -272,27 +295,5 @@
272
295
  .e-bigger.e-timeline .e-content,
273
296
  .e-bigger .e-timeline .e-content {
274
297
  font-size: 16px;
275
- }
276
-
277
- .e-timeline .e-dot {
278
- background-color: #e6e6e6;
279
- border-color: #e6e6e6;
280
- color: #333;
281
- outline-color: #fff;
282
- }
283
- .e-timeline.e-outline .e-dot {
284
- background-color: #fff;
285
- }
286
- .e-timeline .e-timeline-item.e-connector::after {
287
- border-color: #e6e6e6;
288
- }
289
- .e-timeline .e-content {
290
- color: #333;
291
- }
292
- .e-timeline .e-opposite-content {
293
- color: #333;
294
- }
295
- .e-timeline .e-item-disabled .e-content,
296
- .e-timeline .e-item-disabled .e-opposite-content {
297
- color: #adadad;
298
+ font-weight: 500;
298
299
  }
@@ -1,3 +1,4 @@
1
1
  @import 'ej2-base/styles/definition/bootstrap.scss';
2
2
  @import 'bootstrap-definition.scss';
3
3
  @import 'all.scss';
4
+ @import 'bigger.scss';
@@ -234,6 +234,29 @@
234
234
  width: auto;
235
235
  }
236
236
 
237
+ .e-timeline .e-dot {
238
+ background-color: #dee2e6;
239
+ border-color: #dee2e6;
240
+ color: #495057;
241
+ outline-color: #fff;
242
+ }
243
+ .e-timeline.e-outline .e-dot {
244
+ background-color: #fff;
245
+ }
246
+ .e-timeline .e-timeline-item.e-connector::after {
247
+ border-color: #dee2e6;
248
+ }
249
+ .e-timeline .e-content {
250
+ color: #212529;
251
+ }
252
+ .e-timeline .e-opposite-content {
253
+ color: #212529;
254
+ }
255
+ .e-timeline .e-item-disabled .e-content,
256
+ .e-timeline .e-item-disabled .e-opposite-content {
257
+ color: #adb5bd;
258
+ }
259
+
237
260
  .e-bigger.e-timeline [class^="e-dot "]::before,
238
261
  .e-bigger .e-timeline [class^="e-dot "]::before {
239
262
  min-width: 40px;
@@ -272,27 +295,5 @@
272
295
  .e-bigger.e-timeline .e-content,
273
296
  .e-bigger .e-timeline .e-content {
274
297
  font-size: 16px;
275
- }
276
-
277
- .e-timeline .e-dot {
278
- background-color: #dee2e6;
279
- border-color: #dee2e6;
280
- color: #495057;
281
- outline-color: #fff;
282
- }
283
- .e-timeline.e-outline .e-dot {
284
- background-color: #fff;
285
- }
286
- .e-timeline .e-timeline-item.e-connector::after {
287
- border-color: #dee2e6;
288
- }
289
- .e-timeline .e-content {
290
- color: #212529;
291
- }
292
- .e-timeline .e-opposite-content {
293
- color: #212529;
294
- }
295
- .e-timeline .e-item-disabled .e-content,
296
- .e-timeline .e-item-disabled .e-opposite-content {
297
- color: #adb5bd;
298
+ font-weight: 500;
298
299
  }
@@ -1,3 +1,4 @@
1
1
  @import 'ej2-base/styles/definition/bootstrap4.scss';
2
2
  @import 'bootstrap4-definition.scss';
3
3
  @import 'all.scss';
4
+ @import 'bigger.scss';
@@ -234,6 +234,29 @@
234
234
  width: auto;
235
235
  }
236
236
 
237
+ .e-timeline .e-dot {
238
+ background-color: #444c54;
239
+ border-color: #444c54;
240
+ color: #fff;
241
+ outline-color: #212529;
242
+ }
243
+ .e-timeline.e-outline .e-dot {
244
+ background-color: #212529;
245
+ }
246
+ .e-timeline .e-timeline-item.e-connector::after {
247
+ border-color: #444c54;
248
+ }
249
+ .e-timeline .e-content {
250
+ color: #e9ecef;
251
+ }
252
+ .e-timeline .e-opposite-content {
253
+ color: #ced4da;
254
+ }
255
+ .e-timeline .e-item-disabled .e-content,
256
+ .e-timeline .e-item-disabled .e-opposite-content {
257
+ color: #6c757d;
258
+ }
259
+
237
260
  .e-bigger.e-timeline [class^="e-dot "]::before,
238
261
  .e-bigger .e-timeline [class^="e-dot "]::before {
239
262
  min-width: 40px;
@@ -272,27 +295,5 @@
272
295
  .e-bigger.e-timeline .e-content,
273
296
  .e-bigger .e-timeline .e-content {
274
297
  font-size: 16px;
275
- }
276
-
277
- .e-timeline .e-dot {
278
- background-color: #444c54;
279
- border-color: #444c54;
280
- color: #fff;
281
- outline-color: #212529;
282
- }
283
- .e-timeline.e-outline .e-dot {
284
- background-color: #212529;
285
- }
286
- .e-timeline .e-timeline-item.e-connector::after {
287
- border-color: #444c54;
288
- }
289
- .e-timeline .e-content {
290
- color: #e9ecef;
291
- }
292
- .e-timeline .e-opposite-content {
293
- color: #ced4da;
294
- }
295
- .e-timeline .e-item-disabled .e-content,
296
- .e-timeline .e-item-disabled .e-opposite-content {
297
- color: #6c757d;
298
+ font-weight: 500;
298
299
  }
@@ -1,3 +1,4 @@
1
1
  @import 'ej2-base/styles/definition/bootstrap5-dark.scss';
2
2
  @import 'bootstrap5-dark-definition.scss';
3
3
  @import 'all.scss';
4
+ @import 'bigger.scss';
@@ -0,0 +1,303 @@
1
+
2
+
3
+
4
+
5
+ .e-timeline {
6
+ --dot-size: 16px;
7
+ --dot-outer-space: 0;
8
+ --dot-border: 1px;
9
+ --connector-size: 1px;
10
+ --dot-radius: 50%;
11
+ height: inherit;
12
+ width: 100%;
13
+ }
14
+ .e-timeline [class^="e-dot "]::before,
15
+ .e-timeline .e-dot-item,
16
+ .e-timeline .e-dot {
17
+ display: -webkit-box;
18
+ display: -ms-flexbox;
19
+ display: flex;
20
+ -webkit-box-align: center;
21
+ -ms-flex-align: center;
22
+ align-items: center;
23
+ -webkit-box-pack: center;
24
+ -ms-flex-pack: center;
25
+ justify-content: center;
26
+ }
27
+ .e-timeline [class^="e-dot "]::before {
28
+ min-width: 32px;
29
+ min-height: 32px;
30
+ border-radius: var(--dot-radius);
31
+ }
32
+ .e-timeline .e-timeline-items {
33
+ display: -webkit-inline-box;
34
+ display: -ms-inline-flexbox;
35
+ display: inline-flex;
36
+ -webkit-box-orient: vertical;
37
+ -webkit-box-direction: normal;
38
+ -ms-flex-direction: column;
39
+ flex-direction: column;
40
+ list-style: none;
41
+ -ms-flex-wrap: nowrap;
42
+ flex-wrap: nowrap;
43
+ padding: 0;
44
+ width: inherit;
45
+ height: inherit;
46
+ }
47
+ .e-timeline .e-timeline-item {
48
+ display: -webkit-box;
49
+ display: -ms-flexbox;
50
+ display: flex;
51
+ -webkit-box-orient: horizontal;
52
+ -webkit-box-direction: normal;
53
+ -ms-flex-direction: row;
54
+ flex-direction: row;
55
+ position: relative;
56
+ -webkit-box-align: start;
57
+ -ms-flex-align: start;
58
+ align-items: flex-start;
59
+ width: inherit;
60
+ height: inherit;
61
+ }
62
+ .e-timeline .e-timeline-item.e-connector::after {
63
+ top: 0;
64
+ bottom: 0;
65
+ left: calc(50% - var(--connector-size));
66
+ right: auto;
67
+ content: "";
68
+ position: absolute;
69
+ z-index: 999;
70
+ border-width: var(--connector-size);
71
+ border-style: solid;
72
+ }
73
+ .e-timeline .e-timeline-item.e-connector.e-item-template::after {
74
+ content: unset;
75
+ }
76
+ .e-timeline .e-dot-item {
77
+ position: relative;
78
+ -webkit-box-flex: 0;
79
+ -ms-flex: 0 1 calc(var(--dot-size) * 3);
80
+ flex: 0 1 calc(var(--dot-size) * 3);
81
+ z-index: 1000;
82
+ }
83
+ .e-timeline .e-dot {
84
+ min-width: var(--dot-size);
85
+ min-height: var(--dot-size);
86
+ border-radius: var(--dot-radius);
87
+ outline: var(--dot-outer-space) solid;
88
+ border: var(--dot-border) solid;
89
+ font-size: 16px;
90
+ background-size: cover;
91
+ background-position: center;
92
+ background-repeat: no-repeat;
93
+ }
94
+ .e-timeline .e-opposite-content,
95
+ .e-timeline .e-content {
96
+ -webkit-box-flex: 1;
97
+ -ms-flex: 1 1 50%;
98
+ flex: 1 1 50%;
99
+ }
100
+ .e-timeline .e-opposite-content {
101
+ font-size: 12px;
102
+ }
103
+ .e-timeline .e-content {
104
+ text-align: left;
105
+ font-size: 14px;
106
+ font-weight: 600;
107
+ }
108
+ .e-timeline .e-timeline-item:first-child::after {
109
+ top: 0;
110
+ }
111
+ .e-timeline .e-timeline-item:last-child::after {
112
+ bottom: calc(var(--dot-size) * 2);
113
+ }
114
+ .e-timeline.e-vertical.e-align-before .e-timeline-item, .e-timeline.e-vertical.e-align-alternate .e-timeline-item:nth-of-type(even), .e-timeline.e-vertical.e-align-alternatereverse .e-timeline-item:nth-of-type(odd) {
115
+ -webkit-box-orient: horizontal;
116
+ -webkit-box-direction: reverse;
117
+ -ms-flex-direction: row-reverse;
118
+ flex-direction: row-reverse;
119
+ }
120
+ .e-timeline.e-vertical.e-timeline-reverse .e-timeline-items {
121
+ -webkit-box-orient: vertical;
122
+ -webkit-box-direction: reverse;
123
+ -ms-flex-direction: column-reverse;
124
+ flex-direction: column-reverse;
125
+ }
126
+ .e-timeline.e-vertical.e-align-before .e-timeline-items .e-opposite-content, .e-timeline.e-vertical.e-align-after .e-timeline-items .e-content {
127
+ text-align: left;
128
+ }
129
+ .e-timeline.e-vertical .e-timeline-item.e-connector:last-child::after {
130
+ content: unset;
131
+ }
132
+ .e-timeline.e-vertical.e-align-before.e-opposite-content-only .e-connector::after, .e-timeline.e-vertical.e-align-after.e-rtl.e-opposite-content-only .e-connector::after, .e-timeline.e-vertical.e-align-before.e-rtl.e-content-only .e-connector::after, .e-timeline.e-vertical.e-align-after.e-content-only .e-connector::after {
133
+ left: calc(var(--dot-size) * 3 / 2 - var(--connector-size));
134
+ right: auto;
135
+ }
136
+ .e-timeline.e-vertical.e-align-before.e-content-only .e-connector::after, .e-timeline.e-vertical.e-align-before.e-rtl.e-opposite-content-only .e-connector::after, .e-timeline.e-vertical.e-align-after.e-opposite-content-only .e-connector::after, .e-timeline.e-vertical.e-align-after.e-rtl.e-content-only .e-connector::after {
137
+ right: calc(var(--dot-size) * 3 / 2 - var(--connector-size));
138
+ left: auto;
139
+ }
140
+ .e-timeline.e-vertical.e-align-after.e-opposite-content-only .e-content, .e-timeline.e-vertical.e-align-after.e-content-only .e-opposite-content, .e-timeline.e-vertical.e-align-before.e-opposite-content-only .e-content, .e-timeline.e-vertical.e-align-before.e-content-only .e-opposite-content {
141
+ -webkit-box-flex: 0;
142
+ -ms-flex: 0;
143
+ flex: 0;
144
+ }
145
+ .e-timeline.e-vertical.e-timeline-reverse .e-timeline-item.e-connector:first-child::after {
146
+ content: unset;
147
+ }
148
+ .e-timeline.e-vertical.e-timeline-reverse .e-timeline-item.e-connector:last-child::after {
149
+ content: "";
150
+ bottom: 0;
151
+ }
152
+ .e-timeline.e-vertical.e-align-after .e-opposite-content, .e-timeline.e-vertical.e-align-before .e-content, .e-timeline.e-vertical.e-rtl.e-align-after .e-content, .e-timeline.e-vertical.e-rtl.e-align-alternate .e-timeline-item:nth-of-type(odd) .e-content, .e-timeline.e-vertical.e-rtl.e-align-alternatereverse .e-timeline-item:nth-of-type(even) .e-content, .e-timeline.e-vertical.e-align-alternate .e-timeline-item:nth-of-type(even) .e-content, .e-timeline.e-vertical.e-align-alternatereverse .e-timeline-item:nth-of-type(odd) .e-content, .e-timeline.e-vertical.e-rtl.e-align-alternate .e-timeline-item:nth-of-type(even) .e-opposite-content, .e-timeline.e-vertical.e-rtl.e-align-alternatereverse .e-timeline-item:nth-of-type(odd) .e-opposite-content, .e-timeline.e-vertical.e-rtl.e-align-before .e-opposite-content, .e-timeline.e-vertical.e-align-alternate .e-opposite-content, .e-timeline.e-vertical.e-align-alternatereverse .e-opposite-content {
153
+ text-align: right;
154
+ }
155
+ .e-timeline.e-vertical.e-align-before .e-opposite-content, .e-timeline.e-vertical.e-align-after .e-content, .e-timeline.e-vertical.e-rtl.e-align-after .e-opposite-content, .e-timeline.e-vertical.e-align-alternate .e-timeline-item:nth-of-type(odd) .e-content, .e-timeline.e-vertical.e-align-alternatereverse .e-timeline-item:nth-of-type(even) .e-content, .e-timeline.e-vertical.e-align-alternate .e-timeline-item:nth-of-type(even) .e-opposite-content, .e-timeline.e-vertical.e-align-alternatereverse .e-timeline-item:nth-of-type(odd) .e-opposite-content, .e-timeline.e-vertical.e-rtl.e-align-alternate .e-timeline-item:nth-of-type(even) .e-content, .e-timeline.e-vertical.e-rtl.e-align-alternatereverse .e-timeline-item:nth-of-type(odd) .e-content, .e-timeline.e-vertical.e-rtl.e-align-before .e-content, .e-timeline.e-vertical.e-rtl.e-align-alternate .e-opposite-content, .e-timeline.e-vertical.e-rtl.e-align-alternatereverse .e-opposite-content {
156
+ text-align: left;
157
+ }
158
+ .e-timeline.e-vertical .e-dot-item {
159
+ width: calc(var(--dot-size) * 2);
160
+ }
161
+ .e-timeline.e-horizontal .e-timeline-items {
162
+ display: -webkit-inline-box;
163
+ display: -ms-inline-flexbox;
164
+ display: inline-flex;
165
+ -webkit-box-orient: horizontal;
166
+ -webkit-box-direction: normal;
167
+ -ms-flex-direction: row;
168
+ flex-direction: row;
169
+ }
170
+ .e-timeline.e-horizontal .e-timeline-item {
171
+ height: auto;
172
+ -webkit-box-orient: vertical;
173
+ -webkit-box-direction: normal;
174
+ -ms-flex-direction: column;
175
+ flex-direction: column;
176
+ -webkit-box-align: center;
177
+ -ms-flex-align: center;
178
+ align-items: center;
179
+ }
180
+ .e-timeline.e-horizontal.e-timeline-reverse.e-rtl .e-timeline-item.e-connector::after {
181
+ left: calc(50% - var(--connector-size));
182
+ right: auto;
183
+ }
184
+ .e-timeline.e-horizontal.e-rtl .e-timeline-item.e-connector::after, .e-timeline.e-horizontal.e-timeline-reverse .e-timeline-item.e-connector::after {
185
+ right: calc(50% - var(--connector-size));
186
+ left: auto;
187
+ }
188
+ .e-timeline.e-horizontal .e-dot-item {
189
+ margin: calc(var(--dot-size) * 2 / 2) 0;
190
+ }
191
+ .e-timeline.e-horizontal .e-opposite-content,
192
+ .e-timeline.e-horizontal .e-content {
193
+ display: -webkit-box;
194
+ display: -ms-flexbox;
195
+ display: flex;
196
+ }
197
+ .e-timeline.e-horizontal.e-align-alternate .e-timeline-item:nth-of-type(even) .e-content, .e-timeline.e-horizontal.e-align-alternate .e-timeline-item:nth-of-type(odd) .e-opposite-content, .e-timeline.e-horizontal.e-align-alternatereverse .e-timeline-item:nth-of-type(odd) .e-content, .e-timeline.e-horizontal.e-align-alternatereverse .e-timeline-item:nth-of-type(even) .e-opposite-content, .e-timeline.e-horizontal.e-align-before .e-content {
198
+ -webkit-box-align: end;
199
+ -ms-flex-align: end;
200
+ align-items: flex-end;
201
+ }
202
+ .e-timeline.e-horizontal.e-align-alternate .e-timeline-item:nth-of-type(odd) .e-content, .e-timeline.e-horizontal.e-align-alternate .e-timeline-item:nth-of-type(even) .e-opposite-content, .e-timeline.e-horizontal.e-align-alternatereverse .e-timeline-item:nth-of-type(even) .e-content, .e-timeline.e-horizontal.e-align-alternatereverse .e-timeline-item:nth-of-type(odd) .e-opposite-content, .e-timeline.e-horizontal.e-align-before .e-opposite-content {
203
+ -webkit-box-align: start;
204
+ -ms-flex-align: start;
205
+ align-items: flex-start;
206
+ }
207
+ .e-timeline.e-horizontal.e-align-before .e-timeline-item, .e-timeline.e-horizontal.e-align-alternate .e-timeline-item:nth-of-type(even), .e-timeline.e-horizontal.e-align-alternatereverse .e-timeline-item:nth-of-type(odd) {
208
+ -webkit-box-orient: vertical;
209
+ -webkit-box-direction: reverse;
210
+ -ms-flex-direction: column-reverse;
211
+ flex-direction: column-reverse;
212
+ }
213
+ .e-timeline.e-horizontal.e-timeline-reverse .e-timeline-items {
214
+ -webkit-box-orient: horizontal;
215
+ -webkit-box-direction: reverse;
216
+ -ms-flex-direction: row-reverse;
217
+ flex-direction: row-reverse;
218
+ }
219
+ .e-timeline.e-horizontal .e-timeline-item::after {
220
+ width: 100%;
221
+ height: 0;
222
+ top: calc(50% - var(--connector-size));
223
+ }
224
+ .e-timeline.e-horizontal .e-opposite-content {
225
+ display: -webkit-box;
226
+ display: -ms-flexbox;
227
+ display: flex;
228
+ -webkit-box-align: end;
229
+ -ms-flex-align: end;
230
+ align-items: flex-end;
231
+ text-align: left;
232
+ padding: 0;
233
+ }
234
+ .e-timeline.e-horizontal .e-content {
235
+ padding: 0;
236
+ }
237
+ .e-timeline.e-horizontal .e-timeline-item:last-child::after {
238
+ width: auto;
239
+ }
240
+
241
+ .e-timeline .e-dot {
242
+ background-color: var(--color-sf-border-light);
243
+ border-color: var(--color-sf-border-light);
244
+ color: var(--color-sf-content-text-color);
245
+ outline-color: var(--color-sf-content-bg-color);
246
+ }
247
+ .e-timeline.e-outline .e-dot {
248
+ background-color: var(--color-sf-content-bg-color);
249
+ }
250
+ .e-timeline .e-timeline-item.e-connector::after {
251
+ border-color: var(--color-sf-border-light);
252
+ }
253
+ .e-timeline .e-content {
254
+ color: var(--color-sf-content-text-color-alt1);
255
+ }
256
+ .e-timeline .e-opposite-content {
257
+ color: var(--color-sf-content-text-color-alt2);
258
+ }
259
+ .e-timeline .e-item-disabled .e-content,
260
+ .e-timeline .e-item-disabled .e-opposite-content {
261
+ color: var(--color-sf-content-text-color-disabled);
262
+ }
263
+
264
+ .e-bigger.e-timeline [class^="e-dot "]::before,
265
+ .e-bigger .e-timeline [class^="e-dot "]::before {
266
+ min-width: 40px;
267
+ min-height: 40px;
268
+ font-size: 18px;
269
+ }
270
+ .e-bigger.e-timeline .e-dot-item,
271
+ .e-bigger .e-timeline .e-dot-item {
272
+ -webkit-box-flex: 0;
273
+ -ms-flex: 0 1 calc(var(--dot-size) * 4);
274
+ flex: 0 1 calc(var(--dot-size) * 4);
275
+ }
276
+ .e-bigger.e-timeline.e-vertical.e-align-before.e-opposite-content-only .e-connector::after, .e-bigger.e-timeline.e-vertical.e-align-after.e-rtl.e-opposite-content-only .e-connector::after, .e-bigger.e-timeline.e-vertical.e-align-before.e-rtl.e-content-only .e-connector::after, .e-bigger.e-timeline.e-vertical.e-align-after.e-content-only .e-connector::after,
277
+ .e-bigger .e-timeline.e-vertical.e-align-before.e-opposite-content-only .e-connector::after,
278
+ .e-bigger .e-timeline.e-vertical.e-align-after.e-rtl.e-opposite-content-only .e-connector::after,
279
+ .e-bigger .e-timeline.e-vertical.e-align-before.e-rtl.e-content-only .e-connector::after,
280
+ .e-bigger .e-timeline.e-vertical.e-align-after.e-content-only .e-connector::after {
281
+ left: calc(var(--dot-size) * 4 / 2 - var(--connector-size));
282
+ }
283
+ .e-bigger.e-timeline.e-vertical.e-align-before.e-content-only .e-connector::after, .e-bigger.e-timeline.e-vertical.e-align-before.e-rtl.e-opposite-content-only .e-connector::after, .e-bigger.e-timeline.e-vertical.e-align-after.e-opposite-content-only .e-connector::after, .e-bigger.e-timeline.e-vertical.e-align-after.e-rtl.e-content-only .e-connector::after,
284
+ .e-bigger .e-timeline.e-vertical.e-align-before.e-content-only .e-connector::after,
285
+ .e-bigger .e-timeline.e-vertical.e-align-before.e-rtl.e-opposite-content-only .e-connector::after,
286
+ .e-bigger .e-timeline.e-vertical.e-align-after.e-opposite-content-only .e-connector::after,
287
+ .e-bigger .e-timeline.e-vertical.e-align-after.e-rtl.e-content-only .e-connector::after {
288
+ right: calc(var(--dot-size) * 4 / 2 - var(--connector-size));
289
+ }
290
+ .e-bigger.e-timeline .e-dot,
291
+ .e-bigger .e-timeline .e-dot {
292
+ min-width: 20px;
293
+ min-height: 20px;
294
+ }
295
+ .e-bigger.e-timeline .e-opposite-content,
296
+ .e-bigger .e-timeline .e-opposite-content {
297
+ font-size: 14px;
298
+ }
299
+ .e-bigger.e-timeline .e-content,
300
+ .e-bigger .e-timeline .e-content {
301
+ font-size: 16px;
302
+ font-weight: 600;
303
+ }
@@ -0,0 +1,4 @@
1
+ @import 'ej2-base/styles/definition/bootstrap5.3.scss';
2
+ @import 'bootstrap5.3-definition.scss';
3
+ @import 'all.scss';
4
+ @import 'bigger.scss';
@@ -234,6 +234,29 @@
234
234
  width: auto;
235
235
  }
236
236
 
237
+ .e-timeline .e-dot {
238
+ background-color: #dee2e6;
239
+ border-color: #dee2e6;
240
+ color: #212529;
241
+ outline-color: #fff;
242
+ }
243
+ .e-timeline.e-outline .e-dot {
244
+ background-color: #fff;
245
+ }
246
+ .e-timeline .e-timeline-item.e-connector::after {
247
+ border-color: #dee2e6;
248
+ }
249
+ .e-timeline .e-content {
250
+ color: #343a40;
251
+ }
252
+ .e-timeline .e-opposite-content {
253
+ color: #495057;
254
+ }
255
+ .e-timeline .e-item-disabled .e-content,
256
+ .e-timeline .e-item-disabled .e-opposite-content {
257
+ color: #adb5bd;
258
+ }
259
+
237
260
  .e-bigger.e-timeline [class^="e-dot "]::before,
238
261
  .e-bigger .e-timeline [class^="e-dot "]::before {
239
262
  min-width: 40px;
@@ -272,27 +295,5 @@
272
295
  .e-bigger.e-timeline .e-content,
273
296
  .e-bigger .e-timeline .e-content {
274
297
  font-size: 16px;
275
- }
276
-
277
- .e-timeline .e-dot {
278
- background-color: #dee2e6;
279
- border-color: #dee2e6;
280
- color: #212529;
281
- outline-color: #fff;
282
- }
283
- .e-timeline.e-outline .e-dot {
284
- background-color: #fff;
285
- }
286
- .e-timeline .e-timeline-item.e-connector::after {
287
- border-color: #dee2e6;
288
- }
289
- .e-timeline .e-content {
290
- color: #343a40;
291
- }
292
- .e-timeline .e-opposite-content {
293
- color: #495057;
294
- }
295
- .e-timeline .e-item-disabled .e-content,
296
- .e-timeline .e-item-disabled .e-opposite-content {
297
- color: #adb5bd;
298
+ font-weight: 500;
298
299
  }
@@ -1,3 +1,4 @@
1
1
  @import 'ej2-base/styles/definition/bootstrap5.scss';
2
2
  @import 'bootstrap5-definition.scss';
3
3
  @import 'all.scss';
4
+ @import 'bigger.scss';
@@ -234,6 +234,29 @@
234
234
  width: auto;
235
235
  }
236
236
 
237
+ .e-timeline .e-dot {
238
+ background-color: #6f6c6c;
239
+ border-color: #6f6c6c;
240
+ color: #dadada;
241
+ outline-color: #201f1f;
242
+ }
243
+ .e-timeline.e-outline .e-dot {
244
+ background-color: #201f1f;
245
+ }
246
+ .e-timeline .e-timeline-item.e-connector::after {
247
+ border-color: #6f6c6c;
248
+ }
249
+ .e-timeline .e-content {
250
+ color: #dadada;
251
+ }
252
+ .e-timeline .e-opposite-content {
253
+ color: #dadada;
254
+ }
255
+ .e-timeline .e-item-disabled .e-content,
256
+ .e-timeline .e-item-disabled .e-opposite-content {
257
+ color: #6f6c6c;
258
+ }
259
+
237
260
  .e-bigger.e-timeline [class^="e-dot "]::before,
238
261
  .e-bigger .e-timeline [class^="e-dot "]::before {
239
262
  min-width: 40px;
@@ -272,27 +295,5 @@
272
295
  .e-bigger.e-timeline .e-content,
273
296
  .e-bigger .e-timeline .e-content {
274
297
  font-size: 16px;
275
- }
276
-
277
- .e-timeline .e-dot {
278
- background-color: #6f6c6c;
279
- border-color: #6f6c6c;
280
- color: #dadada;
281
- outline-color: #201f1f;
282
- }
283
- .e-timeline.e-outline .e-dot {
284
- background-color: #201f1f;
285
- }
286
- .e-timeline .e-timeline-item.e-connector::after {
287
- border-color: #6f6c6c;
288
- }
289
- .e-timeline .e-content {
290
- color: #dadada;
291
- }
292
- .e-timeline .e-opposite-content {
293
- color: #dadada;
294
- }
295
- .e-timeline .e-item-disabled .e-content,
296
- .e-timeline .e-item-disabled .e-opposite-content {
297
- color: #6f6c6c;
298
+ font-weight: 500;
298
299
  }
@@ -1,3 +1,4 @@
1
1
  @import 'ej2-base/styles/definition/fabric-dark.scss';
2
2
  @import 'fabric-dark-definition.scss';
3
3
  @import 'all.scss';
4
+ @import 'bigger.scss';