<commit_before>@mixin small-listable-header() {
  div[mw-listable-head-2] {
    .mw-listable-header {
      left: 0;
      margin-bottom: 20px;
      box-sizing: border-box;
      padding: 15px 5px;
      background: white;
      border-bottom: 2px solid #999;
      z-index: 9;

      &:after{
        background: none;
      }

      &.has-selection-control{
        margin-bottom: 55px;
      }

      .selection-controller,
      .selected-counter {
        margin: 0
      }

      .selected-items .items {
        padding: 10px 0;
      }

      .selection-controller{
        position: absolute;
        bottom: -27px;
        width: 100%;
        left: 0;

        .holder{
          width: inherit;
          display: flex;

          .select-all,
          .clear{
            flex-basis: 50%;
            text-align: center;
            padding: 3px;
            border: 1px solid #ddd;
            position: relative;
            background: white;

            a{
              text-decoration: none !important;
            }

            .selected-icon,
            .close_cross{
              left: 6px;
              position: absolute;
              top: 6px;
            }

            &:hover{
              background: #efefef;
            }
          }
        }
      }

      .search-bar{
        margin-left: -5px;
        width: 50%;
        -webkit-flex-basis: 50%;
        flex-basis:50%;

        .input-group{
          width: 100%;
          background: transparent;

          input{
            width: 80%;
          }
        }

        ~.selected-counter{
          -webkit-flex-basis: 50%;
          flex-basis: 50%
        }

        &.focused {
          width: 100%;
          flex-basis:70%;

          .input-group{
            width: 100%;

            input{
              width: 90%;
            }
          }

          ~.selected-counter{
            flex-basis: 30%
          }
        }
      }
    }

    &.affixed{
      .selection-controller{
        display: none;
      }
    }
  }
}

div[mw-listable-head-2] {
  position: relative;
  z-index: 10;
  @include single-transition(opacity, 0.5s, cubic-bezier(0, .33, .79, 1.46));

  &.has-extra-content {
    .extra-content {
      display: inline-block;
    }
  }
}

.mw-listable-header {
  width: 100%;
  background: #efefef;
  padding: 5px 7px 5px 10px;
  color: #555;
  font-size: 12px;
  margin-bottom: 15px;
  height: 22px;
  left: -16px;
  box-sizing: content-box;
  position: relative;

  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-align-items: center;
  align-items: center;

  &:after{
    content: '';
    position: absolute;
    left: -1px;
    top: 0;
    height: 105%;
    width: 1px;
    background: #efefef;
  }

  .selection-controller,
  .search-bar,
  .selected-counter
  {
    -webkit-flex-basis: 100%;
    flex-basis: 100%;
  }

  .selection-controller {
    margin-left: 10px;

    .select-all {

      .selected-icon {
        width: 12px;
        height: 12px;
        display: inline-block;
        border: 1px solid $brand-primary;
        vertical-align: text-top;
        position: relative;

        .indicator {
          width: 60%;
          height: 60%;
          background: $brand-primary;
          display: inline-block;
          position: absolute;
          top: 20%;
          left: 20%;
        }
      }
    }

    .clear {
      border-left: 1px solid #ccc;
      margin-left: 3px;
      padding-left: 2px;

      &:first-child {
        border-left: none;
      }

      i {
        font-size: 10px;
        margin: 2px -4px 0 0;
        vertical-align: text-top;
        color: $brand-primary;
      }
    }

  }

  .search-bar {
    margin: 0 auto;
    min-width: 0;
    -webkit-flex-basis: 80%;
    flex-basis: 80%;
    @include single-transition(flex-basis, 0.4s, ease);

    .input-holder{
      border-bottom: none;
      color: $brand-primary;
      background: rgba(255, 255, 255, 0.7);
      @include single-transition(background, 0.8, ease);

      input {
        border: none;
        box-shadow: none;
        background: transparent;
        padding: 0 0 0 3px;
        font-size: 12px;
        height: 32px;<commit_msg>fix style<commit_after>@mixin small-listable-header() {
  div[mw-listable-head-2] {
    .mw-listable-header {
      left: 0;
      margin-bottom: 20px;
      box-sizing: border-box;
      padding: 15px 5px;
      background: white;
      border-bottom: 2px solid #999;
      z-index: 9;

      &:after{
        background: none;
      }

      &.has-selection-control{
        margin-bottom: 55px;
      }

      .selection-controller,
      .selected-counter {
        margin: 0
      }

      .selected-items .items {
        padding: 10px 0;
      }

      .selection-controller{
        position: absolute;
        bottom: -27px;
        width: 100%;
        left: 0;

        .holder{
          width: inherit;
          display: flex;

          .select-all,
          .clear{
            flex-basis: 50%;
            text-align: center;
            padding: 3px;
            border: 1px solid #ddd;
            position: relative;
            background: white;

            a{
              text-decoration: none !important;
            }

            .selected-icon,
            .close_cross{
              left: 6px;
              position: absolute;
              top: 6px;
            }

            &:hover{
              background: #efefef;
            }
          }
        }
      }

      .search-bar{
        margin-left: -5px;
        width: 50%;
        -webkit-flex-basis: 50%;
        flex-basis:50%;

        .input-group{
          width: 100%;
          background: transparent;

          input{
            width: 80%;
          }
        }

        ~.selected-counter{
          -webkit-flex-basis: 50%;
          flex-basis: 50%
        }

        &.focused {
          width: 100%;
          flex-basis:70%;

          .input-group{
            width: 100%;

            input{
              width: 90%;
            }
          }

          ~.selected-counter{
            flex-basis: 30%
          }
        }
      }
    }

    &.affixed{
      .selection-controller{
        display: none;
      }
    }
  }
}

div[mw-listable-head-2] {
  position: relative;
  z-index: 10;
  @include single-transition(opacity, 0.5s, cubic-bezier(0, .33, .79, 1.46));

  &.has-extra-content {
    .extra-content {
      display: inline-block;
    }
  }
}

.mw-listable-header {
  width: 100%;
  background: #efefef;
  padding: 5px 7px 5px 10px;
  color: #555;
  font-size: 12px;
  margin-bottom: 15px;
  height: 22px;
  left: -16px;
  box-sizing: content-box;
  position: relative;

  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-align-items: center;
  align-items: center;

  &:after{
    content: '';
    position: absolute;
    left: -1px;
    top: 0;
    height: 105%;
    width: 1px;
    background: #efefef;
  }

  .selection-controller,
  .search-bar,
  .selected-counter
  {
    -webkit-flex-basis: 100%;
    flex-basis: 100%;
  }

  .selection-controller {
    margin-left: 10px;

    .select-all {

      .selected-icon {
        width: 12px;
        height: 12px;
        display: inline-block;
        border: 1px solid $brand-primary;
        vertical-align: text-top;
        position: relative;

        .indicator {
          width: 60%;
          height: 60%;
          background: $brand-primary;
          display: inline-block;
          position: absolute;
          top: 20%;
          left: 20%;
        }
      }
    }

    .clear {
      border-left: 1px solid #ccc;
      margin-left: 3px;
      padding-left: 2px;

      &:first-child {
        border-left: none;
      }

      i {
        vertical-align: text-top;
        color: $brand-primary;
      }
    }

  }

  .search-bar {
    margin: 0 auto;
    min-width: 0;
    -webkit-flex-basis: 80%;
    flex-basis: 80%;
    @include single-transition(flex-basis, 0.4s, ease);

    .input-holder{
      border-bottom: none;
      color: $brand-primary;
      background: rgba(255, 255, 255, 0.7);
      @include single-transition(background, 0.8, ease);

      input {
        border: none;
        box-shadow: none;
        background: transparent;
        padding: 0 0 0 3px;
        font-size: 12px;
        height: 32px;
{'fraction_non_alphanumeric': 0.1250443210022456, 'fraction_numerical': 0.03592955915376433, 'mean_word_length': 1.3776341669008147, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4995984', 'n_tokens_mistral': 3068, 'n_tokens_neox': 2675, 'n_words': 581}