MontrealNewTech/website

.cell-label {
  @include data-label;

  &:hover {
    a {
      color: $action-color;
    }

    svg {
      fill: $action-color;
      transform: rotate(180deg);
    }
  }

  a {
    @include fill-parent;
    color: inherit;
    display: inline-block;
    transition: color $base-duration $base-timing;
  }
}

.cell-label--asc,
.cell-label--desc {
  font-weight: $bold-font-weight;
}

.cell-label__sort-indicator {
  display: inline-block;
  height: 1em;
  overflow: hidden;
  position: absolute;
  right: 0;

  svg {
    height: 100%;
    transition: transform $base-duration $base-timing;
    fill: $hint-grey;
  }
}

.cell-label__sort-indicator--desc {
  transform: rotate(180deg);
}

.cell-data--number,
.cell-label--number {
  text-align: right;
}