UNPKG

fixed-data-table-one.com

Version:

A React table component designed to allow presenting thousands of rows of data.

367 lines (321 loc) 8.53 kB
/** * FixedDataTable v0.8.0-patch0 * * Copyright Schrodinger, LLC * All rights reserved. * * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. An additional grant * of patent rights can be found in the PATENTS file in the same directory. */ /** * Copyright Schrodinger, LLC * All rights reserved. * * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. An additional grant * of patent rights can be found in the PATENTS file in the same directory. * * @providesModule fixedDataTableCellGroupLayout */ .fixedDataTableCellGroupLayout_cellGroup { -webkit-backface-visibility: hidden; backface-visibility: hidden; left: 0; overflow: hidden; position: absolute; top: 0; white-space: nowrap; } .fixedDataTableCellGroupLayout_cellGroup > .public_fixedDataTableCell_main { display: inline-block; vertical-align: top; white-space: normal; } .fixedDataTableCellGroupLayout_cellGroupWrapper { position: absolute; top: 0; } /** * Copyright Schrodinger, LLC * All rights reserved. * * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. An additional grant * of patent rights can be found in the PATENTS file in the same directory. * * @providesModule fixedDataTableCellLayout */ .fixedDataTableCellLayout_main { border-right-style: solid; border-right-width: 1px; border-width: 0 1px 0 0; -webkit-box-sizing: border-box; box-sizing: border-box; display: block; overflow: hidden; position: absolute; white-space: normal; } .fixedDataTableCellLayout_lastChild { border-width: 0 1px 1px 0; } .fixedDataTableCellLayout_alignRight { text-align: right; } .fixedDataTableCellLayout_alignCenter { text-align: center; } .fixedDataTableCellLayout_wrap1 { display: table; } .fixedDataTableCellLayout_wrap2 { display: table-row; } .fixedDataTableCellLayout_wrap3 { display: table-cell; vertical-align: middle; } .fixedDataTableCellLayout_columnResizerContainer { position: absolute; right: 0px; width: 6px; z-index: 1; } .fixedDataTableCellLayout_columnResizerContainer:hover { cursor: ew-resize; } .fixedDataTableCellLayout_columnResizerContainer:hover .fixedDataTableCellLayout_columnResizerKnob { visibility: visible; } .fixedDataTableCellLayout_columnResizerKnob { position: absolute; right: 0px; visibility: hidden; width: 4px; } /** * Copyright Schrodinger, LLC * All rights reserved. * * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. An additional grant * of patent rights can be found in the PATENTS file in the same directory. * * @providesModule fixedDataTableColumnResizerLineLayout */ .fixedDataTableColumnResizerLineLayout_mouseArea { cursor: ew-resize; position: absolute; right: -5px; width: 12px; } .fixedDataTableColumnResizerLineLayout_main { border-right-style: solid; border-right-width: 1px; -webkit-box-sizing: border-box; box-sizing: border-box; position: absolute; z-index: 10; } body[dir="rtl"] .fixedDataTableColumnResizerLineLayout_main { /* the resizer line is in the wrong position in RTL with no easy fix. * Disabling is more useful than displaying it. * #167 (github) should look into this and come up with a permanent fix. */ display: none !important; } .fixedDataTableColumnResizerLineLayout_hiddenElem { display: none !important; } /** * Copyright Schrodinger, LLC * All rights reserved. * * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. An additional grant * of patent rights can be found in the PATENTS file in the same directory. * * @providesModule fixedDataTableLayout */ .fixedDataTableLayout_main { border-style: solid; border-width: 1px; -webkit-box-sizing: border-box; box-sizing: border-box; overflow: hidden; position: relative; } .fixedDataTableLayout_header, .fixedDataTableLayout_hasBottomBorder { border-bottom-style: solid; border-bottom-width: 1px; } .fixedDataTableLayout_footer .public_fixedDataTableCell_main { border-top-style: solid; border-top-width: 1px; } .fixedDataTableLayout_topShadow, .fixedDataTableLayout_bottomShadow { height: 4px; left: 0; position: absolute; right: 0; z-index: 1; } .fixedDataTableLayout_bottomShadow { margin-top: -4px; } .fixedDataTableLayout_rowsContainer { overflow: hidden; position: relative; } .fixedDataTableLayout_horizontalScrollbar { bottom: 0; position: absolute; } /** * Copyright Schrodinger, LLC * All rights reserved. * * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. An additional grant * of patent rights can be found in the PATENTS file in the same directory. * * @providesModule fixedDataTableRowLayout */ .fixedDataTableRowLayout_main { -webkit-box-sizing: border-box; box-sizing: border-box; overflow: hidden; position: absolute; top: 0; } .fixedDataTableRowLayout_body { left: 0; position: absolute; top: 0; } .fixedDataTableRowLayout_rowExpanded { -webkit-box-sizing: border-box; box-sizing: border-box; left: 0; position: absolute; } .fixedDataTableRowLayout_fixedColumnsDivider { -webkit-backface-visibility: hidden; backface-visibility: hidden; border-left-style: solid; border-left-width: 1px; left: 0; position: absolute; top: 0; width: 0; } .fixedDataTableRowLayout_columnsShadow { position: absolute; width: 4px; } .fixedDataTableRowLayout_columnsRightShadow { right: 1px; } .fixedDataTableRowLayout_rowWrapper { position: absolute; top: 0; } /** * Copyright Schrodinger, LLC * All rights reserved. * * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. An additional grant * of patent rights can be found in the PATENTS file in the same directory. * * @providesModule ScrollbarLayout */ .ScrollbarLayout_main { -webkit-box-sizing: border-box; box-sizing: border-box; outline: none; overflow: hidden; position: absolute; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .ScrollbarLayout_mainVertical { bottom: 0; right: 0; top: 0; width: 15px; } .ScrollbarLayout_mainHorizontal { bottom: 0; height: 15px; left: 0; -webkit-transition-property: background-color height; transition-property: background-color height; } /* Touching the scroll-track directly makes the scroll-track bolder */ .ScrollbarLayout_mainHorizontal.public_Scrollbar_mainActive, .ScrollbarLayout_mainHorizontal:hover { height: 17px; } .ScrollbarLayout_face { left: 0; overflow: hidden; position: absolute; z-index: 1; -webkit-transition-duration: 250ms; transition-duration: 250ms; -webkit-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-property: background-color width position; transition-property: background-color width position; } /** * This selector renders the "nub" of the scrollface. The nub must * be rendered as pseudo-element so that it won't receive any UI events then * we can get the correct `event.offsetX` and `event.offsetY` from the * scrollface element while dragging it. */ .ScrollbarLayout_face:after { border-radius: 6px; content: ''; display: block; position: absolute; -webkit-transition: background-color 250ms ease; transition: background-color 250ms ease; } .ScrollbarLayout_faceHorizontal { bottom: 0; left: 0; top: 0; } .ScrollbarLayout_faceHorizontal:after { bottom: 4px; left: 0; top: 4px; width: 100%; } .ScrollbarLayout_faceHorizontal.public_Scrollbar_faceActive:after, .ScrollbarLayout_main:hover .ScrollbarLayout_faceHorizontal:after { bottom: calc(4px/2); } .ScrollbarLayout_faceVertical { left: 0; right: 0; top: 0; } .ScrollbarLayout_faceVertical:after { height: 100%; left: 4px; right: 4px; top: 0; } .ScrollbarLayout_main:hover .ScrollbarLayout_faceVertical:after, .ScrollbarLayout_faceVertical.public_Scrollbar_faceActive:after { left: calc(4px/2); right: calc(4px/2); }