@syncfusion/ej2-navigations 19.3.57 → 19.4.47

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 (259) hide show
  1. package/.github/PULL_REQUEST_TEMPLATE/Bug.md +63 -0
  2. package/.github/PULL_REQUEST_TEMPLATE/feature.md +39 -0
  3. package/CHANGELOG.md +57 -0
  4. package/dist/ej2-navigations.umd.min.js +2 -2
  5. package/dist/ej2-navigations.umd.min.js.map +1 -1
  6. package/dist/es6/ej2-navigations.es2015.js +517 -142
  7. package/dist/es6/ej2-navigations.es2015.js.map +1 -1
  8. package/dist/es6/ej2-navigations.es5.js +524 -143
  9. package/dist/es6/ej2-navigations.es5.js.map +1 -1
  10. package/dist/global/ej2-navigations.min.js +2 -2
  11. package/dist/global/ej2-navigations.min.js.map +1 -1
  12. package/dist/global/index.d.ts +1 -1
  13. package/package.json +11 -11
  14. package/src/accordion/accordion-model.d.ts +5 -5
  15. package/src/accordion/accordion.d.ts +5 -5
  16. package/src/accordion/accordion.js +2 -19
  17. package/src/breadcrumb/breadcrumb-model.d.ts +23 -11
  18. package/src/breadcrumb/breadcrumb.d.ts +33 -10
  19. package/src/breadcrumb/breadcrumb.js +320 -78
  20. package/src/common/menu-base.js +8 -2
  21. package/src/common/v-scroll.js +1 -1
  22. package/src/tab/tab-model.d.ts +14 -6
  23. package/src/tab/tab.d.ts +33 -16
  24. package/src/tab/tab.js +66 -31
  25. package/src/toolbar/toolbar-model.d.ts +7 -7
  26. package/src/toolbar/toolbar.d.ts +6 -6
  27. package/src/toolbar/toolbar.js +81 -13
  28. package/src/treeview/treeview-model.d.ts +10 -0
  29. package/src/treeview/treeview.d.ts +13 -0
  30. package/src/treeview/treeview.js +48 -0
  31. package/styles/accordion/_bootstrap-dark-definition.scss +4 -0
  32. package/styles/accordion/_bootstrap-definition.scss +4 -0
  33. package/styles/accordion/_bootstrap4-definition.scss +4 -0
  34. package/styles/accordion/_bootstrap5-definition.scss +39 -35
  35. package/styles/accordion/_fabric-dark-definition.scss +4 -0
  36. package/styles/accordion/_fabric-definition.scss +4 -0
  37. package/styles/accordion/_fluent-definition.scss +85 -0
  38. package/styles/accordion/_highcontrast-definition.scss +5 -1
  39. package/styles/accordion/_highcontrast-light-definition.scss +4 -0
  40. package/styles/accordion/_layout.scss +6 -14
  41. package/styles/accordion/_material-dark-definition.scss +4 -0
  42. package/styles/accordion/_material-definition.scss +4 -0
  43. package/styles/accordion/_tailwind-definition.scss +83 -79
  44. package/styles/accordion/_theme.scss +12 -11
  45. package/styles/accordion/bootstrap4.css +1 -2
  46. package/styles/accordion/bootstrap5-dark.css +11 -2
  47. package/styles/accordion/bootstrap5.css +11 -2
  48. package/styles/accordion/highcontrast-light.css +0 -4
  49. package/styles/accordion/highcontrast.css +1 -5
  50. package/styles/accordion/icons/_fluent.scss +17 -0
  51. package/styles/accordion/icons/_tailwind.scss +17 -17
  52. package/styles/bootstrap-dark.css +319 -85
  53. package/styles/bootstrap.css +318 -84
  54. package/styles/bootstrap4.css +319 -77
  55. package/styles/bootstrap5-dark.css +341 -76
  56. package/styles/bootstrap5.css +343 -78
  57. package/styles/breadcrumb/_bootstrap-dark-definition.scss +14 -0
  58. package/styles/breadcrumb/_bootstrap-definition.scss +13 -0
  59. package/styles/breadcrumb/_bootstrap4-definition.scss +13 -0
  60. package/styles/breadcrumb/_bootstrap5-definition.scss +15 -2
  61. package/styles/breadcrumb/_fabric-dark-definition.scss +13 -0
  62. package/styles/breadcrumb/_fabric-definition.scss +13 -0
  63. package/styles/breadcrumb/_fluent-definition.scss +59 -0
  64. package/styles/breadcrumb/_highcontrast-definition.scss +13 -0
  65. package/styles/breadcrumb/_highcontrast-light-definition.scss +13 -0
  66. package/styles/breadcrumb/_layout.scss +171 -22
  67. package/styles/breadcrumb/_material-dark-definition.scss +13 -0
  68. package/styles/breadcrumb/_material-definition.scss +13 -0
  69. package/styles/breadcrumb/_tailwind-dark-definition.scss +13 -0
  70. package/styles/breadcrumb/_tailwind-definition.scss +13 -0
  71. package/styles/breadcrumb/_theme.scss +27 -8
  72. package/styles/breadcrumb/bootstrap-dark.css +194 -17
  73. package/styles/breadcrumb/bootstrap.css +194 -17
  74. package/styles/breadcrumb/bootstrap4.css +194 -17
  75. package/styles/breadcrumb/bootstrap5-dark.css +198 -24
  76. package/styles/breadcrumb/bootstrap5.css +198 -24
  77. package/styles/breadcrumb/fabric-dark.css +197 -20
  78. package/styles/breadcrumb/fabric.css +197 -20
  79. package/styles/breadcrumb/highcontrast-light.css +200 -22
  80. package/styles/breadcrumb/highcontrast.css +200 -22
  81. package/styles/breadcrumb/icons/_bootstrap-dark.scss +2 -1
  82. package/styles/breadcrumb/icons/_bootstrap.scss +2 -1
  83. package/styles/breadcrumb/icons/_bootstrap4.scss +2 -1
  84. package/styles/breadcrumb/icons/_bootstrap5.scss +2 -1
  85. package/styles/breadcrumb/icons/_fabric-dark.scss +2 -1
  86. package/styles/breadcrumb/icons/_fabric.scss +2 -1
  87. package/styles/breadcrumb/icons/_fluent.scss +25 -0
  88. package/styles/breadcrumb/icons/_highcontrast-light.scss +2 -1
  89. package/styles/breadcrumb/icons/_highcontrast.scss +2 -1
  90. package/styles/breadcrumb/icons/_material-dark.scss +2 -1
  91. package/styles/breadcrumb/icons/_material.scss +2 -1
  92. package/styles/breadcrumb/icons/_tailwind-dark.scss +2 -1
  93. package/styles/breadcrumb/icons/_tailwind.scss +2 -1
  94. package/styles/breadcrumb/material-dark.css +186 -13
  95. package/styles/breadcrumb/material.css +186 -13
  96. package/styles/breadcrumb/tailwind-dark.css +195 -22
  97. package/styles/breadcrumb/tailwind.css +195 -22
  98. package/styles/context-menu/_bootstrap-dark-definition.scss +1 -1
  99. package/styles/context-menu/_bootstrap-definition.scss +1 -1
  100. package/styles/context-menu/_bootstrap4-definition.scss +1 -1
  101. package/styles/context-menu/_bootstrap5-definition.scss +5 -5
  102. package/styles/context-menu/_fluent-definition.scss +52 -0
  103. package/styles/context-menu/_material-dark-definition.scss +1 -1
  104. package/styles/context-menu/_material-definition.scss +1 -1
  105. package/styles/context-menu/_tailwind-definition.scss +1 -1
  106. package/styles/context-menu/bootstrap-dark.css +1 -1
  107. package/styles/context-menu/bootstrap.css +1 -1
  108. package/styles/context-menu/bootstrap4.css +1 -1
  109. package/styles/context-menu/bootstrap5-dark.css +5 -5
  110. package/styles/context-menu/bootstrap5.css +6 -6
  111. package/styles/context-menu/icons/_fluent.scss +32 -0
  112. package/styles/context-menu/material-dark.css +1 -1
  113. package/styles/context-menu/material.css +1 -1
  114. package/styles/context-menu/tailwind-dark.css +1 -1
  115. package/styles/context-menu/tailwind.css +1 -1
  116. package/styles/fabric-dark.css +307 -42
  117. package/styles/fabric.css +310 -45
  118. package/styles/h-scroll/_fluent-definition.scss +78 -0
  119. package/styles/h-scroll/_tailwind-definition.scss +78 -78
  120. package/styles/h-scroll/_theme.scss +1 -1
  121. package/styles/h-scroll/bootstrap-dark.css +1 -1
  122. package/styles/h-scroll/bootstrap.css +1 -1
  123. package/styles/h-scroll/bootstrap4.css +1 -1
  124. package/styles/h-scroll/bootstrap5-dark.css +1 -1
  125. package/styles/h-scroll/bootstrap5.css +1 -1
  126. package/styles/h-scroll/fabric-dark.css +1 -1
  127. package/styles/h-scroll/fabric.css +1 -1
  128. package/styles/h-scroll/highcontrast-light.css +1 -1
  129. package/styles/h-scroll/highcontrast.css +1 -1
  130. package/styles/h-scroll/icons/_fluent.scss +49 -0
  131. package/styles/h-scroll/icons/_tailwind.scss +49 -49
  132. package/styles/h-scroll/material-dark.css +1 -1
  133. package/styles/h-scroll/material.css +1 -1
  134. package/styles/h-scroll/tailwind-dark.css +1 -1
  135. package/styles/h-scroll/tailwind.css +1 -1
  136. package/styles/highcontrast-light.css +319 -48
  137. package/styles/highcontrast.css +324 -53
  138. package/styles/material-dark.css +297 -33
  139. package/styles/material.css +298 -34
  140. package/styles/menu/_fluent-definition.scss +68 -0
  141. package/styles/menu/_layout.scss +3 -2
  142. package/styles/menu/_theme.scss +9 -0
  143. package/styles/menu/bootstrap-dark.css +3 -2
  144. package/styles/menu/bootstrap.css +3 -2
  145. package/styles/menu/bootstrap4.css +3 -2
  146. package/styles/menu/bootstrap5-dark.css +6 -5
  147. package/styles/menu/bootstrap5.css +7 -6
  148. package/styles/menu/fabric-dark.css +2 -1
  149. package/styles/menu/fabric.css +2 -1
  150. package/styles/menu/highcontrast-light.css +2 -1
  151. package/styles/menu/highcontrast.css +2 -1
  152. package/styles/menu/icons/_fluent.scss +133 -0
  153. package/styles/menu/material-dark.css +3 -2
  154. package/styles/menu/material.css +3 -2
  155. package/styles/menu/tailwind-dark.css +3 -2
  156. package/styles/menu/tailwind.css +3 -2
  157. package/styles/sidebar/_bootstrap5-definition.scss +5 -5
  158. package/styles/sidebar/_fluent-definition.scss +5 -0
  159. package/styles/sidebar/_theme.scss +4 -2
  160. package/styles/sidebar/bootstrap5-dark.css +0 -1
  161. package/styles/sidebar/bootstrap5.css +0 -1
  162. package/styles/sidebar/tailwind-dark.css +0 -1
  163. package/styles/sidebar/tailwind.css +0 -1
  164. package/styles/tab/_bootstrap-dark-definition.scss +10 -1
  165. package/styles/tab/_bootstrap-definition.scss +10 -1
  166. package/styles/tab/_bootstrap4-definition.scss +9 -1
  167. package/styles/tab/_bootstrap5-definition.scss +401 -401
  168. package/styles/tab/_fabric-dark-definition.scss +10 -0
  169. package/styles/tab/_fabric-definition.scss +10 -0
  170. package/styles/tab/_fluent-definition.scss +409 -0
  171. package/styles/tab/_highcontrast-definition.scss +10 -0
  172. package/styles/tab/_highcontrast-light-definition.scss +10 -0
  173. package/styles/tab/_layout.scss +145 -0
  174. package/styles/tab/_material-dark-definition.scss +10 -0
  175. package/styles/tab/_material-definition.scss +10 -0
  176. package/styles/tab/_tailwind-definition.scss +431 -420
  177. package/styles/tab/_theme.scss +188 -113
  178. package/styles/tab/bootstrap-dark.css +43 -18
  179. package/styles/tab/bootstrap.css +42 -17
  180. package/styles/tab/bootstrap4.css +47 -28
  181. package/styles/tab/bootstrap5-dark.css +53 -30
  182. package/styles/tab/bootstrap5.css +53 -30
  183. package/styles/tab/fabric-dark.css +43 -20
  184. package/styles/tab/fabric.css +46 -23
  185. package/styles/tab/highcontrast-light.css +52 -19
  186. package/styles/tab/highcontrast.css +56 -23
  187. package/styles/tab/icons/_bootstrap-dark.scss +2 -2
  188. package/styles/tab/icons/_fabric-dark.scss +2 -2
  189. package/styles/tab/icons/_fluent.scss +140 -0
  190. package/styles/tab/icons/_tailwind.scss +140 -140
  191. package/styles/tab/material-dark.css +42 -15
  192. package/styles/tab/material.css +42 -15
  193. package/styles/tab/tailwind-dark.css +42 -17
  194. package/styles/tab/tailwind.css +42 -17
  195. package/styles/tailwind-dark.css +315 -51
  196. package/styles/tailwind.css +315 -51
  197. package/styles/toolbar/_bootstrap-dark-definition.scss +7 -1
  198. package/styles/toolbar/_bootstrap-definition.scss +7 -1
  199. package/styles/toolbar/_bootstrap4-definition.scss +8 -2
  200. package/styles/toolbar/_bootstrap5-definition.scss +104 -86
  201. package/styles/toolbar/_fabric-dark-definition.scss +7 -0
  202. package/styles/toolbar/_fabric-definition.scss +7 -0
  203. package/styles/toolbar/_fluent-definition.scss +149 -0
  204. package/styles/toolbar/_highcontrast-definition.scss +7 -0
  205. package/styles/toolbar/_highcontrast-light-definition.scss +7 -0
  206. package/styles/toolbar/_layout.scss +27 -72
  207. package/styles/toolbar/_material-dark-definition.scss +7 -1
  208. package/styles/toolbar/_material-definition.scss +7 -1
  209. package/styles/toolbar/_tailwind-definition.scss +149 -143
  210. package/styles/toolbar/_theme.scss +12 -15
  211. package/styles/toolbar/bootstrap-dark.css +17 -46
  212. package/styles/toolbar/bootstrap.css +17 -46
  213. package/styles/toolbar/bootstrap4.css +12 -26
  214. package/styles/toolbar/bootstrap5-dark.css +6 -7
  215. package/styles/toolbar/bootstrap5.css +6 -7
  216. package/styles/toolbar/fabric-dark.css +4 -0
  217. package/styles/toolbar/fabric.css +4 -0
  218. package/styles/toolbar/highcontrast-light.css +4 -1
  219. package/styles/toolbar/highcontrast.css +4 -1
  220. package/styles/toolbar/icons/_fluent.scss +16 -0
  221. package/styles/toolbar/icons/_tailwind.scss +16 -16
  222. package/styles/toolbar/material-dark.css +4 -1
  223. package/styles/toolbar/material.css +5 -2
  224. package/styles/toolbar/tailwind-dark.css +8 -6
  225. package/styles/toolbar/tailwind.css +8 -6
  226. package/styles/treeview/_bootstrap-dark-definition.scss +11 -0
  227. package/styles/treeview/_bootstrap-definition.scss +11 -0
  228. package/styles/treeview/_bootstrap4-definition.scss +11 -0
  229. package/styles/treeview/_bootstrap5-definition.scss +120 -109
  230. package/styles/treeview/_fabric-dark-definition.scss +11 -0
  231. package/styles/treeview/_fabric-definition.scss +11 -0
  232. package/styles/treeview/_fluent-definition.scss +120 -0
  233. package/styles/treeview/_highcontrast-definition.scss +11 -0
  234. package/styles/treeview/_highcontrast-light-definition.scss +11 -0
  235. package/styles/treeview/_layout.scss +116 -20
  236. package/styles/treeview/_material-dark-definition.scss +13 -0
  237. package/styles/treeview/_material-definition.scss +11 -0
  238. package/styles/treeview/_tailwind-definition.scss +12 -0
  239. package/styles/treeview/_theme.scss +5 -5
  240. package/styles/treeview/bootstrap-dark.css +60 -0
  241. package/styles/treeview/bootstrap.css +60 -0
  242. package/styles/treeview/bootstrap4.css +60 -0
  243. package/styles/treeview/bootstrap5-dark.css +61 -1
  244. package/styles/treeview/bootstrap5.css +61 -1
  245. package/styles/treeview/fabric-dark.css +60 -0
  246. package/styles/treeview/fabric.css +60 -0
  247. package/styles/treeview/highcontrast-light.css +60 -0
  248. package/styles/treeview/highcontrast.css +60 -0
  249. package/styles/treeview/icons/_bootstrap5.scss +43 -43
  250. package/styles/treeview/icons/_fluent.scss +43 -0
  251. package/styles/treeview/icons/_tailwind-dark.scss +43 -43
  252. package/styles/treeview/material-dark.css +60 -0
  253. package/styles/treeview/material.css +60 -0
  254. package/styles/treeview/tailwind-dark.css +65 -1
  255. package/styles/treeview/tailwind.css +65 -1
  256. package/styles/v-scroll/_fluent-definition.scss +49 -0
  257. package/styles/v-scroll/_tailwind-definition.scss +49 -49
  258. package/styles/v-scroll/icons/_fluent.scss +26 -0
  259. package/styles/v-scroll/icons/_tailwind.scss +26 -26
@@ -223,7 +223,7 @@
223
223
  }
224
224
 
225
225
  /*! h-scroll theme */
226
- .e-hscroll .e-icons {
226
+ .e-hscroll .e-scroll-nav .e-icons {
227
227
  color: rgba(255, 255, 255, 0.54);
228
228
  }
229
229
 
@@ -1318,7 +1318,6 @@
1318
1318
  height: auto;
1319
1319
  -ms-flex-pack: center;
1320
1320
  justify-content: center;
1321
- height: 36px;
1322
1321
  }
1323
1322
 
1324
1323
  .e-toolbar .e-toolbar-pop .e-toolbar-item > * {
@@ -1870,6 +1869,10 @@
1870
1869
  box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.21);
1871
1870
  }
1872
1871
 
1872
+ .e-toolbar.e-extended-toolbar .e-toolbar-pop {
1873
+ background: #212121;
1874
+ }
1875
+
1873
1876
  .e-toolbar.e-toolpop .e-hor-nav.e-nav-active,
1874
1877
  .e-toolbar.e-toolpop .e-hor-nav.e-nav-active:not(.e-expended-nav) {
1875
1878
  background: rgba(255, 255, 255, 0.1);
@@ -2455,7 +2458,7 @@
2455
2458
  -ms-user-select: none;
2456
2459
  user-select: none;
2457
2460
  font-size: 14px;
2458
- padding: 8px 0;
2461
+ padding: 0;
2459
2462
  border: none;
2460
2463
  border-radius: 0;
2461
2464
  box-shadow: 0 8px 10px 0 rgba(0, 0, 0, 0.24);
@@ -4876,6 +4879,10 @@
4876
4879
  top: 0;
4877
4880
  }
4878
4881
 
4882
+ .e-tab .e-tab-header.e-reorder-active-item .e-toolbar-pop .e-toolbar-item.e-active .e-text-wrap::before {
4883
+ display: none;
4884
+ }
4885
+
4879
4886
  .e-tab .e-tab-header.e-vertical {
4880
4887
  max-width: 150px;
4881
4888
  z-index: 1;
@@ -5133,6 +5140,11 @@
5133
5140
  min-height: 62px;
5134
5141
  }
5135
5142
 
5143
+ .e-tab.e-vertical-icon .e-tab-header.e-reorder-active-item .e-toolbar-pop .e-toolbar-item.e-active .e-tab-wrap::before,
5144
+ .e-tab.e-vertical-icon .e-tab-header.e-reorder-active-item .e-toolbar-pop .e-toolbar-item:not(.e-separator):last-child.e-active .e-tab-wrap::before {
5145
+ display: none;
5146
+ }
5147
+
5136
5148
  .e-tab.e-vertical-icon .e-tab-header .e-toolbar-items {
5137
5149
  height: 62px;
5138
5150
  }
@@ -6191,6 +6203,10 @@
6191
6203
  color: rgba(255, 255, 255, 0.3);
6192
6204
  }
6193
6205
 
6206
+ .e-tab .e-tab-header.e-reorder-active-item:not(.e-vertical) .e-toolbar-pop .e-toolbar-item.e-active {
6207
+ border: initial;
6208
+ }
6209
+
6194
6210
  .e-tab .e-tab-header .e-toolbar-pop {
6195
6211
  background: #424242;
6196
6212
  border: 0;
@@ -6228,6 +6244,11 @@
6228
6244
  background: rgba(255, 255, 255, 0.18);
6229
6245
  }
6230
6246
 
6247
+ .e-tab .e-tab-header .e-toolbar-pop .e-toolbar-item.e-active .e-tab-wrap .e-tab-text,
6248
+ .e-tab .e-tab-header .e-toolbar-pop .e-toolbar-item.e-active .e-tab-wrap .e-tab-icon {
6249
+ color: #00b0ff;
6250
+ }
6251
+
6231
6252
  .e-tab .e-tab-header .e-toolbar-pop .e-toolbar-item.e-disable.e-overlay .e-tab-text,
6232
6253
  .e-tab .e-tab-header .e-toolbar-pop .e-toolbar-item.e-disable.e-overlay .e-tab-icon {
6233
6254
  color: rgba(255, 255, 255, 0.3);
@@ -6631,7 +6652,7 @@
6631
6652
  .e-tab.e-fill.e-focused .e-tab-header .e-toolbar-item .e-tab-wrap:focus .e-tab-icon,
6632
6653
  .e-tab.e-fill.e-focused .e-tab-header .e-toolbar-item .e-tab-wrap:focus .e-tab-text,
6633
6654
  .e-tab.e-fill.e-focused .e-tab-header .e-toolbar-item .e-tab-wrap:focus .e-close-icon {
6634
- color: #00b0ff;
6655
+ color: #fff;
6635
6656
  }
6636
6657
 
6637
6658
  .e-tab.e-fill.e-focused .e-tab-header .e-toolbar-item.e-active .e-tab-wrap:focus {
@@ -6668,6 +6689,16 @@
6668
6689
  background: #3f51b5;
6669
6690
  }
6670
6691
 
6692
+ .e-tab.e-background .e-tab-header .e-toolbar-item .e-tab-wrap .e-tab-text,
6693
+ .e-tab.e-background .e-tab-header .e-toolbar-item .e-tab-wrap .e-tab-icon,
6694
+ .e-tab.e-background .e-tab-header .e-toolbar-item .e-tab-wrap .e-close-icon {
6695
+ color: rgba(255, 255, 255, 0.7);
6696
+ }
6697
+
6698
+ .e-tab.e-background .e-tab-header .e-toolbar-item .e-tab-wrap .e-close-icon:hover {
6699
+ color: rgba(255, 255, 255, 0.54);
6700
+ }
6701
+
6671
6702
  .e-tab.e-background .e-tab-header .e-toolbar-item .e-tab-wrap:hover {
6672
6703
  background: inherit;
6673
6704
  }
@@ -6681,20 +6712,6 @@
6681
6712
  color: #fff;
6682
6713
  }
6683
6714
 
6684
- .e-tab.e-background .e-tab-header .e-toolbar-item .e-tab-text,
6685
- .e-tab.e-background .e-tab-header .e-toolbar-item .e-tab-icon,
6686
- .e-tab.e-background .e-tab-header .e-toolbar-item .e-close-icon {
6687
- color: rgba(255, 255, 255, 0.7);
6688
- }
6689
-
6690
- .e-tab.e-background .e-tab-header .e-toolbar-item .e-close-icon {
6691
- color: rgba(255, 255, 255, 0.54);
6692
- }
6693
-
6694
- .e-tab.e-background .e-tab-header .e-toolbar-item .e-close-icon:hover {
6695
- color: #00b0ff;
6696
- }
6697
-
6698
6715
  .e-tab.e-background .e-tab-header .e-toolbar-item.e-active {
6699
6716
  border: 0;
6700
6717
  margin: 0;
@@ -6762,48 +6779,61 @@
6762
6779
  color: white;
6763
6780
  }
6764
6781
 
6782
+ .e-tab.e-background .e-tab-header .e-hscroll:not(.e-scroll-device) .e-scroll-nav .e-nav-arrow,
6765
6783
  .e-tab.e-background .e-tab-header .e-scroll-nav .e-nav-arrow {
6766
6784
  color: rgba(255, 255, 255, 0.7);
6767
6785
  }
6768
6786
 
6787
+ .e-tab.e-background .e-tab-header .e-hscroll:not(.e-scroll-device) .e-scroll-nav .e-nav-arrow:hover,
6769
6788
  .e-tab.e-background .e-tab-header .e-scroll-nav .e-nav-arrow:hover {
6770
6789
  background: inherit;
6771
6790
  color: yellow;
6772
6791
  }
6773
6792
 
6793
+ .e-tab.e-background .e-tab-header .e-hscroll:not(.e-scroll-device) .e-scroll-nav:focus .e-nav-arrow,
6774
6794
  .e-tab.e-background .e-tab-header .e-scroll-nav:focus .e-nav-arrow {
6775
6795
  color: yellow;
6776
6796
  }
6777
6797
 
6798
+ .e-tab.e-background .e-tab-header .e-hscroll:not(.e-scroll-device) .e-scroll-nav:focus .e-nav-arrow:hover,
6778
6799
  .e-tab.e-background .e-tab-header .e-scroll-nav:focus .e-nav-arrow:hover {
6779
6800
  background: inherit;
6780
6801
  color: yellow;
6781
6802
  }
6782
6803
 
6804
+ .e-tab.e-background .e-tab-header .e-hscroll:not(.e-scroll-device) .e-scroll-nav:active::after,
6783
6805
  .e-tab.e-background .e-tab-header .e-scroll-nav:active::after {
6784
6806
  animation: hscroll-alt-popup-shadow 1s ease-out 0ms;
6785
6807
  }
6786
6808
 
6809
+ .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav) .e-popup-up-icon,
6810
+ .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav) .e-popup-down-icon,
6787
6811
  .e-tab.e-background .e-tab-header .e-hor-nav .e-popup-up-icon,
6788
6812
  .e-tab.e-background .e-tab-header .e-hor-nav .e-popup-down-icon {
6789
6813
  color: rgba(255, 255, 255, 0.7);
6790
6814
  }
6791
6815
 
6816
+ .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav) .e-popup-up-icon:hover,
6817
+ .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav) .e-popup-down-icon:hover,
6792
6818
  .e-tab.e-background .e-tab-header .e-hor-nav .e-popup-up-icon:hover,
6793
6819
  .e-tab.e-background .e-tab-header .e-hor-nav .e-popup-down-icon:hover {
6794
6820
  background: inherit;
6795
6821
  color: yellow;
6796
6822
  }
6797
6823
 
6824
+ .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav):focus .e-popup-up-icon,
6825
+ .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav):focus .e-popup-down-icon,
6798
6826
  .e-tab.e-background .e-tab-header .e-hor-nav:focus .e-popup-up-icon,
6799
6827
  .e-tab.e-background .e-tab-header .e-hor-nav:focus .e-popup-down-icon {
6800
6828
  color: yellow;
6801
6829
  }
6802
6830
 
6831
+ .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav):active::after,
6803
6832
  .e-tab.e-background .e-tab-header .e-hor-nav:active::after {
6804
6833
  animation: tbar-alt-popup-shadow 1s ease-out 0ms;
6805
6834
  }
6806
6835
 
6836
+ .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav).e-nav-active .e-popup-up-icon,
6807
6837
  .e-tab.e-background .e-tab-header .e-hor-nav.e-nav-active .e-popup-up-icon {
6808
6838
  color: yellow;
6809
6839
  }
@@ -7040,6 +7070,35 @@
7040
7070
  height: 40px;
7041
7071
  }
7042
7072
 
7073
+ .e-bigger .e-treeview.e-text-wrap .e-checkbox-wrapper + .e-list-text,
7074
+ .e-treeview.e-bigger.e-text-wrap .e-checkbox-wrapper + .e-list-text {
7075
+ max-width: calc(100% - 29px);
7076
+ }
7077
+
7078
+ .e-bigger .e-treeview.e-text-wrap .e-checkbox-wrapper + .e-list-icon + .e-list-text,
7079
+ .e-bigger .e-treeview.e-text-wrap .e-checkbox-wrapper + .e-list-img + .e-list-text,
7080
+ .e-treeview.e-bigger.e-text-wrap .e-checkbox-wrapper + .e-list-icon + .e-list-text,
7081
+ .e-treeview.e-bigger.e-text-wrap .e-checkbox-wrapper + .e-list-img + .e-list-text {
7082
+ max-width: calc(100% - 70px);
7083
+ }
7084
+
7085
+ .e-bigger .e-treeview.e-text-wrap .e-checkbox-wrapper + .e-list-icon + .e-list-img + .e-list-text,
7086
+ .e-treeview.e-bigger.e-text-wrap .e-checkbox-wrapper + .e-list-icon + .e-list-img + .e-list-text {
7087
+ max-width: calc(100% - 98px);
7088
+ }
7089
+
7090
+ .e-bigger .e-treeview.e-text-wrap .e-list-icon + .e-list-text,
7091
+ .e-bigger .e-treeview.e-text-wrap .e-list-img + .e-list-text,
7092
+ .e-treeview.e-bigger.e-text-wrap .e-list-icon + .e-list-text,
7093
+ .e-treeview.e-bigger.e-text-wrap .e-list-img + .e-list-text {
7094
+ max-width: calc(100% - 34px);
7095
+ }
7096
+
7097
+ .e-bigger .e-treeview.e-text-wrap .e-list-icon + .e-list-img + .e-list-text,
7098
+ .e-treeview.e-bigger.e-text-wrap .e-list-icon + .e-list-img + .e-list-text {
7099
+ max-width: calc(100% - 62px);
7100
+ }
7101
+
7043
7102
  .e-bigger .e-treeview .e-list-text,
7044
7103
  .e-treeview.e-bigger .e-list-text {
7045
7104
  line-height: 38px;
@@ -7159,9 +7218,40 @@
7159
7218
 
7160
7219
  .e-treeview.e-text-wrap .e-list-text {
7161
7220
  white-space: normal;
7221
+ word-break: break-word;
7222
+ }
7223
+
7224
+ .e-treeview.e-text-wrap.e-ie-wrap .e-list-text {
7162
7225
  word-break: break-all;
7163
7226
  }
7164
7227
 
7228
+ .e-treeview.e-text-wrap .e-editing .e-list-text,
7229
+ .e-treeview.e-text-wrap .e-editing .e-list-text .e-input-group {
7230
+ max-width: calc(100% - 2px);
7231
+ }
7232
+
7233
+ .e-treeview.e-text-wrap .e-checkbox-wrapper + .e-list-text {
7234
+ max-width: calc(100% - 22px);
7235
+ }
7236
+
7237
+ .e-treeview.e-text-wrap .e-checkbox-wrapper + .e-list-icon + .e-list-text,
7238
+ .e-treeview.e-text-wrap .e-checkbox-wrapper + .e-list-img + .e-list-text {
7239
+ max-width: calc(100% - 59px);
7240
+ }
7241
+
7242
+ .e-treeview.e-text-wrap .e-checkbox-wrapper + .e-list-icon + .e-list-img + .e-list-text {
7243
+ max-width: calc(100% - 87px);
7244
+ }
7245
+
7246
+ .e-treeview.e-text-wrap .e-list-icon + .e-list-text,
7247
+ .e-treeview.e-text-wrap .e-list-img + .e-list-text {
7248
+ max-width: calc(100% - 29px);
7249
+ }
7250
+
7251
+ .e-treeview.e-text-wrap .e-list-icon + .e-list-img + .e-list-text {
7252
+ max-width: calc(100% - 57px);
7253
+ }
7254
+
7165
7255
  .e-treeview .e-ul {
7166
7256
  margin: 0;
7167
7257
  padding: 0 0 0 24px;
@@ -8081,7 +8171,7 @@ ejs-sidebar {
8081
8171
  -webkit-user-select: none;
8082
8172
  -ms-user-select: none;
8083
8173
  user-select: none;
8084
- font-size: 13px;
8174
+ font-size: 0;
8085
8175
  padding: 0;
8086
8176
  text-align: left;
8087
8177
  white-space: nowrap;
@@ -8146,6 +8236,7 @@ ejs-sidebar {
8146
8236
  position: relative;
8147
8237
  display: -ms-inline-flexbox;
8148
8238
  display: inline-flex;
8239
+ font-size: 13px;
8149
8240
  height: 42px;
8150
8241
  line-height: 42px;
8151
8242
  padding: 0 12px;
@@ -8217,7 +8308,7 @@ ejs-sidebar {
8217
8308
  .e-menu-wrapper .e-ul,
8218
8309
  .e-menu-container .e-ul {
8219
8310
  font-size: 14px;
8220
- padding: 8px 0;
8311
+ padding: 0;
8221
8312
  min-width: 120px;
8222
8313
  }
8223
8314
 
@@ -9214,7 +9305,8 @@ ejs-sidebar {
9214
9305
  }
9215
9306
 
9216
9307
  /*! breadcrumb icons */
9217
- .e-breadcrumb .e-breadcrumb-collapsed::before {
9308
+ .e-breadcrumb .e-breadcrumb-collapsed::before,
9309
+ .e-breadcrumb .e-breadcrumb-menu::before {
9218
9310
  content: '\eb04';
9219
9311
  }
9220
9312
 
@@ -9236,6 +9328,31 @@ ejs-sidebar {
9236
9328
  display: block;
9237
9329
  }
9238
9330
 
9331
+ .e-breadcrumb.e-breadcrumb-wrap-mode {
9332
+ display: -ms-flexbox;
9333
+ display: flex;
9334
+ }
9335
+
9336
+ .e-breadcrumb .e-breadcrumb-first-ol {
9337
+ -ms-flex-align: start;
9338
+ align-items: flex-start;
9339
+ -ms-flex-negative: 0;
9340
+ flex-shrink: 0;
9341
+ padding-right: 0;
9342
+ }
9343
+
9344
+ .e-breadcrumb .e-breadcrumb-wrapped-ol {
9345
+ -ms-flex-wrap: wrap;
9346
+ flex-wrap: wrap;
9347
+ overflow: hidden;
9348
+ padding-left: 0;
9349
+ }
9350
+
9351
+ .e-breadcrumb.e-breadcrumb-scroll-mode {
9352
+ line-height: 26px;
9353
+ overflow: auto;
9354
+ }
9355
+
9239
9356
  .e-breadcrumb ol {
9240
9357
  -ms-flex-align: center;
9241
9358
  align-items: center;
@@ -9258,6 +9375,11 @@ ejs-sidebar {
9258
9375
  align-items: center;
9259
9376
  display: -ms-flexbox;
9260
9377
  display: flex;
9378
+ -ms-flex-negative: 0;
9379
+ flex-shrink: 0;
9380
+ }
9381
+
9382
+ .e-breadcrumb .e-breadcrumb-item .e-breadcrumb-text {
9261
9383
  padding: 4px 8px;
9262
9384
  }
9263
9385
 
@@ -9330,20 +9452,31 @@ ejs-sidebar {
9330
9452
  padding-right: 0;
9331
9453
  }
9332
9454
 
9333
- .e-breadcrumb .e-breadcrumb-collapsed {
9455
+ .e-breadcrumb .e-breadcrumb-collapsed,
9456
+ .e-breadcrumb .e-breadcrumb-menu {
9334
9457
  cursor: pointer;
9335
9458
  font-size: 16px;
9336
9459
  padding: 4px 4px;
9337
9460
  vertical-align: bottom;
9338
9461
  }
9339
9462
 
9463
+ .e-breadcrumb .e-breadcrumb-menu {
9464
+ display: inline-block;
9465
+ }
9466
+
9467
+ .e-breadcrumb .e-breadcrumb-item-wrapper {
9468
+ display: -ms-flexbox;
9469
+ display: flex;
9470
+ }
9471
+
9340
9472
  .e-breadcrumb.e-icon-right .e-breadcrumb-icon,
9341
9473
  .e-breadcrumb .e-icon-right .e-breadcrumb-icon, .e-breadcrumb.e-rtl .e-breadcrumb-icon {
9342
9474
  padding-left: 8px;
9343
9475
  padding-right: 0;
9344
9476
  }
9345
9477
 
9346
- .e-breadcrumb.e-rtl .e-icon-right {
9478
+ .e-breadcrumb.e-rtl.e-icon-right .e-breadcrumb-icon,
9479
+ .e-breadcrumb.e-rtl .e-icon-right .e-breadcrumb-icon {
9347
9480
  padding-left: 0;
9348
9481
  padding-right: 8px;
9349
9482
  }
@@ -9354,12 +9487,119 @@ ejs-sidebar {
9354
9487
 
9355
9488
  .e-breadcrumb.e-disabled .e-breadcrumb-item,
9356
9489
  .e-breadcrumb.e-disabled .e-breadcrumb-separator,
9357
- .e-breadcrumb.e-disabled .e-breadcrumb-collapsed {
9490
+ .e-breadcrumb.e-disabled .e-breadcrumb-collapsed,
9491
+ .e-breadcrumb.e-disabled .e-breadcrumb-menu {
9358
9492
  pointer-events: none;
9359
9493
  }
9360
9494
 
9361
- .e-bigger.e-breadcrumb .e-breadcrumb-item,
9362
- .e-bigger .e-breadcrumb .e-breadcrumb-item {
9495
+ .e-breadcrumb-popup {
9496
+ border: none;
9497
+ border-radius: 0;
9498
+ box-shadow: 0 8px 10px 0 rgba(0, 0, 0, 0.24);
9499
+ position: absolute;
9500
+ }
9501
+
9502
+ .e-breadcrumb-popup ul {
9503
+ margin: 0;
9504
+ padding: 0;
9505
+ }
9506
+
9507
+ .e-breadcrumb-popup .e-breadcrumb-item {
9508
+ list-style-type: none;
9509
+ white-space: nowrap;
9510
+ }
9511
+
9512
+ .e-breadcrumb-popup .e-breadcrumb-item .e-breadcrumb-text {
9513
+ -ms-flex-align: center;
9514
+ align-items: center;
9515
+ display: -ms-flexbox;
9516
+ display: flex;
9517
+ font-size: 14px;
9518
+ height: 36px;
9519
+ line-height: 36px;
9520
+ padding: 0 16px;
9521
+ width: 100%;
9522
+ }
9523
+
9524
+ .e-breadcrumb-popup .e-breadcrumb-item .e-breadcrumb-text .e-anchor-wrap {
9525
+ -ms-flex-align: inherit;
9526
+ align-items: inherit;
9527
+ display: inherit;
9528
+ width: inherit;
9529
+ }
9530
+
9531
+ .e-breadcrumb-popup .e-breadcrumb-item .e-breadcrumb-icon {
9532
+ font-size: 14px;
9533
+ padding-right: 8px;
9534
+ }
9535
+
9536
+ .e-breadcrumb-popup .e-breadcrumb-item.e-icon-item .e-breadcrumb-icon {
9537
+ padding: 0;
9538
+ }
9539
+
9540
+ .e-breadcrumb-popup .e-breadcrumb-item a.e-breadcrumb-text {
9541
+ text-decoration: none;
9542
+ }
9543
+
9544
+ .e-breadcrumb-popup.e-icon-right .e-breadcrumb-icon,
9545
+ .e-breadcrumb-popup .e-icon-right .e-breadcrumb-icon, .e-breadcrumb-popup.e-rtl .e-breadcrumb-icon {
9546
+ padding-left: 8px;
9547
+ padding-right: 0;
9548
+ }
9549
+
9550
+ .e-breadcrumb-popup.e-icon-right .e-breadcrumb-icon,
9551
+ .e-breadcrumb-popup .e-icon-right .e-breadcrumb-icon {
9552
+ display: -ms-flexbox;
9553
+ display: flex;
9554
+ -ms-flex-positive: 1;
9555
+ flex-grow: 1;
9556
+ -ms-flex-pack: end;
9557
+ justify-content: flex-end;
9558
+ }
9559
+
9560
+ .e-breadcrumb-popup.e-rtl.e-icon-right .e-breadcrumb-icon,
9561
+ .e-breadcrumb-popup.e-rtl .e-icon-right .e-breadcrumb-icon {
9562
+ padding-left: 0;
9563
+ padding-right: 8px;
9564
+ }
9565
+
9566
+ .e-bigger.e-breadcrumb-popup .e-breadcrumb-text,
9567
+ .e-bigger .e-breadcrumb-popup .e-breadcrumb-text {
9568
+ font-size: 16px;
9569
+ height: 48px;
9570
+ line-height: 48px;
9571
+ }
9572
+
9573
+ .e-bigger.e-breadcrumb-popup .e-breadcrumb-text .e-breadcrumb-icon,
9574
+ .e-bigger .e-breadcrumb-popup .e-breadcrumb-text .e-breadcrumb-icon {
9575
+ font-size: 16px;
9576
+ padding-right: 12px;
9577
+ }
9578
+
9579
+ .e-bigger.e-breadcrumb-popup .e-icon-item .e-breadcrumb-text .e-breadcrumb-icon,
9580
+ .e-bigger .e-breadcrumb-popup .e-icon-item .e-breadcrumb-text .e-breadcrumb-icon {
9581
+ padding: 0;
9582
+ }
9583
+
9584
+ .e-bigger.e-breadcrumb-popup.e-icon-right .e-breadcrumb-icon,
9585
+ .e-bigger.e-breadcrumb-popup .e-icon-right .e-breadcrumb-icon, .e-bigger.e-breadcrumb-popup.e-rtl .e-breadcrumb-icon,
9586
+ .e-bigger .e-breadcrumb-popup.e-icon-right .e-breadcrumb-icon,
9587
+ .e-bigger .e-breadcrumb-popup .e-icon-right .e-breadcrumb-icon,
9588
+ .e-bigger .e-breadcrumb-popup.e-rtl .e-breadcrumb-icon {
9589
+ padding-left: 12px;
9590
+ padding-right: 0;
9591
+ }
9592
+
9593
+ .e-bigger.e-breadcrumb-popup.e-rtl.e-icon-right .e-breadcrumb-icon,
9594
+ .e-bigger.e-breadcrumb-popup.e-rtl .e-icon-right .e-breadcrumb-icon,
9595
+ .e-bigger .e-breadcrumb-popup.e-rtl.e-icon-right .e-breadcrumb-icon,
9596
+ .e-bigger .e-breadcrumb-popup.e-rtl .e-icon-right .e-breadcrumb-icon {
9597
+ padding-left: 0;
9598
+ padding-right: 12px;
9599
+ }
9600
+
9601
+ .e-bigger.e-breadcrumb .e-breadcrumb-item .e-breadcrumb-text,
9602
+ .e-bigger .e-breadcrumb .e-breadcrumb-item .e-breadcrumb-text {
9363
9603
  padding: 4px 12px;
9364
9604
  }
9365
9605
 
@@ -9396,7 +9636,9 @@ ejs-sidebar {
9396
9636
  }
9397
9637
 
9398
9638
  .e-bigger.e-breadcrumb .e-breadcrumb-collapsed,
9399
- .e-bigger .e-breadcrumb .e-breadcrumb-collapsed {
9639
+ .e-bigger.e-breadcrumb .e-breadcrumb-menu,
9640
+ .e-bigger .e-breadcrumb .e-breadcrumb-collapsed,
9641
+ .e-bigger .e-breadcrumb .e-breadcrumb-menu {
9400
9642
  font-size: 18px;
9401
9643
  padding: 5px 5px;
9402
9644
  }
@@ -9439,12 +9681,12 @@ ejs-sidebar {
9439
9681
  color: #bdbdbd;
9440
9682
  }
9441
9683
 
9442
- .e-breadcrumb .e-breadcrumb-item.e-icon-item.e-focus {
9684
+ .e-breadcrumb .e-breadcrumb-item.e-icon-item .e-breadcrumb-text:focus {
9443
9685
  background-color: #757575;
9444
9686
  color: #bdbdbd;
9445
9687
  }
9446
9688
 
9447
- .e-breadcrumb .e-breadcrumb-item:last-child .e-breadcrumb-text {
9689
+ .e-breadcrumb .e-breadcrumb-item[data-active-item] .e-breadcrumb-text {
9448
9690
  color: white;
9449
9691
  font-weight: 500;
9450
9692
  }
@@ -9457,21 +9699,25 @@ ejs-sidebar {
9457
9699
  color: rgba(255, 255, 255, 0.54);
9458
9700
  }
9459
9701
 
9460
- .e-breadcrumb .e-breadcrumb-collapsed {
9702
+ .e-breadcrumb .e-breadcrumb-collapsed,
9703
+ .e-breadcrumb .e-breadcrumb-menu {
9461
9704
  color: #bdbdbd;
9462
9705
  }
9463
9706
 
9464
- .e-breadcrumb .e-breadcrumb-collapsed:hover {
9707
+ .e-breadcrumb .e-breadcrumb-collapsed:hover,
9708
+ .e-breadcrumb .e-breadcrumb-menu:hover {
9465
9709
  background-color: #424242;
9466
9710
  color: #bdbdbd;
9467
9711
  }
9468
9712
 
9469
- .e-breadcrumb .e-breadcrumb-collapsed:active {
9713
+ .e-breadcrumb .e-breadcrumb-collapsed:active,
9714
+ .e-breadcrumb .e-breadcrumb-menu:active {
9470
9715
  background-color: #616161;
9471
9716
  color: #bdbdbd;
9472
9717
  }
9473
9718
 
9474
- .e-breadcrumb .e-breadcrumb-collapsed:focus {
9719
+ .e-breadcrumb .e-breadcrumb-collapsed:focus,
9720
+ .e-breadcrumb .e-breadcrumb-menu:focus {
9475
9721
  background-color: #757575;
9476
9722
  color: #bdbdbd;
9477
9723
  }
@@ -9487,3 +9733,21 @@ ejs-sidebar {
9487
9733
  .e-breadcrumb.e-disabled .e-breadcrumb-separator .e-breadcrumb-icon {
9488
9734
  color: white;
9489
9735
  }
9736
+
9737
+ .e-breadcrumb-popup {
9738
+ background-color: #424242;
9739
+ }
9740
+
9741
+ .e-breadcrumb-popup .e-breadcrumb-text {
9742
+ color: #e0e0e0;
9743
+ }
9744
+
9745
+ .e-breadcrumb-popup .e-breadcrumb-text:hover {
9746
+ background-color: rgba(255, 255, 255, 0.1);
9747
+ color: #fff;
9748
+ }
9749
+
9750
+ .e-breadcrumb-popup .e-breadcrumb-item .e-breadcrumb-text:focus {
9751
+ background-color: rgba(255, 255, 255, 0.1);
9752
+ color: #fff;
9753
+ }