@kdcloudjs/kdesign 1.3.2 → 1.3.5

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 (80) hide show
  1. package/CHANGELOG.md +43 -1
  2. package/dist/kdesign-complete.less +176 -107
  3. package/dist/kdesign.css +161 -77
  4. package/dist/kdesign.css.map +1 -1
  5. package/dist/kdesign.js +3776 -2037
  6. package/dist/kdesign.js.map +1 -1
  7. package/dist/kdesign.min.css +3 -3
  8. package/dist/kdesign.min.js +8 -8
  9. package/dist/kdesign.min.js.map +1 -1
  10. package/es/_utils/usePopper.d.ts +1 -0
  11. package/es/_utils/usePopper.js +29 -25
  12. package/es/anchor/anchor.js +20 -1
  13. package/es/base-data/style/index.css +1 -0
  14. package/es/base-data/style/index.less +1 -0
  15. package/es/button/group.js +2 -1
  16. package/es/button/style/index.css +20 -19
  17. package/es/button/style/index.less +29 -27
  18. package/es/button/style/token.less +4 -4
  19. package/es/checkbox/checkbox.js +20 -12
  20. package/es/config-provider/compDefaultProps.d.ts +0 -1
  21. package/es/config-provider/compDefaultProps.js +1 -2
  22. package/es/form/Field.js +7 -6
  23. package/es/form/Form.d.ts +1 -0
  24. package/es/form/Form.js +3 -1
  25. package/es/form/interface.d.ts +1 -0
  26. package/es/menu/menu.d.ts +1 -1
  27. package/es/menu/menu.js +55 -22
  28. package/es/menu/menuItem.d.ts +1 -0
  29. package/es/menu/menuItem.js +14 -10
  30. package/es/menu/style/index.css +139 -53
  31. package/es/menu/style/index.less +101 -69
  32. package/es/menu/style/mixin.less +33 -1
  33. package/es/menu/style/token.less +4 -2
  34. package/es/menu/subMenu.d.ts +1 -1
  35. package/es/menu/subMenu.js +126 -119
  36. package/es/radio/radio.d.ts +1 -1
  37. package/es/radio/radio.js +18 -11
  38. package/es/select/select.js +33 -20
  39. package/es/style/core/reset.less +4 -4
  40. package/es/style/index.css +0 -4
  41. package/es/table/feature/useRangeSelection.d.ts +3 -0
  42. package/es/table/feature/useRangeSelection.js +10 -0
  43. package/es/table/interface.d.ts +15 -2
  44. package/es/table/table.js +14 -7
  45. package/lib/_utils/usePopper.d.ts +1 -0
  46. package/lib/_utils/usePopper.js +29 -25
  47. package/lib/anchor/anchor.js +20 -1
  48. package/lib/base-data/style/index.css +1 -0
  49. package/lib/base-data/style/index.less +1 -0
  50. package/lib/button/group.js +2 -1
  51. package/lib/button/style/index.css +20 -19
  52. package/lib/button/style/index.less +29 -27
  53. package/lib/button/style/token.less +4 -4
  54. package/lib/checkbox/checkbox.js +19 -11
  55. package/lib/config-provider/compDefaultProps.d.ts +0 -1
  56. package/lib/config-provider/compDefaultProps.js +1 -2
  57. package/lib/form/Field.js +7 -6
  58. package/lib/form/Form.d.ts +1 -0
  59. package/lib/form/Form.js +3 -1
  60. package/lib/form/interface.d.ts +1 -0
  61. package/lib/menu/menu.d.ts +1 -1
  62. package/lib/menu/menu.js +61 -26
  63. package/lib/menu/menuItem.d.ts +1 -0
  64. package/lib/menu/menuItem.js +16 -10
  65. package/lib/menu/style/index.css +139 -53
  66. package/lib/menu/style/index.less +101 -69
  67. package/lib/menu/style/mixin.less +33 -1
  68. package/lib/menu/style/token.less +4 -2
  69. package/lib/menu/subMenu.d.ts +1 -1
  70. package/lib/menu/subMenu.js +145 -142
  71. package/lib/radio/radio.d.ts +1 -1
  72. package/lib/radio/radio.js +30 -20
  73. package/lib/select/select.js +33 -20
  74. package/lib/style/core/reset.less +4 -4
  75. package/lib/style/index.css +0 -4
  76. package/lib/table/feature/useRangeSelection.d.ts +3 -0
  77. package/lib/table/feature/useRangeSelection.js +21 -0
  78. package/lib/table/interface.d.ts +15 -2
  79. package/lib/table/table.js +15 -7
  80. package/package.json +2 -2
package/dist/kdesign.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /*!
2
2
  *
3
- * @kdcloudjs/kdesign v1.3.1
3
+ * @kdcloudjs/kdesign v1.3.4
4
4
  *
5
5
  * Copyright 2020-present, Kingdee, Inc.
6
6
  * All rights reserved.
@@ -2014,10 +2014,6 @@ template {
2014
2014
  /**
2015
2015
  * Reset scrollbar style
2016
2016
  */
2017
- ::-webkit-scrollbar {
2018
- width: 10px !important;
2019
- height: 10px !important;
2020
- }
2021
2017
  ::-webkit-scrollbar-button {
2022
2018
  width: 0;
2023
2019
  height: 0;
@@ -3241,6 +3237,7 @@ template {
3241
3237
  }
3242
3238
  .kd-baseData-dropdown-options {
3243
3239
  height: var(--kd-c-base-data-dropdown-options-sizing-height, 32px);
3240
+ cursor: pointer;
3244
3241
  }
3245
3242
  .kd-baseData-dropdown-options:hover {
3246
3243
  background: var(--kd-c-base-data-color-background-hover, var(--kd-g-color-hover, #f5f5f5));
@@ -3668,35 +3665,36 @@ template {
3668
3665
  .kd-btn-group-basic-icon {
3669
3666
  margin-left: 4px;
3670
3667
  }
3671
- .kd-btn-group-trigger .kd-btn-primary {
3672
- background: var(--kd-c-button-group-trigger-color-background, #4367c1);
3668
+ .kd-btn-group-similar .kd-btn-group-trigger .kd-btn {
3669
+ border-top-left-radius: 0;
3670
+ border-bottom-left-radius: 0;
3671
+ margin-left: -1px;
3673
3672
  }
3674
- .kd-btn-group-trigger .kd-btn-primary:hover {
3675
- background: var(--kd-c-button-group-trigger-color-background-hover, #4c74da);
3676
- border-color: var(--kd-c-button-group-trigger-color-background-hover, #4c74da);
3673
+ .kd-btn-group-similar .kd-btn-group-trigger .kd-btn-primary {
3674
+ background: var(--kd-c-button-group-trigger-color-background, var(--kd-g-color-theme-7, #375cca));
3677
3675
  }
3678
- .kd-btn-group-trigger .kd-btn-primary:active {
3679
- background: var(--kd-c-button-group-trigger-color-background-active, #3B5AA9);
3676
+ .kd-btn-group-similar .kd-btn-group-trigger .kd-btn-primary:hover {
3677
+ background: var(--kd-c-button-group-trigger-color-background-hover, var(--kd-g-color-theme-6, #5582f3));
3678
+ border-color: var(--kd-c-button-group-trigger-color-background-hover, var(--kd-g-color-theme-6, #5582f3));
3680
3679
  }
3681
- .kd-btn-group-trigger .kd-btn-primary:disabled {
3682
- background: var(--kd-c-button-group-trigger-color-background-disabled, #95a4c8) !important;
3680
+ .kd-btn-group-similar .kd-btn-group-trigger .kd-btn-primary:active {
3681
+ background: var(--kd-c-button-group-trigger-color-background-active, var(--kd-g-color-theme-8, #1f3ba1));
3683
3682
  }
3684
- .kd-btn-group-trigger .kd-btn {
3685
- margin-left: -1px;
3683
+ .kd-btn-group-similar .kd-btn-group-trigger .kd-btn-primary:disabled {
3684
+ background: var(--kd-c-button-group-trigger-color-background-disabled, var(--kd-g-color-theme-5, #87adff)) !important;
3685
+ }
3686
+ .kd-btn-group-similar > .kd-btn:first-child {
3687
+ border-top-right-radius: 0;
3688
+ border-bottom-right-radius: 0;
3689
+ }
3690
+ .kd-btn-group-similar > .kd-btn:first-child:hover {
3691
+ z-index: 1;
3686
3692
  }
3687
3693
  .kd-btn-group .kd-btn-size-small,
3688
3694
  .kd-btn-group .kd-btn-size-middle,
3689
3695
  .kd-btn-group .kd-btn-size-large {
3690
3696
  min-width: unset;
3691
3697
  }
3692
- .kd-btn-group .kd-btn:first-child {
3693
- border-top-right-radius: 0;
3694
- border-bottom-right-radius: 0;
3695
- }
3696
- .kd-btn-group .kd-btn:last-child {
3697
- border-top-left-radius: 0;
3698
- border-bottom-left-radius: 0;
3699
- }
3700
3698
  .kd-btn-group .kd-dropdown-menu {
3701
3699
  padding: 0;
3702
3700
  }
@@ -9884,13 +9882,37 @@ textarea {
9884
9882
  color: var(--kd-c-menu-sub-color-text-hover, var(--kd-g-color-white, #fff));
9885
9883
  }
9886
9884
  .light-hover {
9887
- background-color: var(--kd-c-menu-light-color-background, var(--kd-g-color-background-ongoing, #f2f9ff));
9888
- color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-ongoing, #276ff5));
9885
+ background-color: var(--kd-c-menu-light-color-background-hover, #f5f5f5);
9886
+ color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-text-primary, #212121));
9887
+ }
9888
+ .light-active {
9889
+ background-color: var(--kd-c-menu-light-color-background-active, #e3ebff);
9890
+ color: var(--kd-c-menu-light-color-text-active, var(--kd-g-color-theme, #5582f3));
9889
9891
  }
9890
9892
  .light-default {
9891
9893
  color: var(--kd-c-menu-light-color-text, var(--kd-g-color-text-primary, #212121));
9892
9894
  background: #ffffff;
9893
9895
  }
9896
+ .light {
9897
+ color: var(--kd-c-menu-light-color-text, var(--kd-g-color-text-primary, #212121));
9898
+ background: #ffffff;
9899
+ }
9900
+ .light .kd-menu-submenu-hover,
9901
+ .light .kd-menu-submenu-sub {
9902
+ color: var(--kd-c-menu-light-color-text, var(--kd-g-color-text-primary, #212121));
9903
+ background: #ffffff;
9904
+ }
9905
+ .light .kd-menu-submenu-title:hover {
9906
+ color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-text-primary, #212121));
9907
+ }
9908
+ .light .kd-menu-submenu:not(.kd-menu-submenu-disabled):hover {
9909
+ background-color: var(--kd-c-menu-light-color-background-hover, #f5f5f5);
9910
+ color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-text-primary, #212121));
9911
+ }
9912
+ .light .kd-menu-item:not(.kd-menu-item-disabled):hover {
9913
+ background-color: var(--kd-c-menu-light-color-background-hover, #f5f5f5);
9914
+ color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-text-primary, #212121));
9915
+ }
9894
9916
  .kd-menu {
9895
9917
  position: relative;
9896
9918
  width: 100%;
@@ -9913,50 +9935,15 @@ textarea {
9913
9935
  .kd-menu-inline .kd-menu-submenu:not(.kd-menu-submenu-disabled):hover {
9914
9936
  color: var(--kd-c-menu-inline-color-active, var(--kd-g-color-white, #fff));
9915
9937
  }
9938
+ .kd-menu-collapsed {
9939
+ width: 50px;
9940
+ min-width: auto;
9941
+ }
9916
9942
  .kd-menu-vertical .kd-menu-submenu:not(.kd-menu-submenu-disabled):hover,
9917
9943
  .kd-menu-vertical .kd-menu-submenu-hover {
9918
9944
  background-color: var(--kd-c-menu-sub-color-background, #121319);
9919
9945
  color: var(--kd-c-menu-sub-color-text-hover, var(--kd-g-color-white, #fff));
9920
9946
  }
9921
- .kd-menu-vertical .kd-menu-submenu {
9922
- padding-right: 0;
9923
- }
9924
- .kd-menu-vertical .kd-menu-submenu-sub {
9925
- background: var(--kd-c-menu-sub-color-background, #121319);
9926
- }
9927
- .kd-menu-vertical .kd-menu-submenu-sub .kd-menu-item:hover,
9928
- .kd-menu-vertical .kd-menu-submenu-sub .kd-menu-item-active {
9929
- color: var(--kd-c-menu-sub-color-text-active, var(--kd-g-color-white, #fff));
9930
- }
9931
- .kd-menu-vertical .kd-menu-submenu-sub-second,
9932
- .kd-menu-vertical .kd-menu-submenu-sub-third {
9933
- -webkit-animation: kdZoomTopLeftIn calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
9934
- animation: kdZoomTopLeftIn calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
9935
- opacity: 1;
9936
- visibility: visible;
9937
- -webkit-transition: opacity, visibility;
9938
- transition: opacity, visibility;
9939
- -webkit-transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
9940
- transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
9941
- -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
9942
- transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
9943
- }
9944
- .kd-menu-vertical .kd-menu-submenu-sub-hide {
9945
- opacity: 0;
9946
- visibility: hidden;
9947
- -webkit-animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
9948
- animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
9949
- -webkit-transition: opacity, visibility;
9950
- transition: opacity, visibility;
9951
- -webkit-transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
9952
- transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
9953
- -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
9954
- transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
9955
- }
9956
- .kd-menu-collapsed {
9957
- width: 50px;
9958
- min-width: auto;
9959
- }
9960
9947
  .kd-menu-light {
9961
9948
  color: var(--kd-c-menu-light-color-text, var(--kd-g-color-text-primary, #212121));
9962
9949
  background: #ffffff;
@@ -9967,32 +9954,28 @@ textarea {
9967
9954
  background: #ffffff;
9968
9955
  }
9969
9956
  .kd-menu-light .kd-menu-submenu-title:hover {
9970
- color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-ongoing, #276ff5));
9957
+ color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-text-primary, #212121));
9971
9958
  }
9972
9959
  .kd-menu-light .kd-menu-submenu:not(.kd-menu-submenu-disabled):hover {
9973
- color: var(--kd-c-menu-light-color-text, var(--kd-g-color-text-primary, #212121));
9974
- background: #ffffff;
9975
- }
9976
- .kd-menu-light .kd-menu-item-active {
9977
- background-color: var(--kd-c-menu-light-color-background, var(--kd-g-color-background-ongoing, #f2f9ff));
9978
- color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-ongoing, #276ff5));
9960
+ background-color: var(--kd-c-menu-light-color-background-hover, #f5f5f5);
9961
+ color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-text-primary, #212121));
9979
9962
  }
9980
9963
  .kd-menu-light .kd-menu-item:not(.kd-menu-item-disabled):hover {
9981
- background-color: var(--kd-c-menu-light-color-background, var(--kd-g-color-background-ongoing, #f2f9ff));
9982
- color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-ongoing, #276ff5));
9964
+ background-color: var(--kd-c-menu-light-color-background-hover, #f5f5f5);
9965
+ color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-text-primary, #212121));
9983
9966
  }
9984
9967
  .kd-menu-light.kd-menu-vertical .kd-menu-submenu-sub {
9985
9968
  -webkit-box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
9986
9969
  box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
9987
9970
  }
9988
9971
  .kd-menu-light.kd-menu-vertical .kd-menu-item:not(.kd-menu-item-disabled):not(.kd-menu-item-active):hover {
9989
- color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-ongoing, #276ff5));
9990
- background: #fff;
9972
+ background-color: var(--kd-c-menu-light-color-background-hover, #f5f5f5);
9973
+ color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-text-primary, #212121));
9991
9974
  border: none;
9992
9975
  }
9993
9976
  .kd-menu-light.kd-menu-vertical .kd-menu-item-active {
9994
9977
  color: var(--kd-c-menu-light-color-text-active, var(--kd-g-color-theme, #5582f3));
9995
- background-color: var(--kd-c-menu-light-color-background, var(--kd-g-color-background-ongoing, #f2f9ff));
9978
+ background-color: var(--kd-c-menu-light-color-background-active, #e3ebff);
9996
9979
  border: none !important;
9997
9980
  }
9998
9981
  .kd-menu-item {
@@ -10158,6 +10141,7 @@ textarea {
10158
10141
  transition: transform calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0.4, 0, 0.6, 1);
10159
10142
  }
10160
10143
  .kd-menu-submenu-hover {
10144
+ background-color: var(--kd-c-menu-sub-color-background, #121319);
10161
10145
  color: var(--kd-c-menu-sub-color-text-hover, var(--kd-g-color-white, #fff));
10162
10146
  }
10163
10147
  .kd-menu-submenu-sub {
@@ -10263,6 +10247,106 @@ textarea {
10263
10247
  .kd-menu-dark .kd-menu-submenu-sub-third {
10264
10248
  background: var(--kd-c-menu-sub-color-background, #121319);
10265
10249
  }
10250
+ .kd-menu-light .kd-menu-submenu-active,
10251
+ .kd-menu-light .kd-menu-item-active {
10252
+ background-color: var(--kd-c-menu-light-color-background-active, #e3ebff);
10253
+ color: var(--kd-c-menu-light-color-text-active, var(--kd-g-color-theme, #5582f3));
10254
+ }
10255
+ .kd-menu-popper .kd-menu-submenu:not(.kd-menu-submenu-disabled):hover,
10256
+ .kd-menu-popper .kd-menu-submenu-hover {
10257
+ background-color: var(--kd-c-menu-sub-color-background, #121319);
10258
+ color: var(--kd-c-menu-sub-color-text-hover, var(--kd-g-color-white, #fff));
10259
+ }
10260
+ .kd-menu-popper.hidden {
10261
+ opacity: 0;
10262
+ visibility: hidden;
10263
+ display: none;
10264
+ -webkit-animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
10265
+ animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
10266
+ -webkit-transition: opacity, visibility;
10267
+ transition: opacity, visibility;
10268
+ -webkit-transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
10269
+ transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
10270
+ -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
10271
+ transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
10272
+ }
10273
+ .kd-menu-popper .kd-menu-submenu {
10274
+ padding-right: 0;
10275
+ }
10276
+ .kd-menu-popper .kd-menu-submenu-sub {
10277
+ background: var(--kd-c-menu-sub-inline-color-background, #1f212b);
10278
+ }
10279
+ .kd-menu-popper .kd-menu-submenu-sub .kd-menu-item:hover,
10280
+ .kd-menu-popper .kd-menu-submenu-sub .kd-menu-item-active {
10281
+ color: var(--kd-c-menu-sub-color-text-active, var(--kd-g-color-white, #fff));
10282
+ }
10283
+ .kd-menu-popper .kd-menu-submenu-sub-second,
10284
+ .kd-menu-popper .kd-menu-submenu-sub-third {
10285
+ -webkit-animation: kdZoomTopLeftIn calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
10286
+ animation: kdZoomTopLeftIn calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
10287
+ opacity: 1;
10288
+ visibility: visible;
10289
+ -webkit-transition: opacity, visibility;
10290
+ transition: opacity, visibility;
10291
+ -webkit-transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
10292
+ transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
10293
+ -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
10294
+ transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
10295
+ }
10296
+ .kd-menu-popper .kd-menu-submenu-sub-hide {
10297
+ opacity: 0;
10298
+ visibility: hidden;
10299
+ -webkit-animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
10300
+ animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
10301
+ -webkit-transition: opacity, visibility;
10302
+ transition: opacity, visibility;
10303
+ -webkit-transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
10304
+ transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
10305
+ -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
10306
+ transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
10307
+ }
10308
+ .kd-menu-popper.light {
10309
+ color: var(--kd-c-menu-light-color-text, var(--kd-g-color-text-primary, #212121));
10310
+ background: #ffffff;
10311
+ }
10312
+ .kd-menu-popper.light .kd-menu-submenu-hover,
10313
+ .kd-menu-popper.light .kd-menu-submenu-sub {
10314
+ color: var(--kd-c-menu-light-color-text, var(--kd-g-color-text-primary, #212121));
10315
+ background: #ffffff;
10316
+ }
10317
+ .kd-menu-popper.light .kd-menu-submenu-title:hover {
10318
+ color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-text-primary, #212121));
10319
+ }
10320
+ .kd-menu-popper.light .kd-menu-submenu:not(.kd-menu-submenu-disabled):hover {
10321
+ background-color: var(--kd-c-menu-light-color-background-hover, #f5f5f5);
10322
+ color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-text-primary, #212121));
10323
+ }
10324
+ .kd-menu-popper.light .kd-menu-item:not(.kd-menu-item-disabled):hover {
10325
+ background-color: var(--kd-c-menu-light-color-background-hover, #f5f5f5);
10326
+ color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-text-primary, #212121));
10327
+ }
10328
+ .kd-menu-popper.light .kd-menu-submenu-sub {
10329
+ -webkit-box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
10330
+ box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
10331
+ }
10332
+ .kd-menu-popper.light .kd-menu-item:not(.kd-menu-item-disabled):not(.kd-menu-item-active):hover,
10333
+ .kd-menu-popper.light .kd-menu-submenu:not(.kd-menu-submenu-disabled):hover {
10334
+ background-color: var(--kd-c-menu-light-color-background-hover, #f5f5f5);
10335
+ color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-text-primary, #212121));
10336
+ border: none;
10337
+ }
10338
+ .kd-menu-popper.light .kd-menu-item-hover,
10339
+ .kd-menu-popper.light .kd-menu-submenu-hover {
10340
+ background-color: var(--kd-c-menu-light-color-background-hover, #f5f5f5);
10341
+ color: var(--kd-c-menu-light-color-text-hover, var(--kd-g-color-text-primary, #212121));
10342
+ border: none;
10343
+ }
10344
+ .kd-menu-popper.light .kd-menu-item-active,
10345
+ .kd-menu-popper.light .kd-menu-submenu-active {
10346
+ background-color: var(--kd-c-menu-light-color-background-active, #e3ebff);
10347
+ color: var(--kd-c-menu-light-color-text-active, var(--kd-g-color-theme, #5582f3));
10348
+ border: none;
10349
+ }
10266
10350
 
10267
10351
  /* ----------- color ——————---- start */
10268
10352
  /* ----------- color ——————---- end */