@syncfusion/ej2-navigations 21.1.38 → 21.2.3

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 (86) hide show
  1. package/CHANGELOG.md +30 -0
  2. package/dist/ej2-navigations.min.js +2 -2
  3. package/dist/ej2-navigations.umd.min.js +2 -2
  4. package/dist/ej2-navigations.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-navigations.es2015.js +68 -54
  6. package/dist/es6/ej2-navigations.es2015.js.map +1 -1
  7. package/dist/es6/ej2-navigations.es5.js +68 -54
  8. package/dist/es6/ej2-navigations.es5.js.map +1 -1
  9. package/dist/global/ej2-navigations.min.js +2 -2
  10. package/dist/global/ej2-navigations.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +12 -15
  13. package/src/common/h-scroll.js +1 -0
  14. package/src/common/menu-base.d.ts +1 -0
  15. package/src/common/menu-base.js +26 -20
  16. package/src/common/v-scroll.js +1 -1
  17. package/src/tab/tab.d.ts +1 -0
  18. package/src/tab/tab.js +35 -28
  19. package/src/treeview/treeview.js +5 -5
  20. package/styles/bootstrap-dark.css +35 -26
  21. package/styles/bootstrap.css +35 -26
  22. package/styles/bootstrap4.css +35 -26
  23. package/styles/bootstrap5-dark.css +44 -35
  24. package/styles/bootstrap5.css +44 -35
  25. package/styles/context-menu/_bootstrap5-definition.scss +1 -1
  26. package/styles/context-menu/bootstrap5-dark.css +4 -4
  27. package/styles/context-menu/bootstrap5.css +4 -4
  28. package/styles/fabric-dark.css +35 -26
  29. package/styles/fabric.css +35 -26
  30. package/styles/fluent-dark.css +35 -26
  31. package/styles/fluent.css +35 -26
  32. package/styles/highcontrast-light.css +35 -26
  33. package/styles/highcontrast.css +37 -27
  34. package/styles/material-dark.css +35 -26
  35. package/styles/material.css +35 -26
  36. package/styles/menu/_bootstrap5-definition.scss +1 -1
  37. package/styles/menu/bootstrap5-dark.css +5 -5
  38. package/styles/menu/bootstrap5.css +5 -5
  39. package/styles/tab/_icons.scss +0 -8
  40. package/styles/tab/bootstrap-dark.css +0 -10
  41. package/styles/tab/bootstrap.css +0 -10
  42. package/styles/tab/bootstrap4.css +0 -10
  43. package/styles/tab/bootstrap5-dark.css +0 -10
  44. package/styles/tab/bootstrap5.css +0 -10
  45. package/styles/tab/fabric-dark.css +0 -10
  46. package/styles/tab/fabric.css +0 -10
  47. package/styles/tab/fluent-dark.css +0 -10
  48. package/styles/tab/fluent.css +0 -10
  49. package/styles/tab/highcontrast-light.css +0 -10
  50. package/styles/tab/highcontrast.css +0 -10
  51. package/styles/tab/icons/_bootstrap-dark.scss +0 -8
  52. package/styles/tab/icons/_bootstrap.scss +0 -8
  53. package/styles/tab/icons/_bootstrap4.scss +0 -12
  54. package/styles/tab/icons/_bootstrap5.scss +0 -12
  55. package/styles/tab/icons/_fabric-dark.scss +0 -8
  56. package/styles/tab/icons/_fabric.scss +0 -8
  57. package/styles/tab/icons/_fluent.scss +0 -8
  58. package/styles/tab/icons/_fusionnew.scss +0 -12
  59. package/styles/tab/icons/_highcontrast-light.scss +0 -12
  60. package/styles/tab/icons/_highcontrast.scss +0 -12
  61. package/styles/tab/icons/_material-dark.scss +0 -12
  62. package/styles/tab/icons/_material.scss +0 -12
  63. package/styles/tab/icons/_material3.scss +0 -12
  64. package/styles/tab/icons/_tailwind.scss +0 -12
  65. package/styles/tab/material-dark.css +0 -10
  66. package/styles/tab/material.css +0 -10
  67. package/styles/tab/tailwind-dark.css +0 -10
  68. package/styles/tab/tailwind.css +0 -10
  69. package/styles/tailwind-dark.css +35 -26
  70. package/styles/tailwind.css +35 -26
  71. package/styles/treeview/_theme.scss +20 -10
  72. package/styles/treeview/bootstrap-dark.css +35 -16
  73. package/styles/treeview/bootstrap.css +35 -16
  74. package/styles/treeview/bootstrap4.css +35 -16
  75. package/styles/treeview/bootstrap5-dark.css +35 -16
  76. package/styles/treeview/bootstrap5.css +35 -16
  77. package/styles/treeview/fabric-dark.css +35 -16
  78. package/styles/treeview/fabric.css +35 -16
  79. package/styles/treeview/fluent-dark.css +35 -16
  80. package/styles/treeview/fluent.css +35 -16
  81. package/styles/treeview/highcontrast-light.css +35 -16
  82. package/styles/treeview/highcontrast.css +37 -17
  83. package/styles/treeview/material-dark.css +35 -16
  84. package/styles/treeview/material.css +35 -16
  85. package/styles/treeview/tailwind-dark.css +35 -16
  86. package/styles/treeview/tailwind.css +35 -16
package/styles/highcontrast-light.css CHANGED
@@ -3383,16 +3383,6 @@
3383
3383
  content: "\e7fc";
3384
3384
  position: relative;
3385
3385
  }
3386
- @media screen and (max-width: 480px) {
3387
- .e-tab .e-tab-header .e-popup-up-icon::before {
3388
- content: "\e976";
3389
- }
3390
- }
3391
- @media screen and (max-width: 480px) {
3392
- .e-tab .e-tab-header .e-popup-down-icon::before {
3393
- content: "\e976";
3394
- }
3395
- }
3396
3386
  @media screen and (max-width: 480px) {
3397
3387
  .e-tab.e-vertical-icon .e-tab-header .e-popup-up-icon::before {
3398
3388
  content: "\e85e";
@@ -7992,17 +7982,22 @@
7992
7982
  font-size: 10px;
7993
7983
  }
7994
7984
  .e-treeview .e-list-item.e-active,
7995
- .e-treeview .e-list-item.e-hover {
7985
+ .e-treeview .e-list-item.e-hover,
7986
+ .e-treeview .e-list-item.e-node-focus {
7996
7987
  background: transparent;
7997
7988
  }
7998
- .e-treeview .e-list-item.e-hover > .e-text-content {
7989
+ .e-treeview .e-list-item.e-hover > .e-text-content,
7990
+ .e-treeview .e-list-item.e-node-focus > .e-text-content {
7999
7991
  color: #000;
8000
7992
  }
8001
- .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text {
7993
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text,
7994
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-list-text {
8002
7995
  color: #000;
8003
7996
  }
8004
7997
  .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-collapsible,
8005
- .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable {
7998
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable,
7999
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-collapsible,
8000
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-expandable {
8006
8001
  color: #000;
8007
8002
  }
8008
8003
  .e-treeview .e-list-item.e-active > .e-text-content {
@@ -8015,31 +8010,40 @@
8015
8010
  .e-treeview .e-list-item.e-active > .e-text-content .e-icon-expandable {
8016
8011
  color: #fff;
8017
8012
  }
8018
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content {
8013
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content,
8014
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content {
8019
8015
  color: #fff;
8020
8016
  }
8021
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text {
8017
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text,
8018
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-list-text {
8022
8019
  color: #fff;
8023
8020
  }
8024
8021
  .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-collapsible,
8025
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable {
8022
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable,
8023
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-collapsible,
8024
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-expandable {
8026
8025
  color: #fff;
8027
8026
  }
8028
8027
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content,
8029
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content {
8028
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content,
8029
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content {
8030
8030
  color: #000;
8031
8031
  }
8032
8032
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-list-text,
8033
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text {
8033
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text,
8034
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-list-text {
8034
8035
  color: #000;
8035
8036
  }
8036
8037
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-collapsible,
8037
8038
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-expandable,
8038
8039
  .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-collapsible,
8039
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable {
8040
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable,
8041
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-collapsible,
8042
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-expandable {
8040
8043
  color: #000;
8041
8044
  }
8042
- .e-treeview .e-list-item.e-hover > .e-fullrow {
8045
+ .e-treeview .e-list-item.e-hover > .e-fullrow,
8046
+ .e-treeview .e-list-item.e-node-focus > .e-fullrow {
8043
8047
  background-color: #ecf;
8044
8048
  border-color: #000;
8045
8049
  }
@@ -8057,12 +8061,14 @@
8057
8061
  .e-treeview .e-list-item.e-active.e-animation-active > .e-text-content .e-list-text {
8058
8062
  color: #000;
8059
8063
  }
8060
- .e-treeview .e-list-item.e-active.e-hover > .e-fullrow {
8064
+ .e-treeview .e-list-item.e-active.e-hover > .e-fullrow,
8065
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
8061
8066
  background-color: #400074;
8062
8067
  border-color: #000;
8063
8068
  }
8064
8069
  .e-treeview .e-list-item.e-editing.e-active > .e-fullrow,
8065
- .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow {
8070
+ .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow,
8071
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-fullrow {
8066
8072
  background-color: transparent;
8067
8073
  border-color: transparent;
8068
8074
  }
@@ -8094,7 +8100,8 @@
8094
8100
  .e-treeview .e-popup .e-downtail::after {
8095
8101
  border-top-color: #ecf;
8096
8102
  }
8097
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content {
8103
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content,
8104
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-node-focus > .e-text-content {
8098
8105
  background-color: #ecf;
8099
8106
  border-color: #000;
8100
8107
  }
@@ -8102,12 +8109,14 @@
8102
8109
  background-color: #400074;
8103
8110
  border-color: #400074;
8104
8111
  }
8105
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content {
8112
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content,
8113
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-node-focus > .e-text-content {
8106
8114
  background-color: #400074;
8107
8115
  border-color: #000;
8108
8116
  }
8109
8117
  .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-active > .e-text-content,
8110
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content {
8118
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content,
8119
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-node-focus > .e-text-content {
8111
8120
  background-color: transparent;
8112
8121
  border-color: transparent;
8113
8122
  }
package/styles/highcontrast.css CHANGED
@@ -3398,16 +3398,6 @@
3398
3398
  content: "\e7fc";
3399
3399
  position: relative;
3400
3400
  }
3401
- @media screen and (max-width: 480px) {
3402
- .e-tab .e-tab-header .e-popup-up-icon::before {
3403
- content: "\e976";
3404
- }
3405
- }
3406
- @media screen and (max-width: 480px) {
3407
- .e-tab .e-tab-header .e-popup-down-icon::before {
3408
- content: "\e976";
3409
- }
3410
- }
3411
3401
  @media screen and (max-width: 480px) {
3412
3402
  .e-tab.e-vertical-icon .e-tab-header .e-popup-up-icon::before {
3413
3403
  content: "\e85e";
@@ -8011,17 +8001,22 @@
8011
8001
  font-size: 10px;
8012
8002
  }
8013
8003
  .e-treeview .e-list-item.e-active,
8014
- .e-treeview .e-list-item.e-hover {
8004
+ .e-treeview .e-list-item.e-hover,
8005
+ .e-treeview .e-list-item.e-node-focus {
8015
8006
  background: transparent;
8016
8007
  }
8017
- .e-treeview .e-list-item.e-hover > .e-text-content {
8008
+ .e-treeview .e-list-item.e-hover > .e-text-content,
8009
+ .e-treeview .e-list-item.e-node-focus > .e-text-content {
8018
8010
  color: #fff;
8019
8011
  }
8020
- .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text {
8012
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text,
8013
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-list-text {
8021
8014
  color: #fff;
8022
8015
  }
8023
8016
  .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-collapsible,
8024
- .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable {
8017
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable,
8018
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-collapsible,
8019
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-expandable {
8025
8020
  color: #fff;
8026
8021
  }
8027
8022
  .e-treeview .e-list-item.e-active > .e-text-content {
@@ -8040,35 +8035,45 @@
8040
8035
  border-color: #000;
8041
8036
  color: #ffd939;
8042
8037
  }
8043
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content {
8038
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content,
8039
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content {
8044
8040
  color: #000;
8045
8041
  }
8046
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text {
8042
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text,
8043
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-list-text {
8047
8044
  color: #000;
8048
8045
  }
8049
8046
  .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-collapsible,
8050
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable {
8047
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable,
8048
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-collapsible,
8049
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-expandable {
8051
8050
  color: #000;
8052
8051
  }
8053
8052
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content,
8054
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content {
8053
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content,
8054
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content {
8055
8055
  color: #fff;
8056
8056
  }
8057
8057
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-list-text,
8058
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text {
8058
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text,
8059
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-list-text {
8059
8060
  color: #fff;
8060
8061
  }
8061
8062
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-list-text .e-input,
8062
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text .e-input {
8063
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text .e-input,
8064
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-list-text .e-input {
8063
8065
  font-weight: 600;
8064
8066
  }
8065
8067
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-collapsible,
8066
8068
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-expandable,
8067
8069
  .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-collapsible,
8068
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable {
8070
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable,
8071
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-collapsible,
8072
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-expandable {
8069
8073
  color: #fff;
8070
8074
  }
8071
- .e-treeview .e-list-item.e-hover > .e-fullrow {
8075
+ .e-treeview .e-list-item.e-hover > .e-fullrow,
8076
+ .e-treeview .e-list-item.e-node-focus > .e-fullrow {
8072
8077
  background-color: #685708;
8073
8078
  border-color: #fff;
8074
8079
  }
@@ -8086,13 +8091,15 @@
8086
8091
  .e-treeview .e-list-item.e-active.e-animation-active > .e-text-content .e-list-text {
8087
8092
  color: #fff;
8088
8093
  }
8089
- .e-treeview .e-list-item.e-active.e-hover > .e-fullrow {
8094
+ .e-treeview .e-list-item.e-active.e-hover > .e-fullrow,
8095
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
8090
8096
  background-color: #ffd939;
8091
8097
  border-color: #fff;
8092
8098
  box-shadow: 0 -1px 2px #fff, 0 1px 2px #fff;
8093
8099
  }
8094
8100
  .e-treeview .e-list-item.e-editing.e-active > .e-fullrow,
8095
- .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow {
8101
+ .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow,
8102
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-fullrow {
8096
8103
  background-color: transparent;
8097
8104
  border-color: transparent;
8098
8105
  }
@@ -8124,7 +8131,8 @@
8124
8131
  .e-treeview .e-popup .e-downtail::after {
8125
8132
  border-top-color: #685708;
8126
8133
  }
8127
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content {
8134
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content,
8135
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-node-focus > .e-text-content {
8128
8136
  background-color: #685708;
8129
8137
  border-color: #fff;
8130
8138
  }
@@ -8132,13 +8140,15 @@
8132
8140
  background-color: #ffd939;
8133
8141
  border-color: #ffd939;
8134
8142
  }
8135
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content {
8143
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content,
8144
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-node-focus > .e-text-content {
8136
8145
  background-color: #ffd939;
8137
8146
  border-color: #fff;
8138
8147
  box-shadow: 0 -1px 2px #fff, 0 1px 2px #fff;
8139
8148
  }
8140
8149
  .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-active > .e-text-content,
8141
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content {
8150
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content,
8151
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-node-focus > .e-text-content {
8142
8152
  background-color: transparent;
8143
8153
  border-color: transparent;
8144
8154
  }
package/styles/material-dark.css CHANGED
@@ -3507,16 +3507,6 @@
3507
3507
  content: "\e7fc";
3508
3508
  position: relative;
3509
3509
  }
3510
- @media screen and (max-width: 480px) {
3511
- .e-tab .e-tab-header .e-popup-up-icon::before {
3512
- content: "\e984";
3513
- }
3514
- }
3515
- @media screen and (max-width: 480px) {
3516
- .e-tab .e-tab-header .e-popup-down-icon::before {
3517
- content: "\e984";
3518
- }
3519
- }
3520
3510
  @media screen and (max-width: 480px) {
3521
3511
  .e-tab.e-vertical-icon .e-tab-header .e-popup-up-icon::before {
3522
3512
  content: "\e82a";
@@ -8122,17 +8112,22 @@
8122
8112
  font-size: 10px;
8123
8113
  }
8124
8114
  .e-treeview .e-list-item.e-active,
8125
- .e-treeview .e-list-item.e-hover {
8115
+ .e-treeview .e-list-item.e-hover,
8116
+ .e-treeview .e-list-item.e-node-focus {
8126
8117
  background: transparent;
8127
8118
  }
8128
- .e-treeview .e-list-item.e-hover > .e-text-content {
8119
+ .e-treeview .e-list-item.e-hover > .e-text-content,
8120
+ .e-treeview .e-list-item.e-node-focus > .e-text-content {
8129
8121
  color: #fff;
8130
8122
  }
8131
- .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text {
8123
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text,
8124
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-list-text {
8132
8125
  color: #fff;
8133
8126
  }
8134
8127
  .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-collapsible,
8135
- .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable {
8128
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable,
8129
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-collapsible,
8130
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-expandable {
8136
8131
  color: rgba(255, 255, 255, 0.7);
8137
8132
  }
8138
8133
  .e-treeview .e-list-item.e-active > .e-text-content {
@@ -8145,31 +8140,40 @@
8145
8140
  .e-treeview .e-list-item.e-active > .e-text-content .e-icon-expandable {
8146
8141
  color: rgba(255, 255, 255, 0.7);
8147
8142
  }
8148
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content {
8143
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content,
8144
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content {
8149
8145
  color: #00b0ff;
8150
8146
  }
8151
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text {
8147
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text,
8148
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-list-text {
8152
8149
  color: #00b0ff;
8153
8150
  }
8154
8151
  .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-collapsible,
8155
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable {
8152
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable,
8153
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-collapsible,
8154
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-expandable {
8156
8155
  color: rgba(255, 255, 255, 0.7);
8157
8156
  }
8158
8157
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content,
8159
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content {
8158
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content,
8159
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content {
8160
8160
  color: #fff;
8161
8161
  }
8162
8162
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-list-text,
8163
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text {
8163
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text,
8164
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-list-text {
8164
8165
  color: #fff;
8165
8166
  }
8166
8167
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-collapsible,
8167
8168
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-expandable,
8168
8169
  .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-collapsible,
8169
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable {
8170
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable,
8171
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-collapsible,
8172
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-expandable {
8170
8173
  color: rgba(255, 255, 255, 0.7);
8171
8174
  }
8172
- .e-treeview .e-list-item.e-hover > .e-fullrow {
8175
+ .e-treeview .e-list-item.e-hover > .e-fullrow,
8176
+ .e-treeview .e-list-item.e-node-focus > .e-fullrow {
8173
8177
  background-color: rgba(255, 255, 255, 0.1);
8174
8178
  border-color: transparent;
8175
8179
  }
@@ -8187,12 +8191,14 @@
8187
8191
  .e-treeview .e-list-item.e-active.e-animation-active > .e-text-content .e-list-text {
8188
8192
  color: #fff;
8189
8193
  }
8190
- .e-treeview .e-list-item.e-active.e-hover > .e-fullrow {
8194
+ .e-treeview .e-list-item.e-active.e-hover > .e-fullrow,
8195
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
8191
8196
  background-color: rgba(255, 255, 255, 0.18);
8192
8197
  border-color: transparent;
8193
8198
  }
8194
8199
  .e-treeview .e-list-item.e-editing.e-active > .e-fullrow,
8195
- .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow {
8200
+ .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow,
8201
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-fullrow {
8196
8202
  background-color: transparent;
8197
8203
  border-color: transparent;
8198
8204
  }
@@ -8224,7 +8230,8 @@
8224
8230
  .e-treeview .e-popup .e-downtail::after {
8225
8231
  border-top-color: #616161;
8226
8232
  }
8227
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content {
8233
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content,
8234
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-node-focus > .e-text-content {
8228
8235
  background-color: rgba(255, 255, 255, 0.1);
8229
8236
  border-color: transparent;
8230
8237
  }
@@ -8232,12 +8239,14 @@
8232
8239
  background-color: rgba(255, 255, 255, 0.18);
8233
8240
  border-color: transparent;
8234
8241
  }
8235
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content {
8242
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content,
8243
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-node-focus > .e-text-content {
8236
8244
  background-color: rgba(255, 255, 255, 0.18);
8237
8245
  border-color: transparent;
8238
8246
  }
8239
8247
  .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-active > .e-text-content,
8240
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content {
8248
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content,
8249
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-node-focus > .e-text-content {
8241
8250
  background-color: transparent;
8242
8251
  border-color: transparent;
8243
8252
  }
package/styles/material.css CHANGED
@@ -3521,16 +3521,6 @@
3521
3521
  content: "\e7fc";
3522
3522
  position: relative;
3523
3523
  }
3524
- @media screen and (max-width: 480px) {
3525
- .e-tab .e-tab-header .e-popup-up-icon::before {
3526
- content: "\e984";
3527
- }
3528
- }
3529
- @media screen and (max-width: 480px) {
3530
- .e-tab .e-tab-header .e-popup-down-icon::before {
3531
- content: "\e984";
3532
- }
3533
- }
3534
3524
  @media screen and (max-width: 480px) {
3535
3525
  .e-tab.e-vertical-icon .e-tab-header .e-popup-up-icon::before {
3536
3526
  content: "\e82a";
@@ -8140,17 +8130,22 @@
8140
8130
  font-size: 10px;
8141
8131
  }
8142
8132
  .e-treeview .e-list-item.e-active,
8143
- .e-treeview .e-list-item.e-hover {
8133
+ .e-treeview .e-list-item.e-hover,
8134
+ .e-treeview .e-list-item.e-node-focus {
8144
8135
  background: transparent;
8145
8136
  }
8146
- .e-treeview .e-list-item.e-hover > .e-text-content {
8137
+ .e-treeview .e-list-item.e-hover > .e-text-content,
8138
+ .e-treeview .e-list-item.e-node-focus > .e-text-content {
8147
8139
  color: rgba(0, 0, 0, 0.87);
8148
8140
  }
8149
- .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text {
8141
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text,
8142
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-list-text {
8150
8143
  color: rgba(0, 0, 0, 0.87);
8151
8144
  }
8152
8145
  .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-collapsible,
8153
- .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable {
8146
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable,
8147
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-collapsible,
8148
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-expandable {
8154
8149
  color: rgba(0, 0, 0, 0.54);
8155
8150
  }
8156
8151
  .e-treeview .e-list-item.e-active > .e-text-content {
@@ -8163,31 +8158,40 @@
8163
8158
  .e-treeview .e-list-item.e-active > .e-text-content .e-icon-expandable {
8164
8159
  color: rgba(0, 0, 0, 0.54);
8165
8160
  }
8166
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content {
8161
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content,
8162
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content {
8167
8163
  color: #e3165b;
8168
8164
  }
8169
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text {
8165
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text,
8166
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-list-text {
8170
8167
  color: #e3165b;
8171
8168
  }
8172
8169
  .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-collapsible,
8173
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable {
8170
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable,
8171
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-collapsible,
8172
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-expandable {
8174
8173
  color: rgba(0, 0, 0, 0.54);
8175
8174
  }
8176
8175
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content,
8177
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content {
8176
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content,
8177
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content {
8178
8178
  color: rgba(0, 0, 0, 0.87);
8179
8179
  }
8180
8180
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-list-text,
8181
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text {
8181
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text,
8182
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-list-text {
8182
8183
  color: rgba(0, 0, 0, 0.87);
8183
8184
  }
8184
8185
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-collapsible,
8185
8186
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-expandable,
8186
8187
  .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-collapsible,
8187
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable {
8188
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable,
8189
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-collapsible,
8190
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-expandable {
8188
8191
  color: rgba(0, 0, 0, 0.54);
8189
8192
  }
8190
- .e-treeview .e-list-item.e-hover > .e-fullrow {
8193
+ .e-treeview .e-list-item.e-hover > .e-fullrow,
8194
+ .e-treeview .e-list-item.e-node-focus > .e-fullrow {
8191
8195
  background-color: #f5f5f5;
8192
8196
  border-color: #f5f5f5;
8193
8197
  }
@@ -8205,12 +8209,14 @@
8205
8209
  .e-treeview .e-list-item.e-active.e-animation-active > .e-text-content .e-list-text {
8206
8210
  color: rgba(0, 0, 0, 0.87);
8207
8211
  }
8208
- .e-treeview .e-list-item.e-active.e-hover > .e-fullrow {
8212
+ .e-treeview .e-list-item.e-active.e-hover > .e-fullrow,
8213
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
8209
8214
  background-color: #e0e0e0;
8210
8215
  border-color: #e0e0e0;
8211
8216
  }
8212
8217
  .e-treeview .e-list-item.e-editing.e-active > .e-fullrow,
8213
- .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow {
8218
+ .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow,
8219
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-fullrow {
8214
8220
  background-color: transparent;
8215
8221
  border-color: transparent;
8216
8222
  }
@@ -8241,7 +8247,8 @@
8241
8247
  .e-treeview .e-popup .e-downtail::after {
8242
8248
  border-top-color: #fff;
8243
8249
  }
8244
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content {
8250
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content,
8251
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-node-focus > .e-text-content {
8245
8252
  background-color: #f5f5f5;
8246
8253
  border-color: #f5f5f5;
8247
8254
  }
@@ -8249,12 +8256,14 @@
8249
8256
  background-color: #eee;
8250
8257
  border-color: #eee;
8251
8258
  }
8252
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content {
8259
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content,
8260
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-node-focus > .e-text-content {
8253
8261
  background-color: #e0e0e0;
8254
8262
  border-color: #e0e0e0;
8255
8263
  }
8256
8264
  .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-active > .e-text-content,
8257
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content {
8265
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content,
8266
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-node-focus > .e-text-content {
8258
8267
  background-color: transparent;
8259
8268
  border-color: transparent;
8260
8269
  }
package/styles/menu/_bootstrap5-definition.scss CHANGED
@@ -59,7 +59,7 @@ $menu-ul-border: none !default;
59
59
  $menu-li-hover-outline: 0 solid $menu-li-border-color !default;
60
60
  $menu-srollbar-ul-border: none !default;
61
61
  $submenu-caret-font-size: $menu-caret-font-size !default;
62
- $submenu-bigger-caret-font-size: $submenu-caret-font-size !default;
62
+ $submenu-bigger-caret-font-size: $text-base !default;
63
63
  $submenu-color: $content-text-color !default;
64
64
  $menu-icon-color: $icon-color !default;
65
65
  $menu-icon-hover-color: $content-text-color !default;
package/styles/menu/bootstrap5-dark.css CHANGED
@@ -525,8 +525,8 @@
525
525
  .e-bigger.e-menu-wrapper ul.e-ul .e-menu-item,
526
526
  .e-bigger .e-menu-container ul.e-ul .e-menu-item,
527
527
  .e-bigger.e-menu-container ul.e-ul .e-menu-item {
528
- height: 32px;
529
- line-height: 32px;
528
+ height: 36px;
529
+ line-height: 36px;
530
530
  padding: 0 12px;
531
531
  }
532
532
  .e-bigger .e-menu-wrapper ul.e-ul .e-menu-item .e-menu-icon,
@@ -534,13 +534,13 @@
534
534
  .e-bigger .e-menu-container ul.e-ul .e-menu-item .e-menu-icon,
535
535
  .e-bigger.e-menu-container ul.e-ul .e-menu-item .e-menu-icon {
536
536
  font-size: 22px;
537
- line-height: 32px;
537
+ line-height: 36px;
538
538
  }
539
539
  .e-bigger .e-menu-wrapper ul.e-ul .e-menu-item .e-caret,
540
540
  .e-bigger.e-menu-wrapper ul.e-ul .e-menu-item .e-caret,
541
541
  .e-bigger .e-menu-container ul.e-ul .e-menu-item .e-caret,
542
542
  .e-bigger.e-menu-container ul.e-ul .e-menu-item .e-caret {
543
- line-height: 32px;
543
+ line-height: 36px;
544
544
  }
545
545
  .e-bigger .e-menu-wrapper ul.e-ul .e-menu-item.e-separator,
546
546
  .e-bigger.e-menu-wrapper ul.e-ul .e-menu-item.e-separator,
@@ -553,7 +553,7 @@
553
553
  .e-bigger.e-menu-wrapper ul.e-ul .e-menu-item .e-caret,
554
554
  .e-bigger .e-menu-container ul.e-ul .e-menu-item .e-caret,
555
555
  .e-bigger.e-menu-container ul.e-ul .e-menu-item .e-caret {
556
- font-size: 14px;
556
+ font-size: 16px;
557
557
  right: 7px;
558
558
  }
559
559
  .e-bigger .e-menu-wrapper ul.e-ul .e-menu-item.e-menu-caret-icon,
package/styles/menu/bootstrap5.css CHANGED
@@ -525,8 +525,8 @@
525
525
  .e-bigger.e-menu-wrapper ul.e-ul .e-menu-item,
526
526
  .e-bigger .e-menu-container ul.e-ul .e-menu-item,
527
527
  .e-bigger.e-menu-container ul.e-ul .e-menu-item {
528
- height: 32px;
529
- line-height: 32px;
528
+ height: 36px;
529
+ line-height: 36px;
530
530
  padding: 0 12px;
531
531
  }
532
532
  .e-bigger .e-menu-wrapper ul.e-ul .e-menu-item .e-menu-icon,
@@ -534,13 +534,13 @@
534
534
  .e-bigger .e-menu-container ul.e-ul .e-menu-item .e-menu-icon,
535
535
  .e-bigger.e-menu-container ul.e-ul .e-menu-item .e-menu-icon {
536
536
  font-size: 22px;
537
- line-height: 32px;
537
+ line-height: 36px;
538
538
  }
539
539
  .e-bigger .e-menu-wrapper ul.e-ul .e-menu-item .e-caret,
540
540
  .e-bigger.e-menu-wrapper ul.e-ul .e-menu-item .e-caret,
541
541
  .e-bigger .e-menu-container ul.e-ul .e-menu-item .e-caret,
542
542
  .e-bigger.e-menu-container ul.e-ul .e-menu-item .e-caret {
543
- line-height: 32px;
543
+ line-height: 36px;
544
544
  }
545
545
  .e-bigger .e-menu-wrapper ul.e-ul .e-menu-item.e-separator,
546
546
  .e-bigger.e-menu-wrapper ul.e-ul .e-menu-item.e-separator,
@@ -553,7 +553,7 @@
553
553
  .e-bigger.e-menu-wrapper ul.e-ul .e-menu-item .e-caret,
554
554
  .e-bigger .e-menu-container ul.e-ul .e-menu-item .e-caret,
555
555
  .e-bigger.e-menu-container ul.e-ul .e-menu-item .e-caret {
556
- font-size: 14px;
556
+ font-size: 16px;
557
557
  right: 7px;
558
558
  }
559
559
  .e-bigger .e-menu-wrapper ul.e-ul .e-menu-item.e-menu-caret-icon,
package/styles/tab/_icons.scss CHANGED
@@ -12,18 +12,10 @@
12
12
 
13
13
  .e-popup-up-icon::before {
14
14
  content: $tab-pop-up-icon;
15
-
16
- @media screen and (max-width: 480px) {
17
- content: $tab-mob-pop-up-icon;
18
- }
19
15
  }
20
16
 
21
17
  .e-popup-down-icon::before {
22
18
  content: $tab-pop-down-icon;
23
-
24
- @media screen and (max-width: 480px) {
25
- content: $tab-mob-pop-down-icon;
26
- }
27
19
  }
28
20
  }
29
21
 
package/styles/tab/bootstrap-dark.css CHANGED
@@ -6,19 +6,9 @@
6
6
  .e-tab .e-tab-header .e-popup-up-icon::before {
7
7
  content: "\e988";
8
8
  }
9
- @media screen and (max-width: 480px) {
10
- .e-tab .e-tab-header .e-popup-up-icon::before {
11
- content: "\e936";
12
- }
13
- }
14
9
  .e-tab .e-tab-header .e-popup-down-icon::before {
15
10
  content: "\e968";
16
11
  }
17
- @media screen and (max-width: 480px) {
18
- .e-tab .e-tab-header .e-popup-down-icon::before {
19
- content: "\e936";
20
- }
21
- }
22
12
  @media screen and (max-width: 480px) {
23
13
  .e-tab.e-vertical-icon .e-tab-header .e-popup-up-icon::before {
24
14
  content: "\e918";