<commit_before>.query-builder {
  position: absolute;
  width: calc(100% - #{($explorer-page-padding * 2)});
  left: $explorer-page-padding;
  height: 40%;
  top: 60%;
  border: 0;
  display: flex;
  align-items: stretch;
  justify-content: space-between;
}

// Tabs
.query-builder--tabs {
  display: flex;
  width: 250px;
  margin-top: $de-vertical-margin;
  height: calc(100% - #{($de-vertical-margin * 2)});
  flex-direction: column;
  align-items: stretch;
  @include gradient-v($g3-castle,$g1-raven);
  border-radius: $radius 0 0 $radius;
}
.query-builder--tabs-heading {
  height: 60px;
  padding: 0 9px 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;

  h1 {
    font-size: 17px;
    font-weight: 400;
    text-transform: uppercase;
    color: $g18-cloud;
    margin: 0;
  }
}
.query-builder--tab {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: $g11-sidewalk;
  background: transparent;
  height: 30px;
  cursor: pointer;
  padding: 0 8px 0 16px;
  transition:
      color 0.25s ease,
      background-color 0.25s ease;

  &:hover {
    color: $g15-platinum;
    background-color: $g4-onyx;
  }
  &.active {
    color: $g18-cloud;
    background: $g5-pepper;
  }

  &-delete {
    margin: 0;
    width: 16px;
    height: 16px;
    background-color: transparent;
    display: inline-block;
    vertical-align: text-top;
    position: relative;

    &:before,
    &:after {
      display: block;
      content: '';
      width: 8px;
      height: 2px;
      background-color: $g8-storm;
      transition:
        background-color 0.25s ease;
      position: absolute;
      top: 50%;
      left: 50%;
    }
    &:before {
      transform: translate(-50%,-50%) rotate(45deg);
    }
    &:after {
      transform: translate(-50%,-50%) rotate(-45deg);
    }

    &:hover {
      &:before,
      &:after {
        background-color: $c-dreamsicle;
      }
    }
  }
}
.panel--tab-new {
  > .dropdown-toggle {
    height: 30px !important;
    border-radius: $radius;
    background-color: $c-pool;
    color: $g20-white !important;
    padding: 0;

    > .icon {
      margin: 0;
      font-size: 12px;
      position: relative;
      top: -1px;
    }
    &:hover {
      background-color: $c-laser;
    }
  }
  > .dropdown-menu {
    width: 108px !important;
    min-width: 108px !important;
    max-width: 108px !important;
  }
}
.panel--tab-new.open {
  > .dropdown-toggle,
  > .dropdown-toggle:hover {
    background-color: $c-laser !important;
    color: $g20-white !important;
  }
}
.query-builder--tab-label {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  max-width: 177px;
  text-overflow: ellipsis;<commit_msg>Query + button has proper margins<commit_after>.query-builder {
  position: absolute;
  width: calc(100% - #{($explorer-page-padding * 2)});
  left: $explorer-page-padding;
  height: 40%;
  top: 60%;
  border: 0;
  display: flex;
  align-items: stretch;
  justify-content: space-between;
}

// Tabs
.query-builder--tabs {
  display: flex;
  width: 250px;
  margin-top: $de-vertical-margin;
  height: calc(100% - #{($de-vertical-margin * 2)});
  flex-direction: column;
  align-items: stretch;
  @include gradient-v($g3-castle,$g1-raven);
  border-radius: $radius 0 0 $radius;
}
.query-builder--tabs-heading {
  height: 60px;
  padding: 0 9px 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;

  h1 {
    font-size: 17px;
    font-weight: 400;
    text-transform: uppercase;
    color: $g18-cloud;
    margin: 0;
  }
}
.query-builder--tab {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: $g11-sidewalk;
  background: transparent;
  height: 30px;
  cursor: pointer;
  padding: 0 8px 0 16px;
  transition:
      color 0.25s ease,
      background-color 0.25s ease;

  &:hover {
    color: $g15-platinum;
    background-color: $g4-onyx;
  }
  &.active {
    color: $g18-cloud;
    background: $g5-pepper;
  }

  &-delete {
    margin: 0;
    width: 16px;
    height: 16px;
    background-color: transparent;
    display: inline-block;
    vertical-align: text-top;
    position: relative;

    &:before,
    &:after {
      display: block;
      content: '';
      width: 8px;
      height: 2px;
      background-color: $g8-storm;
      transition:
        background-color 0.25s ease;
      position: absolute;
      top: 50%;
      left: 50%;
    }
    &:before {
      transform: translate(-50%,-50%) rotate(45deg);
    }
    &:after {
      transform: translate(-50%,-50%) rotate(-45deg);
    }

    &:hover {
      &:before,
      &:after {
        background-color: $c-dreamsicle;
      }
    }
  }
}
.panel--tab-new {
  > .dropdown-toggle {
    height: 30px !important;
    border-radius: $radius;
    background-color: $c-pool;
    color: $g20-white !important;
    padding: 0;

    > .icon {
      margin: 0 !important;
      font-size: 12px;
      position: relative;
      top: -1px;
    }
    &:hover {
      background-color: $c-laser;
    }
  }
  > .dropdown-menu {
    width: 108px !important;
    min-width: 108px !important;
    max-width: 108px !important;
  }
}
.panel--tab-new.open {
  > .dropdown-toggle,
  > .dropdown-toggle:hover {
    background-color: $c-laser !important;
    color: $g20-white !important;
  }
}
.query-builder--tab-label {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  max-width: 177px;
  text-overflow: ellipsis;
{'fraction_non_alphanumeric': 0.1527403414195867, 'fraction_numerical': 0.04132973944294699, 'mean_word_length': 2.4809255784865543, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 13, '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': '6883520', 'n_tokens_mistral': 2223, 'n_tokens_neox': 2022, 'n_words': 438}