vxe-table-demonic
Version:
一个基于 vue 的 PC 端表单/表格组件,支持增删改查、虚拟列表、虚拟树、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、弹窗、自定义模板、渲染器、JSON 配置式...
142 lines (137 loc) • 3.5 kB
CSS
@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;
}