menu.scss 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. .vxe-table--context-menu-wrapper {
  2. display: none;
  3. &.is--visible {
  4. display: block;
  5. }
  6. }
  7. .vxe-table--context-menu-wrapper,
  8. .vxe-table--context-menu-clild-wrapper {
  9. position: absolute;
  10. top: 0;
  11. left: 0;
  12. font-size: 12px;
  13. border: 1px solid var(--vxe-ui-base-popup-border-color);
  14. box-shadow: 3px 3px 4px -2px rgba(0,0,0,.6);
  15. padding: 0 1px;
  16. user-select: none;
  17. color: var(--vxe-ui-font-color);
  18. font-family: var(--vxe-ui-font-family);
  19. background-color: var(--vxe-ui-table-menu-background-color);
  20. }
  21. .vxe-context-menu--link {
  22. display: flex;
  23. flex-direction: row;
  24. width: var(--vxe-ui-table-menu-item-width);
  25. line-height: 26px;
  26. padding: 0 0.8em;
  27. color: var(--vxe-ui-font-color);
  28. cursor: pointer;
  29. .vxe-context-menu--link-prefix,
  30. .vxe-context-menu--link-suffix {
  31. min-width: 2em;
  32. flex-shrink: 0;
  33. text-align: center;
  34. padding: 0 0.2em;
  35. }
  36. .vxe-context-menu--link-content {
  37. flex-grow: 1;
  38. padding: 0 0.2em;
  39. overflow: hidden;
  40. text-overflow: ellipsis;
  41. white-space: nowrap;
  42. }
  43. }
  44. .vxe-context-menu--option-wrapper,
  45. .vxe-table--context-menu-clild-wrapper {
  46. margin: 0;
  47. padding: 0;
  48. list-style-type: none;
  49. border-bottom: 1px solid #E8EAED;
  50. li {
  51. position: relative;
  52. margin: 1px 0;
  53. border: 1px solid transparent;
  54. &:last-child {
  55. border: 0;
  56. }
  57. &.link--active {
  58. background-color: #C5C5C5;
  59. border-color:#C5C5C5;
  60. & > .vxe-context-menu--link {
  61. color: #2B2B2B;
  62. }
  63. }
  64. &.link--disabled {
  65. & > .vxe-context-menu--link {
  66. color: var(--vxe-ui-font-disabled-color);
  67. cursor: no-drop;
  68. }
  69. &.link--active {
  70. border-color:#C0C1C2;
  71. background-color: #EEEEEE;
  72. &:hover {
  73. background-color: inherit;
  74. }
  75. }
  76. }
  77. }
  78. }
  79. .vxe-table--context-menu-clild-wrapper {
  80. display: none;
  81. top: 0;
  82. left: 100%;
  83. &.is--show {
  84. display: block;
  85. }
  86. }