@deepbag/react-grid-x
Version:
ReactGridX is a customizable and flexible React table component that supports pagination, dynamic rendering of table data, and customizable column rendering. It provides an easy-to-use interface for displaying tabular data with configurable columns, pagin
1 lines • 1.6 kB
CSS
.rgx-theme .rgx-arrow-pagination{margin-top:10px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px}.rgx-theme .rgx-arrow-pagination-info{font-size:14px;font-weight:500}.rgx-theme .rgx-arrow-pagination-page-of{font-size:14px;font-weight:500;display:flex;align-items:center;margin:0 7px}.rgx-theme .rgx-arrow-pagination-row-per-page{display:flex;align-items:center}.rgx-theme .rgx-arrow-pagination-rows-per-page-label{font-size:14px;margin-right:10px}.rgx-theme .rgx-arrow-pagination-rows-per-page-select{height:30px;padding:5px;border:1px solid #ddd;background-color:#f9f9f9;cursor:pointer;font-size:14px;font-weight:500}.rgx-theme .rgx-arrow-pagination-rows-per-page-select:disabled{cursor:not-allowed}.rgx-theme .rgx-arrow-pagination-rows-per-page{display:flex;align-items:center;margin-right:10px;font-weight:500}.rgx-theme .rgx-theme.rgx-arrow-pagination-rows-per-page-label{font-size:14px;color:#202020;margin-right:10px}.rgx-theme .rgx-arrow-pagination-controls{display:flex;flex-wrap:wrap;gap:5px}.rgx-theme .rgx-arrow-pagination-button{padding:4.8px 5px 1.6px 5px;border:1px solid #ddd;background-color:#f9f9f9;cursor:pointer;transition:background-color .3s;font-size:14px;font-weight:500}.rgx-theme .rgx-arrow-pagination-button:hover{background-color:#ddd}.rgx-theme .rgx-arrow-pagination-button:disabled{background-color:#eee;cursor:not-allowed}.rgx-theme .rgx-arrow-pagination-button.rgx-active{background-color:#007bff;color:#fff;border-color:#007bff}.rgx-theme .rgx-arrow-pagination-ellipsis{background-color:transparent;color:#888;cursor:not-allowed}