bsw/jbe@1309: /**
bsw/jbe@1309:  * Copyright 2015 Google Inc. All Rights Reserved.
bsw/jbe@1309:  *
bsw/jbe@1309:  * Licensed under the Apache License, Version 2.0 (the "License");
bsw/jbe@1309:  * you may not use this file except in compliance with the License.
bsw/jbe@1309:  * You may obtain a copy of the License at
bsw/jbe@1309:  *
bsw/jbe@1309:  *      http://www.apache.org/licenses/LICENSE-2.0
bsw/jbe@1309:  *
bsw/jbe@1309:  * Unless required by applicable law or agreed to in writing, software
bsw/jbe@1309:  * distributed under the License is distributed on an "AS IS" BASIS,
bsw/jbe@1309:  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
bsw/jbe@1309:  * See the License for the specific language governing permissions and
bsw/jbe@1309:  * limitations under the License.
bsw/jbe@1309:  */
bsw/jbe@1309: 
bsw/jbe@1309: @import "../variables";
bsw/jbe@1309: @import "../mixins";
bsw/jbe@1309: 
bsw/jbe@1309: .mdl-data-table {
bsw/jbe@1309:   position: relative;
bsw/jbe@1309:   border: $data-table-dividers;
bsw/jbe@1309:   border-collapse: collapse;
bsw/jbe@1309:   white-space: nowrap;
bsw/jbe@1309:   font-size: $data-table-font-size;
bsw/jbe@1309:   background-color: unquote("rgb(#{$color-white})");
bsw/jbe@1309: 
bsw/jbe@1309:   thead {
bsw/jbe@1309:     padding-bottom: 3px;
bsw/jbe@1309: 
bsw/jbe@1309:     .mdl-data-table__select {
bsw/jbe@1309:       margin-top: 0;
bsw/jbe@1309:     }
bsw/jbe@1309:   }
bsw/jbe@1309: 
bsw/jbe@1309:   tbody {
bsw/jbe@1309:     tr {
bsw/jbe@1309:       position: relative;
bsw/jbe@1309:       height: $data-table-row-height;
bsw/jbe@1309:       @include material-animation-default(0.28s);
bsw/jbe@1309:       transition-property: background-color;
bsw/jbe@1309: 
bsw/jbe@1309:       &.is-selected {
bsw/jbe@1309:         background-color: $data-table-selection-color;
bsw/jbe@1309:       }
bsw/jbe@1309: 
bsw/jbe@1309:       &:hover {
bsw/jbe@1309:         background-color: $data-table-hover-color;
bsw/jbe@1309:       }
bsw/jbe@1309:     }
bsw/jbe@1309:   }
bsw/jbe@1309: 
bsw/jbe@1309:   td, th {
bsw/jbe@1309:     padding: 0 $data-table-column-padding 12px $data-table-column-padding;
bsw/jbe@1309:     text-align: right;
bsw/jbe@1309: 
bsw/jbe@1309:     &:first-of-type {
bsw/jbe@1309:       padding-left: 24px;
bsw/jbe@1309:     }
bsw/jbe@1309: 
bsw/jbe@1309:     &:last-of-type {
bsw/jbe@1309:       padding-right: 24px;
bsw/jbe@1309:     }
bsw/jbe@1309:   }
bsw/jbe@1309: 
bsw/jbe@1309:   td {
bsw/jbe@1309:     position: relative;
bsw/jbe@1309:     vertical-align: middle;
bsw/jbe@1309:     height: $data-table-row-height;
bsw/jbe@1309:     border-top: $data-table-dividers;
bsw/jbe@1309:     border-bottom: $data-table-dividers;
bsw/jbe@1309:     padding-top: $data-table-cell-top;
bsw/jbe@1309:     box-sizing: border-box;
bsw/jbe@1309: 
bsw/jbe@1309:     .mdl-data-table__select {
bsw/jbe@1309:       vertical-align: middle;
bsw/jbe@1309:     }
bsw/jbe@1309:   }
bsw/jbe@1309: 
bsw/jbe@1309:   th {
bsw/jbe@1309:     position: relative;
bsw/jbe@1309:     vertical-align: bottom;
bsw/jbe@1309:     text-overflow: ellipsis;
bsw/jbe@1309:     @include typo-body-2();
bsw/jbe@1309:     height: $data-table-row-height;
bsw/jbe@1309:     font-size: $data-table-header-font-size;
bsw/jbe@1309:     color: $data-table-header-color;
bsw/jbe@1309:     padding-bottom: 8px;
bsw/jbe@1309:     box-sizing: border-box;
bsw/jbe@1309: 
bsw/jbe@1309:     &.mdl-data-table__header--sorted-ascending,
bsw/jbe@1309:     &.mdl-data-table__header--sorted-descending {
bsw/jbe@1309:       color: $data-table-header-sorted-color;
bsw/jbe@1309:       &:before {
bsw/jbe@1309:         @include typo-icon;
bsw/jbe@1309:         font-size: $data-table-header-sort-icon-size;
bsw/jbe@1309:         content: "\e5d8";
bsw/jbe@1309:         margin-right: 5px;
bsw/jbe@1309:         vertical-align: sub;
bsw/jbe@1309:       }
bsw/jbe@1309:       &:hover {
bsw/jbe@1309:         cursor: pointer;
bsw/jbe@1309:         &:before {
bsw/jbe@1309:           color: $data-table-header-sorted-icon-hover-color;
bsw/jbe@1309:         }
bsw/jbe@1309:       }
bsw/jbe@1309:     }
bsw/jbe@1309:     &.mdl-data-table__header--sorted-descending:before {
bsw/jbe@1309:       content: "\e5db";
bsw/jbe@1309:     }
bsw/jbe@1309:   }
bsw/jbe@1309: }
bsw/jbe@1309: 
bsw/jbe@1309: .mdl-data-table__select {
bsw/jbe@1309:   width: 16px;
bsw/jbe@1309: }
bsw/jbe@1309: 
bsw/jbe@1309: .mdl-data-table__cell--non-numeric.mdl-data-table__cell--non-numeric {
bsw/jbe@1309:   text-align: left;
bsw/jbe@1309: }