@revolist/revogrid
Version:
Virtual reactive data grid spreadsheet component - RevoGrid.
126 lines • 2.4 kB
CSS
@charset "UTF-8";
revogr-header {
position: relative;
z-index: 5;
display: block;
}
revogr-header .header-rgRow {
display: block;
position: relative;
}
revogr-header .header-rgRow.group {
z-index: 0;
}
revogr-header .group-rgRow {
position: relative;
overflow: hidden;
}
revogr-header .rgHeaderCell {
position: absolute;
box-sizing: border-box;
height: 100%;
z-index: 1;
display: flex;
}
revogr-header .rgHeaderCell.align-center {
text-align: center;
}
revogr-header .rgHeaderCell.align-left {
text-align: left;
}
revogr-header .rgHeaderCell.align-right {
text-align: right;
}
revogr-header .rgHeaderCell.sortable {
cursor: pointer;
}
revogr-header .rgHeaderCell i.asc:after, revogr-header .rgHeaderCell i.desc:after {
font-size: 13px;
}
revogr-header .rgHeaderCell i.asc:after {
content: "↑";
}
revogr-header .rgHeaderCell i.desc:after {
content: "↓";
}
revogr-header .rgHeaderCell.active {
z-index: 10;
}
revogr-header .rgHeaderCell.active .resizable {
background-color: deepskyblue;
}
revogr-header .rgHeaderCell .header-content {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex-grow: 1;
}
revogr-header .rgHeaderCell .resizable {
display: block;
position: absolute;
z-index: 90;
touch-action: none;
user-select: none;
}
revogr-header .rgHeaderCell .resizable:hover {
background-color: deepskyblue;
}
revogr-header .rgHeaderCell > .resizable-r {
cursor: ew-resize;
width: 6px;
right: 0;
top: 0;
height: 100%;
}
revogr-header .rgHeaderCell > .resizable-rb {
cursor: se-resize;
width: 6px;
height: 6px;
right: 0;
bottom: 0;
}
revogr-header .rgHeaderCell > .resizable-b {
cursor: s-resize;
height: 6px;
bottom: 0;
width: 100%;
left: 0;
}
revogr-header .rgHeaderCell > .resizable-lb {
cursor: sw-resize;
width: 6px;
height: 6px;
left: 0;
bottom: 0;
}
revogr-header .rgHeaderCell > .resizable-l {
cursor: w-resize;
width: 6px;
left: 0;
height: 100%;
top: 0;
}
revogr-header .rgHeaderCell > .resizable-lt {
cursor: nw-resize;
width: 6px;
height: 6px;
left: 0;
top: 0;
}
revogr-header .rgHeaderCell > .resizable-t {
cursor: n-resize;
height: 6px;
top: 0;
width: 100%;
left: 0;
}
revogr-header .rgHeaderCell > .resizable-rt {
cursor: ne-resize;
width: 6px;
height: 6px;
right: 0;
top: 0;
}
revogr-header .rv-filter {
visibility: hidden;
}