Contents

@import "../tokens/colors";
@import "../tokens/opacity";
@import "../tokens/border_radius";
@import "../tokens/spacing";
@import "./scss_partials/loading";
@import "./scss_partials/pseudo_states";
@import "./scss_partials/chrome_styles";

.pb_advanced_table {
  $border-color: 1px solid $border_light !important;

  [id$="-span"] {
    word-wrap: normal;
  }

  .bg-silver {
    background-color: lighten($silver, $opacity_7);
  }

  .bg-white {
    background-color: $white;
  }

  .full-width {
    width: 100%;
  }

  .table-header-cells:first-child {
    min-width: 180px;
  }

  .table-header-cells-active:first-child {
    color: $primary !important;
  }

  // Icons
  .button-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    background: none;
    border: none;
  }

  .gray-icon {
    color: $text_lt_light;
    @extend %primary-color-pseudo;
  }

  .sort-button-icon {
    @extend .button-icon;
    padding: 2px;
  }

  .toggle-all-icon {
    @extend .button-icon;
    @extend %primary-color-pseudo;
    padding: 2px 0;

    &:focus-visible {
      border-radius: $border_rad_lighter;
    }
  }

  .expand-toggle-icon {
    @extend .button-icon;
    @extend %primary-color-pseudo;
    position: relative;
    bottom: 1px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
  }

  .header-sort-button {
    @extend %primary-color-pseudo;
    width: 100%;

    &:focus-visible {
      border-radius: $border_rad_heavier;
    }
  }

  // Vertical separator
  .table-header-cells:first-child,
  td:first-child {
    box-shadow: 1px 0px 0px 0px #e4e8f0 !important;
  }

  @include chrome_styles($border-color);
}

Version data entries

1 entries across 1 versions & 1 rubygems

Version	Path
playbook_ui-13.20.0.pre.alpha.PBNTR225advancedtablefeedback2375	app/pb_kits/playbook/pb_advanced_table/_advanced_table.scss