vxe-table-demonic/es/vxe-module-menu/style.css

一个基于 vue 的 PC 端表单/表格组件，支持增删改查、虚拟列表、虚拟树、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、弹窗、自定义模板、渲染器、JSON 配置式...

@charset "UTF-8";
/*font*/
/*size*/
/*icon*/
/*color*/
/*input/radio/checkbox*/
/*popup*/
/*table*/
/*filter*/
/*menu*/
/*loading*/
/*validate*/
/*grid*/
/*toolbar*/
/*tooltip*/
/*pager*/
/*modal*/
/*checkbox*/
/*radio*/
/*button*/
/*input*/
/*textarea*/
/*form*/
/*select*/
/*switch*/
/*pulldown*/
/*tag*/
/*快捷菜单*/
.vxe-table--context-menu-wrapper {
  display: none;
}
.vxe-table--context-menu-wrapper.is--visible {
  display: block;
}

.vxe-table--context-menu-wrapper,
.vxe-table--context-menu-clild-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 12px;
  border: 1px solid var(--vxe-table-popup-border-color);
  box-shadow: 3px 3px 4px -2px rgba(0, 0, 0, 0.6);
  padding: 0 1px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  color: var(--vxe-font-color);
  font-family: var(--vxe-font-family);
  background-color: var(--vxe-table-menu-background-color);
}

.vxe-context-menu--link {
  display: block;
  padding: 0 2.5em;
  width: var(--vxe-table-menu-item-width);
  line-height: 26px;
  color: var(--vxe-font-color);
  cursor: pointer;
}
.vxe-context-menu--link .vxe-context-menu--link-prefix,
.vxe-context-menu--link .vxe-context-menu--link-suffix {
  position: absolute;
  top: 5px;
  margin-right: 5px;
  font-size: 16px;
}
.vxe-context-menu--link .vxe-context-menu--link-prefix {
  left: 5px;
}
.vxe-context-menu--link .vxe-context-menu--link-suffix {
  right: 5px;
}
.vxe-context-menu--link .vxe-context-menu--link-suffix.suffix--haschild {
  top: 8px;
}
.vxe-context-menu--link .vxe-context-menu--link-suffix.suffix--haschild:before {
  position: absolute;
  content: "";
  border: 4px solid transparent;
  border-left-color: #727272;
}
.vxe-context-menu--link .vxe-context-menu--link-content {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.vxe-table--context-menu-clild-wrapper .vxe-context-menu--link {
  padding: 0 2em 0 2.5em;
}

.vxe-context-menu--option-wrapper,
.vxe-table--context-menu-clild-wrapper {
  margin: 0;
  padding: 0;
  list-style-type: none;
  border-bottom: 1px solid #E8EAED;
}
.vxe-context-menu--option-wrapper li,
.vxe-table--context-menu-clild-wrapper li {
  position: relative;
  margin: 1px 0;
  border: 1px solid transparent;
}
.vxe-context-menu--option-wrapper li:last-child,
.vxe-table--context-menu-clild-wrapper li:last-child {
  border: 0;
}
.vxe-context-menu--option-wrapper li.link--active,
.vxe-table--context-menu-clild-wrapper li.link--active {
  background-color: #C5C5C5;
  border-color: #C5C5C5;
}
.vxe-context-menu--option-wrapper li.link--active > .vxe-context-menu--link,
.vxe-table--context-menu-clild-wrapper li.link--active > .vxe-context-menu--link {
  color: #2B2B2B;
}
.vxe-context-menu--option-wrapper li.link--disabled > .vxe-context-menu--link,
.vxe-table--context-menu-clild-wrapper li.link--disabled > .vxe-context-menu--link {
  color: var(--vxe-font-disabled-color);
  cursor: no-drop;
}
.vxe-context-menu--option-wrapper li.link--disabled.link--active,
.vxe-table--context-menu-clild-wrapper li.link--disabled.link--active {
  border-color: #C0C1C2;
  background-color: #EEEEEE;
}
.vxe-context-menu--option-wrapper li.link--disabled.link--active:hover,
.vxe-table--context-menu-clild-wrapper li.link--disabled.link--active:hover {
  background-color: inherit;
}

.vxe-table--context-menu-clild-wrapper {
  display: none;
  top: 0;
  left: 100%;
}
.vxe-table--context-menu-clild-wrapper.is--show {
  display: block;
}