@syncfusion/ej2-vue-layouts 25.2.3 → 26.1.35

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 (123) hide show
  1. package/dist/ej2-vue-layouts.umd.min.js +2 -2
  2. package/dist/ej2-vue-layouts.umd.min.js.map +1 -1
  3. package/dist/es6/ej2-vue-layouts.es2015.js +8 -14
  4. package/dist/es6/ej2-vue-layouts.es2015.js.map +1 -1
  5. package/dist/es6/ej2-vue-layouts.es5.js +8 -14
  6. package/dist/es6/ej2-vue-layouts.es5.js.map +1 -1
  7. package/package.json +9 -9
  8. package/styles/avatar/bootstrap-dark.css +48 -1
  9. package/styles/avatar/bootstrap.css +48 -1
  10. package/styles/avatar/bootstrap4.css +48 -1
  11. package/styles/avatar/bootstrap5-dark.css +63 -1
  12. package/styles/avatar/bootstrap5.css +63 -1
  13. package/styles/avatar/fabric-dark.css +48 -1
  14. package/styles/avatar/fabric.css +48 -1
  15. package/styles/avatar/fluent-dark.css +61 -1
  16. package/styles/avatar/fluent.css +61 -1
  17. package/styles/avatar/fluent2.css +1094 -0
  18. package/styles/avatar/fluent2.scss +1 -0
  19. package/styles/avatar/highcontrast-light.css +48 -1
  20. package/styles/avatar/highcontrast.css +48 -1
  21. package/styles/avatar/material-dark.css +48 -1
  22. package/styles/avatar/material.css +48 -1
  23. package/styles/avatar/material3-dark.css +171 -1
  24. package/styles/avatar/material3.css +283 -1
  25. package/styles/avatar/tailwind-dark.css +61 -1
  26. package/styles/avatar/tailwind.css +61 -1
  27. package/styles/bootstrap-dark.css +1752 -1
  28. package/styles/bootstrap.css +1753 -1
  29. package/styles/bootstrap4.css +1757 -1
  30. package/styles/bootstrap5-dark.css +1770 -1
  31. package/styles/bootstrap5.css +1770 -1
  32. package/styles/card/bootstrap-dark.css +556 -1
  33. package/styles/card/bootstrap.css +557 -1
  34. package/styles/card/bootstrap4.css +563 -1
  35. package/styles/card/bootstrap5-dark.css +556 -1
  36. package/styles/card/bootstrap5.css +556 -1
  37. package/styles/card/fabric-dark.css +556 -1
  38. package/styles/card/fabric.css +567 -1
  39. package/styles/card/fluent-dark.css +579 -1
  40. package/styles/card/fluent.css +579 -1
  41. package/styles/card/fluent2.css +1588 -0
  42. package/styles/card/fluent2.scss +1 -0
  43. package/styles/card/highcontrast-light.css +556 -1
  44. package/styles/card/highcontrast.css +568 -1
  45. package/styles/card/material-dark.css +556 -1
  46. package/styles/card/material.css +557 -1
  47. package/styles/card/material3-dark.css +667 -1
  48. package/styles/card/material3.css +779 -1
  49. package/styles/card/tailwind-dark.css +557 -1
  50. package/styles/card/tailwind.css +557 -1
  51. package/styles/dashboard-layout/bootstrap-dark.css +295 -1
  52. package/styles/dashboard-layout/bootstrap.css +295 -1
  53. package/styles/dashboard-layout/bootstrap4.css +295 -1
  54. package/styles/dashboard-layout/bootstrap5-dark.css +306 -1
  55. package/styles/dashboard-layout/bootstrap5.css +306 -1
  56. package/styles/dashboard-layout/fabric-dark.css +295 -1
  57. package/styles/dashboard-layout/fabric.css +295 -1
  58. package/styles/dashboard-layout/fluent-dark.css +300 -1
  59. package/styles/dashboard-layout/fluent.css +300 -1
  60. package/styles/dashboard-layout/fluent2.css +1336 -0
  61. package/styles/dashboard-layout/fluent2.scss +1 -0
  62. package/styles/dashboard-layout/highcontrast-light.css +232 -1
  63. package/styles/dashboard-layout/highcontrast.css +293 -1
  64. package/styles/dashboard-layout/material-dark.css +295 -1
  65. package/styles/dashboard-layout/material.css +295 -1
  66. package/styles/dashboard-layout/material3-dark.css +412 -1
  67. package/styles/dashboard-layout/material3.css +524 -1
  68. package/styles/dashboard-layout/tailwind-dark.css +319 -1
  69. package/styles/dashboard-layout/tailwind.css +319 -1
  70. package/styles/fabric-dark.css +1752 -1
  71. package/styles/fabric.css +1763 -1
  72. package/styles/fluent-dark.css +1785 -1
  73. package/styles/fluent.css +1785 -1
  74. package/styles/fluent2.css +6931 -0
  75. package/styles/fluent2.scss +5 -0
  76. package/styles/highcontrast-light.css +1689 -1
  77. package/styles/highcontrast.css +1762 -1
  78. package/styles/material-dark.css +1750 -1
  79. package/styles/material.css +1752 -1
  80. package/styles/material3-dark.css +2315 -1
  81. package/styles/material3.css +2875 -1
  82. package/styles/splitter/bootstrap-dark.css +552 -1
  83. package/styles/splitter/bootstrap.css +552 -1
  84. package/styles/splitter/bootstrap4.css +550 -1
  85. package/styles/splitter/bootstrap5-dark.css +544 -1
  86. package/styles/splitter/bootstrap5.css +544 -1
  87. package/styles/splitter/fabric-dark.css +552 -1
  88. package/styles/splitter/fabric.css +552 -1
  89. package/styles/splitter/fluent-dark.css +544 -1
  90. package/styles/splitter/fluent.css +544 -1
  91. package/styles/splitter/fluent2.css +1578 -0
  92. package/styles/splitter/fluent2.scss +1 -0
  93. package/styles/splitter/highcontrast-light.css +552 -1
  94. package/styles/splitter/highcontrast.css +552 -1
  95. package/styles/splitter/material-dark.css +550 -1
  96. package/styles/splitter/material.css +551 -1
  97. package/styles/splitter/material3-dark.css +654 -1
  98. package/styles/splitter/material3.css +766 -1
  99. package/styles/splitter/tailwind-dark.css +544 -1
  100. package/styles/splitter/tailwind.css +544 -1
  101. package/styles/tailwind-dark.css +1782 -1
  102. package/styles/tailwind.css +1782 -1
  103. package/styles/timeline/bootstrap-dark.css +298 -1
  104. package/styles/timeline/bootstrap.css +298 -1
  105. package/styles/timeline/bootstrap4.css +298 -1
  106. package/styles/timeline/bootstrap5-dark.css +298 -1
  107. package/styles/timeline/bootstrap5.css +298 -1
  108. package/styles/timeline/fabric-dark.css +298 -1
  109. package/styles/timeline/fabric.css +298 -1
  110. package/styles/timeline/fluent-dark.css +298 -1
  111. package/styles/timeline/fluent.css +298 -1
  112. package/styles/timeline/fluent2.css +1332 -0
  113. package/styles/timeline/fluent2.scss +1 -0
  114. package/styles/timeline/highcontrast-light.css +298 -1
  115. package/styles/timeline/highcontrast.css +298 -1
  116. package/styles/timeline/material-dark.css +298 -1
  117. package/styles/timeline/material.css +298 -1
  118. package/styles/timeline/material3-dark.css +408 -1
  119. package/styles/timeline/material3.css +520 -1
  120. package/styles/timeline/tailwind-dark.css +298 -1
  121. package/styles/timeline/tailwind.css +298 -1
  122. package/CHANGELOG.md +0 -591
  123. package/dist/global/ej2-vue-layouts.min.js +0 -10
@@ -1 +1,408 @@
1
- @import '@syncfusion/ej2-layouts/styles/timeline/material3-dark.css';
1
+ :root {
2
+ --color-sf-black: 0, 0, 0;
3
+ --color-sf-white: 255, 255, 255;
4
+ --color-sf-primary: 208, 188, 255;
5
+ --color-sf-primary-container: 79, 55, 139;
6
+ --color-sf-secondary: 204, 194, 220;
7
+ --color-sf-secondary-container: 74, 68, 88;
8
+ --color-sf-tertiary: 239, 184, 200;
9
+ --color-sf-tertiary-container: 99, 59, 72;
10
+ --color-sf-surface: 28, 27, 31;
11
+ --color-sf-surface-variant: 73, 69, 79;
12
+ --color-sf-background: var(--color-sf-surface);
13
+ --color-sf-on-primary: 55, 30, 115;
14
+ --color-sf-on-primary-container: 234, 221, 255;
15
+ --color-sf-on-secondary: 51, 45, 65;
16
+ --color-sf-on-secondary-container: 232, 222, 248;
17
+ --color-sf-on-tertiary: 73, 37, 50;
18
+ --color-sf-on-tertiary-containe: 255, 216, 228;
19
+ --color-sf-on-surface: 230, 225, 229;
20
+ --color-sf-on-surface-variant: 202, 196, 208;
21
+ --color-sf-on-background: 230, 225, 229;
22
+ --color-sf-outline: 147, 143, 153;
23
+ --color-sf-outline-variant: 68, 71, 70;
24
+ --color-sf-shadow: 0, 0, 0;
25
+ --color-sf-surface-tint-color: 208, 188, 255;
26
+ --color-sf-inverse-surface: 230, 225, 229;
27
+ --color-sf-inverse-on-surface: 49, 48, 51;
28
+ --color-sf-inverse-primary: 103, 80, 164;
29
+ --color-sf-scrim: 0, 0, 0;
30
+ --color-sf-error: 242, 184, 181;
31
+ --color-sf-error-container: 140, 29, 24;
32
+ --color-sf-on-error: 96, 20, 16;
33
+ --color-sf-on-error-container: 249, 222, 220;
34
+ --color-sf-success: 83, 202, 23;
35
+ --color-sf-success-container: 22, 62, 2;
36
+ --color-sf-on-success: 13, 39, 0;
37
+ --color-sf-on-success-container: 183, 250, 150;
38
+ --color-sf-info: 71, 172, 251;
39
+ --color-sf-info-container: 0, 67, 120;
40
+ --color-sf-on-info: 0, 51, 91;
41
+ --color-sf-on-info-container: 173, 219, 255;
42
+ --color-sf-warning: 245, 180, 130;
43
+ --color-sf-warning-container: 123, 65, 0;
44
+ --color-sf-on-warning: 99, 52, 0;
45
+ --color-sf-on-warning-container: 255, 220, 193;
46
+ --color-sf-spreadsheet-gridline: 231, 224, 236;
47
+ --color-sf-shadow-focus-ring1: 0 0 0 1px #000, 0 0 0 3px #fff;
48
+ --color-sf-success-text: 0, 0, 0;
49
+ --color-sf-warning-text: 0, 0, 0;
50
+ --color-sf-info-text: 0, 0, 0;
51
+ --color-sf-danger-text: 0, 0, 0;
52
+ --color-sf-diagram-palette-background: var(--color-sf-inverse-surface);
53
+ --color-sf-content-text-color-alt2: var(--color-sf-on-secondary);
54
+ }
55
+
56
+ :root {
57
+ --color-sf-black: 0, 0, 0;
58
+ --color-sf-white: 255, 255, 255;
59
+ --color-sf-primary: 208, 188, 255;
60
+ --color-sf-primary-container: 79, 55, 139;
61
+ --color-sf-secondary: 204, 194, 220;
62
+ --color-sf-secondary-container: 74, 68, 88;
63
+ --color-sf-tertiary: 239, 184, 200;
64
+ --color-sf-tertiary-container: 99, 59, 72;
65
+ --color-sf-surface: 28, 27, 31;
66
+ --color-sf-surface-variant: 73, 69, 79;
67
+ --color-sf-background: var(--color-sf-surface);
68
+ --color-sf-on-primary: 55, 30, 115;
69
+ --color-sf-on-primary-container: 234, 221, 255;
70
+ --color-sf-on-secondary: 51, 45, 65;
71
+ --color-sf-on-secondary-container: 232, 222, 248;
72
+ --color-sf-on-tertiary: 73, 37, 50;
73
+ --color-sf-on-tertiary-containe: 255, 216, 228;
74
+ --color-sf-on-surface: 230, 225, 229;
75
+ --color-sf-on-surface-variant: 202, 196, 208;
76
+ --color-sf-on-background: 230, 225, 229;
77
+ --color-sf-outline: 147, 143, 153;
78
+ --color-sf-outline-variant: 68, 71, 70;
79
+ --color-sf-shadow: 0, 0, 0;
80
+ --color-sf-surface-tint-color: 208, 188, 255;
81
+ --color-sf-inverse-surface: 230, 225, 229;
82
+ --color-sf-inverse-on-surface: 49, 48, 51;
83
+ --color-sf-inverse-primary: 103, 80, 164;
84
+ --color-sf-scrim: 0, 0, 0;
85
+ --color-sf-error: 242, 184, 181;
86
+ --color-sf-error-container: 140, 29, 24;
87
+ --color-sf-on-error: 96, 20, 16;
88
+ --color-sf-on-error-container: 249, 222, 220;
89
+ --color-sf-success: 83, 202, 23;
90
+ --color-sf-success-container: 22, 62, 2;
91
+ --color-sf-on-success: 13, 39, 0;
92
+ --color-sf-on-success-container: 183, 250, 150;
93
+ --color-sf-info: 71, 172, 251;
94
+ --color-sf-info-container: 0, 67, 120;
95
+ --color-sf-on-info: 0, 51, 91;
96
+ --color-sf-on-info-container: 173, 219, 255;
97
+ --color-sf-warning: 245, 180, 130;
98
+ --color-sf-warning-container: 123, 65, 0;
99
+ --color-sf-on-warning: 99, 52, 0;
100
+ --color-sf-on-warning-container: 255, 220, 193;
101
+ --color-sf-spreadsheet-gridline: 231, 224, 236;
102
+ --color-sf-shadow-focus-ring1: 0 0 0 1px #000, 0 0 0 3px #fff;
103
+ --color-sf-success-text: 0, 0, 0;
104
+ --color-sf-warning-text: 0, 0, 0;
105
+ --color-sf-info-text: 0, 0, 0;
106
+ --color-sf-danger-text: 0, 0, 0;
107
+ --color-sf-diagram-palette-background: var(--color-sf-inverse-surface);
108
+ --color-sf-content-text-color-alt2: var(--color-sf-on-secondary);
109
+ }
110
+
111
+ .e-timeline {
112
+ --dot-size: 16px;
113
+ --dot-outer-space: 0;
114
+ --dot-border: 1px;
115
+ --connector-size: 1px;
116
+ --dot-radius: 50%;
117
+ height: inherit;
118
+ width: 100%;
119
+ }
120
+ .e-timeline [class^="e-dot "]::before,
121
+ .e-timeline .e-dot-item,
122
+ .e-timeline .e-dot {
123
+ display: -webkit-box;
124
+ display: -ms-flexbox;
125
+ display: flex;
126
+ -webkit-box-align: center;
127
+ -ms-flex-align: center;
128
+ align-items: center;
129
+ -webkit-box-pack: center;
130
+ -ms-flex-pack: center;
131
+ justify-content: center;
132
+ }
133
+ .e-timeline [class^="e-dot "]::before {
134
+ min-width: 32px;
135
+ min-height: 32px;
136
+ border-radius: var(--dot-radius);
137
+ }
138
+ .e-timeline .e-timeline-items {
139
+ display: -webkit-inline-box;
140
+ display: -ms-inline-flexbox;
141
+ display: inline-flex;
142
+ -webkit-box-orient: vertical;
143
+ -webkit-box-direction: normal;
144
+ -ms-flex-direction: column;
145
+ flex-direction: column;
146
+ list-style: none;
147
+ -ms-flex-wrap: nowrap;
148
+ flex-wrap: nowrap;
149
+ padding: 0;
150
+ width: inherit;
151
+ height: inherit;
152
+ }
153
+ .e-timeline .e-timeline-item {
154
+ display: -webkit-box;
155
+ display: -ms-flexbox;
156
+ display: flex;
157
+ -webkit-box-orient: horizontal;
158
+ -webkit-box-direction: normal;
159
+ -ms-flex-direction: row;
160
+ flex-direction: row;
161
+ position: relative;
162
+ -webkit-box-align: start;
163
+ -ms-flex-align: start;
164
+ align-items: flex-start;
165
+ width: inherit;
166
+ height: inherit;
167
+ }
168
+ .e-timeline .e-timeline-item.e-connector::after {
169
+ top: 0;
170
+ bottom: 0;
171
+ left: calc(50% - var(--connector-size));
172
+ right: auto;
173
+ content: "";
174
+ position: absolute;
175
+ z-index: 999;
176
+ border-width: var(--connector-size);
177
+ border-style: solid;
178
+ }
179
+ .e-timeline .e-timeline-item.e-connector.e-item-template::after {
180
+ content: unset;
181
+ }
182
+ .e-timeline .e-dot-item {
183
+ position: relative;
184
+ -webkit-box-flex: 0;
185
+ -ms-flex: 0 1 calc(var(--dot-size) * 3);
186
+ flex: 0 1 calc(var(--dot-size) * 3);
187
+ z-index: 1000;
188
+ }
189
+ .e-timeline .e-dot {
190
+ min-width: var(--dot-size);
191
+ min-height: var(--dot-size);
192
+ border-radius: var(--dot-radius);
193
+ outline: var(--dot-outer-space) solid;
194
+ border: var(--dot-border) solid;
195
+ font-size: 16px;
196
+ background-size: cover;
197
+ background-position: center;
198
+ background-repeat: no-repeat;
199
+ }
200
+ .e-timeline .e-opposite-content,
201
+ .e-timeline .e-content {
202
+ -webkit-box-flex: 1;
203
+ -ms-flex: 1 1 50%;
204
+ flex: 1 1 50%;
205
+ }
206
+ .e-timeline .e-opposite-content {
207
+ font-size: 12px;
208
+ }
209
+ .e-timeline .e-content {
210
+ text-align: left;
211
+ font-size: 14px;
212
+ font-weight: 500;
213
+ }
214
+ .e-timeline .e-timeline-item:first-child::after {
215
+ top: 0;
216
+ }
217
+ .e-timeline .e-timeline-item:last-child::after {
218
+ bottom: calc(var(--dot-size) * 2);
219
+ }
220
+ .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) {
221
+ -webkit-box-orient: horizontal;
222
+ -webkit-box-direction: reverse;
223
+ -ms-flex-direction: row-reverse;
224
+ flex-direction: row-reverse;
225
+ }
226
+ .e-timeline.e-vertical.e-timeline-reverse .e-timeline-items {
227
+ -webkit-box-orient: vertical;
228
+ -webkit-box-direction: reverse;
229
+ -ms-flex-direction: column-reverse;
230
+ flex-direction: column-reverse;
231
+ }
232
+ .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 {
233
+ text-align: left;
234
+ }
235
+ .e-timeline.e-vertical .e-timeline-item.e-connector:last-child::after {
236
+ content: unset;
237
+ }
238
+ .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 {
239
+ left: calc(var(--dot-size) * 3 / 2 - var(--connector-size));
240
+ right: auto;
241
+ }
242
+ .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 {
243
+ right: calc(var(--dot-size) * 3 / 2 - var(--connector-size));
244
+ left: auto;
245
+ }
246
+ .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 {
247
+ -webkit-box-flex: 0;
248
+ -ms-flex: 0;
249
+ flex: 0;
250
+ }
251
+ .e-timeline.e-vertical.e-timeline-reverse .e-timeline-item.e-connector:first-child::after {
252
+ content: unset;
253
+ }
254
+ .e-timeline.e-vertical.e-timeline-reverse .e-timeline-item.e-connector:last-child::after {
255
+ content: "";
256
+ bottom: 0;
257
+ }
258
+ .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 {
259
+ text-align: right;
260
+ }
261
+ .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 {
262
+ text-align: left;
263
+ }
264
+ .e-timeline.e-vertical .e-dot-item {
265
+ width: calc(var(--dot-size) * 2);
266
+ }
267
+ .e-timeline.e-horizontal .e-timeline-items {
268
+ display: -webkit-inline-box;
269
+ display: -ms-inline-flexbox;
270
+ display: inline-flex;
271
+ -webkit-box-orient: horizontal;
272
+ -webkit-box-direction: normal;
273
+ -ms-flex-direction: row;
274
+ flex-direction: row;
275
+ }
276
+ .e-timeline.e-horizontal .e-timeline-item {
277
+ height: auto;
278
+ -webkit-box-orient: vertical;
279
+ -webkit-box-direction: normal;
280
+ -ms-flex-direction: column;
281
+ flex-direction: column;
282
+ -webkit-box-align: center;
283
+ -ms-flex-align: center;
284
+ align-items: center;
285
+ }
286
+ .e-timeline.e-horizontal.e-timeline-reverse.e-rtl .e-timeline-item.e-connector::after {
287
+ left: calc(50% - var(--connector-size));
288
+ right: auto;
289
+ }
290
+ .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 {
291
+ right: calc(50% - var(--connector-size));
292
+ left: auto;
293
+ }
294
+ .e-timeline.e-horizontal .e-dot-item {
295
+ margin: calc(var(--dot-size) * 2 / 2) 0;
296
+ }
297
+ .e-timeline.e-horizontal .e-opposite-content,
298
+ .e-timeline.e-horizontal .e-content {
299
+ display: -webkit-box;
300
+ display: -ms-flexbox;
301
+ display: flex;
302
+ }
303
+ .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 {
304
+ -webkit-box-align: end;
305
+ -ms-flex-align: end;
306
+ align-items: flex-end;
307
+ }
308
+ .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 {
309
+ -webkit-box-align: start;
310
+ -ms-flex-align: start;
311
+ align-items: flex-start;
312
+ }
313
+ .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) {
314
+ -webkit-box-orient: vertical;
315
+ -webkit-box-direction: reverse;
316
+ -ms-flex-direction: column-reverse;
317
+ flex-direction: column-reverse;
318
+ }
319
+ .e-timeline.e-horizontal.e-timeline-reverse .e-timeline-items {
320
+ -webkit-box-orient: horizontal;
321
+ -webkit-box-direction: reverse;
322
+ -ms-flex-direction: row-reverse;
323
+ flex-direction: row-reverse;
324
+ }
325
+ .e-timeline.e-horizontal .e-timeline-item::after {
326
+ width: 100%;
327
+ height: 0;
328
+ top: calc(50% - var(--connector-size));
329
+ }
330
+ .e-timeline.e-horizontal .e-opposite-content {
331
+ display: -webkit-box;
332
+ display: -ms-flexbox;
333
+ display: flex;
334
+ -webkit-box-align: end;
335
+ -ms-flex-align: end;
336
+ align-items: flex-end;
337
+ text-align: left;
338
+ padding: 0;
339
+ }
340
+ .e-timeline.e-horizontal .e-content {
341
+ padding: 0;
342
+ }
343
+ .e-timeline.e-horizontal .e-timeline-item:last-child::after {
344
+ width: auto;
345
+ }
346
+
347
+ .e-bigger.e-timeline [class^="e-dot "]::before,
348
+ .e-bigger .e-timeline [class^="e-dot "]::before {
349
+ min-width: 40px;
350
+ min-height: 40px;
351
+ font-size: 18px;
352
+ }
353
+ .e-bigger.e-timeline .e-dot-item,
354
+ .e-bigger .e-timeline .e-dot-item {
355
+ -webkit-box-flex: 0;
356
+ -ms-flex: 0 1 calc(var(--dot-size) * 4);
357
+ flex: 0 1 calc(var(--dot-size) * 4);
358
+ }
359
+ .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,
360
+ .e-bigger .e-timeline.e-vertical.e-align-before.e-opposite-content-only .e-connector::after,
361
+ .e-bigger .e-timeline.e-vertical.e-align-after.e-rtl.e-opposite-content-only .e-connector::after,
362
+ .e-bigger .e-timeline.e-vertical.e-align-before.e-rtl.e-content-only .e-connector::after,
363
+ .e-bigger .e-timeline.e-vertical.e-align-after.e-content-only .e-connector::after {
364
+ left: calc(var(--dot-size) * 4 / 2 - var(--connector-size));
365
+ }
366
+ .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,
367
+ .e-bigger .e-timeline.e-vertical.e-align-before.e-content-only .e-connector::after,
368
+ .e-bigger .e-timeline.e-vertical.e-align-before.e-rtl.e-opposite-content-only .e-connector::after,
369
+ .e-bigger .e-timeline.e-vertical.e-align-after.e-opposite-content-only .e-connector::after,
370
+ .e-bigger .e-timeline.e-vertical.e-align-after.e-rtl.e-content-only .e-connector::after {
371
+ right: calc(var(--dot-size) * 4 / 2 - var(--connector-size));
372
+ }
373
+ .e-bigger.e-timeline .e-dot,
374
+ .e-bigger .e-timeline .e-dot {
375
+ min-width: 20px;
376
+ min-height: 20px;
377
+ }
378
+ .e-bigger.e-timeline .e-opposite-content,
379
+ .e-bigger .e-timeline .e-opposite-content {
380
+ font-size: 14px;
381
+ }
382
+ .e-bigger.e-timeline .e-content,
383
+ .e-bigger .e-timeline .e-content {
384
+ font-size: 16px;
385
+ }
386
+
387
+ .e-timeline .e-dot {
388
+ background-color: rgba(var(--color-sf-outline-variant));
389
+ border-color: rgba(var(--color-sf-outline-variant));
390
+ color: rgba(var(--color-sf-on-surface));
391
+ outline-color: rgba(var(--color-sf-surface));
392
+ }
393
+ .e-timeline.e-outline .e-dot {
394
+ background-color: rgba(var(--color-sf-surface));
395
+ }
396
+ .e-timeline .e-timeline-item.e-connector::after {
397
+ border-color: rgba(var(--color-sf-outline-variant));
398
+ }
399
+ .e-timeline .e-content {
400
+ color: var(--color-sf-on-surface);
401
+ }
402
+ .e-timeline .e-opposite-content {
403
+ color: var(--color-sf-on-surface-variant);
404
+ }
405
+ .e-timeline .e-item-disabled .e-content,
406
+ .e-timeline .e-item-disabled .e-opposite-content {
407
+ color: rgba(var(--color-sf-on-surface), 0.38);
408
+ }