@import "../common/varible";
@import "../common/function";

.yu-table {
  font-family: $font-family;
  border-collapse: collapse;
  thead {
    tr {
      th {
        font-size: $normal;
        color: $text;
        box-sizing: border-box;
        padding: $space 0;
        border-bottom: 1px solid $border;
        .cell {
          padding: 0 $space-small;
          text-align: left;
        }
      }
    }
  }

  tfoot {
    tr {
      td {
        font-size: $normal;
        color: $text;
        box-sizing: border-box;
        padding: $space 0;
        border-bottom: 1px solid $border;
        .cell {
          padding: 0 $space-small;
          text-align: left;
        }
      }
      background-color: $background;
    }
  }

  tbody {
    tr {
      td {
        font-size: $normal;
        color: $text;
        box-sizing: border-box;
        padding: $space 0;
        border-bottom: 1px solid $border;
        .cell {
          padding: 0 $space-small;
        }
        a {
          color: $primary;
          cursor: pointer;
          &:hover {
            color: lighten($primary, 10);
          }
        }
      }
      transition: background-color .4s;
      @include generalAllColorTableTr();
      &:hover {
        background-color: $background;
      }
    }
  }

  &.celled {
    td, th {
      border-right: 1px solid $border;
    }
    border: 1px solid $border;
  }

  &.stripe {
    tbody {
      tr:nth-child(2n) {
        background-color: $tr-background;
        &:hover {
          background-color: $background;
        }
      }
    }
  }
}