@tourmalinecore/react-table-responsive/es/index.css

React Table Responsive

.tc-table-desktop-row{display:flex;flex:1 0 auto;position:relative;transition:box-shadow .15s ease-out}.tc-table-desktop-row+.tc-table-desktop-row{border-top:1px solid #d8dfea}.tc-table-desktop-row--striped:nth-child(odd){background-color:#f2f4f7}.tc-table-desktop-row:not(.tc-table-desktop-row--header,.tc-table-desktop-row--footer,.tc-table-desktop-row--filter):hover{box-shadow:3px 9px 34px rgba(4,42,77,.11);z-index:1}.tc-table-desktop-cell,.tc-table-desktop-header-cell{display:flex;flex:1 0 auto;margin:0;padding:.9em 1.2em;position:relative;transition:background-color .15s ease-out}.tc-table-desktop-header-cell--title{border-left:1px solid #d8dfea;font-weight:400;overflow:hidden;padding:1.1em 1.2em;text-overflow:ellipsis;white-space:nowrap}.tc-table-desktop-header-cell--title:first-child{border-left:none}.tc-table-desktop-header-cell--sort-asc,.tc-table-desktop-header-cell--sort-desc,.tc-table-desktop-header-cell--sortable{cursor:pointer}.tc-table-desktop-header-cell--sort-asc{box-shadow:inset 0 2px 0 0 #334580}.tc-table-desktop-header-cell--sort-desc{box-shadow:inset 0 -2px 0 0 #334580}.tc-table-select{-moz-appearance:none;-webkit-appearance:none;appearance:none;background-color:#fff;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M506 124c-9-9-22-9-30 0L256 343 36 124a21 21 0 1 0-30 30l235 234a21 21 0 0 0 30 0l235-234c8-9 8-22 0-30z' fill='%233C4A64'/%3E%3C/svg%3E");background-position:right 10px top 50%,0 0;background-repeat:no-repeat,repeat;background-size:11px auto,100%;border:1px solid #d8dfea;border-radius:5px;box-shadow:none;height:30px;padding:0 25px 0 10px;width:100%}.tc-table-select:focus{border-color:#334580;outline:none}.tc-table-select option{font-size:16px}.tc-table-filter-input{background-clip:padding-box;background-color:#fff;border:1px solid #d8dfea;border-radius:5px;box-sizing:border-box;font-family:inherit;font-size:inherit;font-weight:inherit;height:30px;padding:6px 10px}.tc-table-filter-input:focus{border-color:#334580;outline:none}.loader{align-items:center;background-color:hsla(0,0%,100%,.8);display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%;z-index:5}.tc-table-no-records{padding:30px 30px 14px;text-align:center}.tc-table-no-records__text{margin-top:15px}@media (min-width:769px){.tc-table-no-records{padding:30px}}.tc-table-no-records svg{width:60px}.tc-table-desktop-actions-dropdown{flex:none;height:100%;position:relative;width:100%}.tc-table-desktop-actions-dropdown__button{background-color:transparent;border:none;box-shadow:none;cursor:pointer;display:flex;font-family:inherit;font-size:inherit;font-weight:inherit;height:100%;justify-content:center;margin:0 auto;padding:1.33em 0 0;width:100%}.tc-table-desktop-actions-dropdown__button:focus{opacity:.6;outline:none}.tc-table-desktop-actions-dropdown__button span,.tc-table-desktop-actions-dropdown__button:after,.tc-table-desktop-actions-dropdown__button:before{background-color:currentColor;border-radius:50%;content:"";display:block;height:6px;width:6px}.tc-table-desktop-actions-dropdown__button span,.tc-table-desktop-actions-dropdown__button:before{margin-right:6px}.tc-table-desktop-actions-dropdown__list{background-color:#fff;border-radius:5px;box-shadow:0 9px 33px hsla(205,8%,50%,.15),0 3.28515px 12.0455px hsla(205,8%,50%,.103),0 1.59488px 5.84789px hsla(205,8%,50%,.083),0 .781839px 2.86674px hsla(205,8%,50%,.067),0 .30914px 1.13351px hsla(205,8%,50%,.047);padding:22px;position:absolute;right:22px;top:20px;z-index:5}.tc-table-desktop-actions-dropdown__action{align-items:center;background-color:transparent;border:none;box-shadow:none;cursor:pointer;display:flex;font-family:inherit;font-size:inherit;font-weight:inherit;margin:0 0 .9em;padding:0;width:100%}.tc-table-desktop-actions-dropdown__action:focus,.tc-table-desktop-actions-dropdown__action:hover{opacity:.7;outline:none}.tc-table-desktop-actions-dropdown__action:last-child{margin-bottom:0}.tc-table-desktop-actions-dropdown__action-icon{display:block;flex:none;margin-right:.9em}.tc-table-mobile-header{align-items:center;border-bottom:1px solid #d8dfea;display:flex;padding:16px 10px}.tc-table-mobile-header__button{align-items:center;background-color:transparent;border:1px solid #334580;border-radius:50%;color:#334580;cursor:pointer;display:flex;flex:none;flex-shrink:0;height:36px;justify-content:center;margin-left:auto;outline:none;padding:0;position:relative;text-align:center;text-decoration:none;width:36px}.tc-table-mobile-header__button+.tc-table-mobile-header__button{margin-left:16px}.tc-table-mobile-header__button svg{display:inline-block;height:16px;width:16px}.tc-table-mobile-header__filter{flex:0 1 55%;margin-right:auto;max-width:260px;position:relative}.tc-table-mobile-header__filter-input{background-color:#e8efff;border:none;border-radius:25px;font-size:1em;height:36px;padding:0 36px 0 16px;width:100%}.tc-table-mobile-header__filter-icons{align-items:center;display:flex;height:36px;justify-content:center;position:absolute;right:0;top:0;width:36px;z-index:5}.tc-table-mobile-header__filter-clear-btn{align-items:center;background-color:transparent;border:none;box-shadow:none;display:flex;flex:none;height:100%;justify-content:center;margin:0;outline:none;padding:0;width:100%}.tc-table-mobile-header__filter-clear-icon,.tc-table-mobile-header__filter-search-icon{display:block;height:14px;margin:auto;width:14px}.tc-table-desktop{box-shadow:0 1px 6px rgba(0,0,0,.12);box-sizing:border-box;font-size:18px;font-weight:300;line-height:1.15;position:relative}.tc-table-desktop *{box-sizing:inherit}.tc-table-desktop__inner{border-bottom:1px solid #d8dfea;border-spacing:0;overflow:auto;scrollbar-color:#dfe7f9 transparent;scrollbar-width:thin}.tc-table-desktop__inner::-webkit-scrollbar{height:8px;width:8px}.tc-table-desktop__inner::-webkit-scrollbar-track{background:transparent;border-top:1px solid #d8dfea}.tc-table-desktop__inner::-webkit-scrollbar-thumb{background-color:#dfe7f9;border:none;border-radius:15px}.tc-table-desktop__action-cell{background-color:#fff;border-left:1px solid #d8dfea;flex:none!important;padding:0;position:sticky!important;right:0;top:0;z-index:5}.tc-table-desktop .resizer{height:100%;position:absolute;right:0;top:0;touch-action:none;transform:translateX(50%);width:20px;z-index:1}.tc-table-mobile{box-shadow:0 4px 12px rgba(0,0,0,.12);box-sizing:border-box;font-size:16px;position:relative}.tc-table-mobile *{box-sizing:inherit}.tc-table-mobile__row+.tc-table-mobile__row{border-top:1px solid #d8dfea}.tc-table-mobile__row-header{align-items:center;display:flex;justify-content:space-between}.tc-table-mobile__row-title{flex-grow:0;font-size:1em;font-weight:400;line-height:1.15;margin:0;max-width:calc(100% - 60px);overflow:hidden;padding:16px 10px;text-overflow:ellipsis;text-transform:none}.tc-table-mobile__row-trigger{align-items:center;background-color:transparent;border:none;color:inherit;cursor:pointer;display:flex;flex-grow:1;font-family:inherit;font-size:inherit;padding:16px 10px;text-align:right}.tc-table-mobile__row-trigger:focus{opacity:.7;outline:none}.tc-table-mobile__chevron{display:block;height:1.125em;margin-left:auto;width:1em}.tc-table-mobile__chevron--up{transform:rotate(180deg)}.tc-table-mobile__row-inner{padding:0 10px 16px}.tc-table-mobile__row-data{animation:appear .15s ease-out forwards;background-color:#e8efff;border-radius:10px}.tc-table-mobile__row-data-item{align-items:flex-start;display:flex;font-size:.875em;justify-content:space-between;padding:.625em}.tc-table-mobile__row-data-item--vertical{display:block}.tc-table-mobile__row-data-item .tc-table-mobile__value{margin-top:10px;width:100%}.tc-table-mobile__row-data-item .tc-table-mobile__label{padding-right:0;width:100%}.tc-table-mobile__row-data-item+.tc-table-mobile__row-data-item{border-top:1px solid #fff}.tc-table-mobile__label{padding-right:15px;width:50%}.tc-table-mobile__value{width:50%}.tc-table-mobile__actions{align-items:flex-start;display:flex;flex-direction:column;justify-content:flex-start;margin-top:1em}@keyframes appear{0%{transform:translate3d(0,-12px,0)}to{transform:translateZ(0)}}.tc-table-desktop-header{border-bottom:1px solid #d8dfea}.tc-table-desktop-body,.tc-table-desktop-header{display:inline-block;min-width:100%}.tc-table-desktop-pagination{align-items:center;display:flex;padding:1.2em}.tc-table-desktop-pagination__left{margin-right:1.2em}.tc-table-desktop-pagination__right{margin-left:auto}.tc-table-desktop-pagination__buttons{align-items:center;display:flex;flex-wrap:wrap;justify-content:space-between}.tc-table-desktop-pagination__current-page{align-items:center;border:1px solid #334580;border-radius:5px;display:flex;font-weight:400;height:2.33em;justify-content:center;width:2.33em}.tc-table-desktop-pagination__of-total{margin:0 .66em}.tc-table-desktop-pagination__page-count{align-items:center;display:flex}.tc-table-desktop-pagination__page-count-select{flex:none;font-size:inherit;height:2.33em;margin-left:.89em;width:68px}.tc-table-desktop-pagination-button{align-items:center;background-color:#fff;border:1px solid #d8dfea;border-radius:5px;box-shadow:none;color:inherit;cursor:pointer;display:flex;font-family:inherit;font-size:inherit;font-weight:inherit;height:2.33em;justify-content:center;margin-right:.66em;outline:none;text-decoration:none;width:2.33em}.tc-table-desktop-pagination-button svg{display:block;flex:none;height:.7em;width:.7em}.tc-table-desktop-pagination-button:last-child{margin-right:0}.tc-table-desktop-pagination-button:hover{border-color:#334580}.tc-table-desktop-pagination-button:disabled{border-color:#e3e5e7;color:#e3e5e7;cursor:not-allowed}.tc-table-mobile-sorting{margin:0 -20px}.tc-table-mobile-sorting__section{border-top:1px solid rgba(0,0,0,.12);padding:22px 20px}.tc-table-mobile-sorting__section:first-child{border-top:none;padding-top:0}.tc-table-mobile-sorting__section:last-child{padding-bottom:0}.tc-table-mobile-sorting__checkfield{margin-bottom:22px}.tc-table-mobile-sorting__checkfield:last-child{margin-bottom:0}.tc-table-mobile-filtration{padding:8px 0}.tc-table-mobile-filtration__column{margin-bottom:10px}.tc-table-mobile-filtration__column:last-child{margin-bottom:0}.tc-table-mobile-filtration__title{line-height:1.15;margin-bottom:6px}.tc-table-mobile-filtration__field .tc-table-filter-input,.tc-table-mobile-filtration__field .tc-table-select{border-radius:10px;color:rgba(0,0,0,.54);font-family:inherit;font-size:inherit;font-weight:inherit;height:40px;max-width:100%;padding:0 16px}.tc-table-mobile-pagination{text-align:center}.tc-table-mobile-pagination__counter{padding:22px 10px}.tc-table-mobile-pagination__showing{color:#4876ec}.tc-table-mobile-pagination__show-more{background:#ededed;border:none;border-radius:45px;color:rgba(0,0,0,.5);cursor:pointer;margin:16px 0 32px;outline:none;padding:16px 32px}.tc-table-mobile-action{background-color:transparent;border:none;box-shadow:none;color:inherit;cursor:pointer;display:block;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:1.15;margin:0 0 1em;padding:0;width:100%}.tc-table-mobile-action:focus,.tc-table-mobile-action:hover{opacity:.7;outline:none}.tc-table-mobile-action:last-child{margin-bottom:0}.tc-table-mobile-action__inner{align-items:center;display:flex;height:100%;width:100%}.tc-table-mobile-action__icon{align-items:center;display:flex;font-size:1.625em;height:1em;justify-content:center;margin-right:.615em;width:1em}.tc-table-mobile-action__icon svg{display:inline-block;flex:none}.tc-table-mobile-action__label{padding:.25em 0}