// Table Header .table-header { width: 100%; color: $primary-dark; line-height: 30px; padding: .8em 0 0; margin-bottom: .8em; border-bottom: 1px solid $border-color-01; font-size: 1.25em; @include mediaQuery(medium) { margin: 1.8em 0; } } // Table .table { width: 100%; } .table__body { width: 100%; } .table__row { display: flex; width: 100%; max-width: calc(100vw - 10px); flex-wrap: wrap; font-weight: 400; position: relative; &.disabled { background-color: $background-03; color: $text-02; } } .table__row-save { position: absolute; top: 0; left: 0; width: 100%; height:100%; background: $background-04; z-index:200; color: $primary-light; padding: .8em 1em; text-align: center; font-size: 1.5em; font-weight: bold; } .table__cell { flex: 0 0 100%; line-height: 2.8em; padding: .5em 1em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-bottom: 1px solid $border-color-01; @include mediaQuery(small) { flex: 1; } // //@include mediaQuery(large) { // padding: 15px 30px; //} } .table__cell-label { display: inline-block; font-weight: 700; min-width: 50%; padding-right: 15px; @include mediaQuery(small) { display: none; } } // Table Head .table__head { width: 100%; .table__row { display: none; font-weight: 700; border-bottom: 1px solid $border-color-01; background-color: $background-05; color: $primary-light; @include mediaQuery(small) { display: flex; } .table__cell { @include fastTransition-all(); position: relative; border: 0; &:last-child { border: 0; } } } } .table__row-uploading { color: $text-02; font-weight: 700; @include indeterminate-bar; } // sensor fixed table header on scroll .fixed-table-header{ position: sticky; top: 130px; z-index: 1; } //sortable heading .sort-heading { position: relative; color: $text-03; &::after { content: '\025be'; position: absolute; right: -20px; top: -1px; font-size: 1.3em; } &::before { content: '\025be'; position: absolute; right: -20px; top: -10px; font-size: 1.3em; transform: rotate(180deg); } &.sort-up { &::before { color: $primary-accent; } } &.sort-down { &::after { color: $primary-accent; } } } .bmc-table { width: 100%; &.small { font-size: 90%; } } .bmc-table__row { border-bottom: 1px solid $border-color-01; } .bmc-table__column-header { padding: 10px 16px; background-color: $background-03; } .bmc-table__cell { padding: 10px 16px; background-color: $base-02--07; } .bmc-table__row-actions { text-align: right; .btn { padding-top: 0; padding-bottom: 0; } }