hightable/dist/HighTable.css

A dynamic windowed scrolling table component for react

._hightable_o6cvp_1{display:flex;flex:1;min-height:0;position:relative}._hightable_o6cvp_1 *{box-sizing:border-box;margin:0;padding:0}._hightable_o6cvp_1 ._table-scroll_o6cvp_15{flex:1;overflow:auto}._hightable_o6cvp_1 ._table-scroll_o6cvp_15>div{position:relative}._hightable_o6cvp_1 table{position:absolute;max-width:100%;overflow-x:auto}._hightable_o6cvp_1 th,._hightable_o6cvp_1 td{overflow:hidden}._hightable_o6cvp_1 thead th{background-color:transparent;position:sticky;-webkit-user-select:none;user-select:none;top:0;z-index:var(--header-z-index, auto)}._hightable_o6cvp_1 thead th[aria-disabled=false]{cursor:pointer}._hightable_o6cvp_1 th[aria-sort=ascending]:after,._hightable_o6cvp_1 th[aria-sort=descending]:after{position:absolute;right:0;top:0}._hightable_o6cvp_1 th[aria-sort=ascending]:after{content:"▾"}._hightable_o6cvp_1 th[aria-sort=descending]:after{content:"▴"}._hightable_o6cvp_1 thead [role=separator]{position:absolute;top:0;right:0;bottom:0;width:12px;cursor:col-resize;background-color:#888;z-index:var(--header-separator-z-index, auto)}._hightable_o6cvp_1 tbody [role=rowheader]{position:sticky;left:0;-webkit-user-select:none;user-select:none;min-width:48px;max-width:none;width:48px;cursor:pointer;z-index:var(--header-z-index, auto)}._hightable_o6cvp_1 tbody [role=rowheader] span{display:inline}._hightable_o6cvp_1 tbody [role=rowheader] input,._hightable_o6cvp_1 tr[aria-selected=true] [role=rowheader] span{display:none}._hightable_o6cvp_1 tr[aria-selected=true] [role=rowheader] input{display:inline}._hightable_o6cvp_1 table[aria-multiselectable=true] tbody [role=rowheader]:hover span,._hightable_o6cvp_1 table[aria-multiselectable=true] tbody [role=rowheader]:focus span{display:none}._hightable_o6cvp_1 table[aria-multiselectable=true] tbody [role=rowheader]:hover input,._hightable_o6cvp_1 table[aria-multiselectable=true] tbody [role=rowheader]:focus input{display:inline;cursor:pointer}._hightable_o6cvp_1 thead td:first-child{position:sticky;cursor:default;min-width:48px;max-width:none;width:48px;top:0;left:0;z-index:var(--header-corner-z-index, auto)}._hightable_o6cvp_1 thead td:first-child input{display:none;margin:0 auto}._hightable_o6cvp_1 thead td:first-child[aria-disabled=false]{background:transparent}._hightable_o6cvp_1 thead td:first-child[aria-disabled=false] span{display:none}._hightable_o6cvp_1 thead td:first-child[aria-disabled=false] input{display:block}._hightable_o6cvp_1 table[aria-multiselectable=true] thead td:first-child,._hightable_o6cvp_1 table[aria-multiselectable=true] thead td:first-child input{cursor:pointer}._hightable_o6cvp_1 ._mock-row-label_o6cvp_143{content:"";position:absolute;top:0;left:0;bottom:0;background:var(--mock-row-label-background, transparent);z-index:var(--header-background-z-index, auto)}._styled_o6cvp_155{--header-z-index: 10;--header-background-z-index: calc(var(--header-z-index) - 1);--header-separator-z-index: calc(var(--header-z-index) + 1);--header-corner-z-index: calc(var(--header-z-index) + 3);--header-progress-z-index: calc(var(--header-z-index) + 2);--cell-placeholder-z-index: 1;--mock-row-label-background: #f1f1f3;isolation:isolate}._styled_o6cvp_155 table{border-collapse:separate;border-spacing:0;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:4px}._styled_o6cvp_155 table:focus-visible{outline:none}._styled_o6cvp_155 thead th{background-color:#f1f1f3;border:none;border-bottom:2px solid #c9c9c9;box-sizing:content-box;color:#444;height:20px;padding-top:8px;top:-1px}._styled_o6cvp_155 th[aria-sort=ascending]:after,._styled_o6cvp_155 th[aria-sort=descending]:after{right:8px;top:8px;padding-left:2px;background:none;color:#d5d4d6}._styled_o6cvp_155 th[aria-posinset="0"]:after{color:inherit}._styled_o6cvp_155 tbody tr:first-child td,._styled_o6cvp_155 tbody tr:first-child th{border-top:1px solid transparent}._styled_o6cvp_155 th,._styled_o6cvp_155 td{border-bottom:1px solid #ddd;border-right:1px solid #ddd;height:32px;max-width:2000px;padding:4px 12px;text-align:left;text-overflow:ellipsis;white-space:nowrap}._styled_o6cvp_155 tr[title]{color:#a11}._styled_o6cvp_155 thead [role=separator]{background-color:inherit;border-right:1px solid #ddd;width:8px;transition:background-color .2s ease}._styled_o6cvp_155 thead [role=separator]:hover{background-color:#aab}._styled_o6cvp_155 tbody [role=rowheader]{background-color:#f1f1f3;border-right:1px solid #ddd;color:#888;font-size:.68rem;padding:0 2px;text-align:center;min-width:32px;width:32px}._styled_o6cvp_155 tr[aria-selected=true]{background-color:#fbf7bf}._styled_o6cvp_155 tr[aria-selected=true] [role=rowheader]{background-color:#f1edbb}._styled_o6cvp_155 thead td:first-child{background-color:#f9f4ff;border-right:1px solid #ccc;box-shadow:inset 0 0 4px #0003;min-width:32px;width:32px;top:-1px}._styled_o6cvp_155 thead td:first-child[aria-disabled=false]{background:#f9f4ff}._styled_o6cvp_155 tbody td[aria-busy=true]{position:relative}._styled_o6cvp_155 tbody td[aria-busy=true]:after{content:"";position:absolute;z-index:var(--cell-placeholder-z-index);top:8px;left:8px;right:8px;bottom:8px;border-radius:4px;background:linear-gradient(60deg,#0000000d 25%,#00000014,#0000000d 75%);background-size:120px 100%;animation:_textshimmer_o6cvp_1 3s infinite linear}._styled_o6cvp_155 tbody tr:nth-child(2n) td[aria-busy=true]:after{animation-delay:-1s}._styled_o6cvp_155 tbody tr:nth-child(odd) td[aria-busy=true]:after{animation-delay:-3s}._styled_o6cvp_155 tbody tr:nth-child(3n) td[aria-busy=true]:after{animation-delay:-2s}._styled_o6cvp_155 tbody tr:nth-child(5n) td[aria-busy=true]:after{animation-delay:-4s}._styled_o6cvp_155 tbody tr:nth-child(7n) td[aria-busy=true]:after{animation-delay:-1.5s}._styled_o6cvp_155 thead th:before{content:"";position:absolute;top:0;left:0;width:100%;height:4px;background-color:#706fb1;z-index:var(--header-progress-z-index)}@media (hover: hover){._styled_o6cvp_155 tbody tr:hover{background-color:#dbdbe5}._styled_o6cvp_155 tbody tr:hover td{border-right-color:#bbb}._styled_o6cvp_155 tbody tr:hover td:first-child{background-color:#ccd}}@keyframes _textshimmer_o6cvp_1{0%{background-position:-120px 0}to{background-position:120px 0}}@keyframes _shimmer_o6cvp_1{0%,to{background-color:#6fb176}50%{background-color:#adc6b0}}