AugurProject/augur-ui

View on GitHub
src/modules/app/less/tables.less

Summary

Maintainability
Test Coverage
@import (reference) '~assets/styles/shared';

// TABLES
//     Styles + mixins for the display of tables

.table-cell-spacing {
  padding: 0.8em 0;

  @media @breakpoint-mobile {
    padding: 1.5em 0;
  }
}

.table {
  display: flex;
  flex-direction: column;
}

.table-header {
  display: flex;
  flex: 1;
  font-weight: 400;

  & > * {
    .table-cell-spacing();
  }
}

.table-row {

  .border(true, @border-top, @border-light);

  display: flex;
  flex: 1;

  & > * {
    .table-cell-spacing();

    &:not(:first-child) {
      .border(true, @border-left, @border-light);
    }
  }

  &.selected {
    .border(true, @border-top, @color-blue-light);
    .border(true, @border-right, @color-blue-light);
    .border(true, @border-bottom, @color-blue-light);
    .border(true, @border-left, @color-blue, @border-width-3);

    background-color: @color-blue-extra-light;
  }

  &:hover,
  &:active {
    background-color: @color-blue-extra-light;
  }

  &.not-selectable:hover {
    background-color: @color-gray-light;
  }
}