menu.scss 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. /**Variable**/
  2. /*快捷菜单*/
  3. .vxe-table--context-menu-wrapper,
  4. .vxe-table--context-menu-clild-wrapper {
  5. position: absolute;
  6. top: 0;
  7. left: 0;
  8. font-size: 12px;
  9. border: 1px solid $vxe-table-popup-border-color;
  10. box-shadow: 3px 3px 4px -2px rgba(0,0,0,.6);
  11. padding: 0 1px;
  12. user-select: none;
  13. color: $vxe-table-font-color;
  14. font-family: $vxe-font-family;
  15. background-color: $vxe-table-menu-background-color;
  16. }
  17. .vxe-context-menu--link {
  18. display: block;
  19. padding: 0 2.5em;
  20. width: $vxe-table-menu-item-width;
  21. line-height: 26px;
  22. color: $vxe-table-font-color;
  23. cursor: pointer;
  24. .vxe-context-menu--link-prefix,
  25. .vxe-context-menu--link-suffix {
  26. position: absolute;
  27. top: 5px;
  28. margin-right: 5px;
  29. font-size: 16px;
  30. }
  31. .vxe-context-menu--link-prefix {
  32. left: 5px;
  33. }
  34. .vxe-context-menu--link-suffix {
  35. right: 5px;
  36. &.suffix--haschild {
  37. top: 8px;
  38. &:before {
  39. position: absolute;
  40. content: "";
  41. border: 4px solid transparent;
  42. border-left-color: #727272;
  43. }
  44. }
  45. }
  46. .vxe-context-menu--link-content {
  47. display: block;
  48. overflow: hidden;
  49. text-overflow: ellipsis;
  50. white-space: nowrap;
  51. }
  52. }
  53. .vxe-table--context-menu-clild-wrapper {
  54. .vxe-context-menu--link {
  55. padding: 0 2em 0 2.5em;
  56. }
  57. }
  58. .vxe-context-menu--option-wrapper,
  59. .vxe-table--context-menu-clild-wrapper {
  60. margin: 0;
  61. padding: 0;
  62. list-style-type: none;
  63. border-bottom: 1px solid #E8EAED;
  64. li {
  65. position: relative;
  66. margin: 1px 0;
  67. border: 1px solid transparent;
  68. &:last-child {
  69. border: 0;
  70. }
  71. &.link--active {
  72. background-color: #C5C5C5;
  73. border-color:#C5C5C5;
  74. & > .vxe-context-menu--link {
  75. color: #2B2B2B;
  76. }
  77. }
  78. &.link--disabled {
  79. & > .vxe-context-menu--link {
  80. color: $vxe-disabled-color;
  81. cursor: no-drop;
  82. }
  83. &.link--active {
  84. border-color:#C0C1C2;
  85. background-color: #EEEEEE;
  86. &:hover {
  87. background-color: inherit;
  88. }
  89. }
  90. }
  91. }
  92. }
  93. .vxe-table--context-menu-clild-wrapper {
  94. display: none;
  95. top: 0;
  96. left: 100%;
  97. &.is--show {
  98. display: block;
  99. }
  100. }