<commit_before>// TODO: needs to be swapped out for a semantic colour.
$search-border: #b8c6cc;

body.search {
  #global-header #search,
  #global-breadcrumb {
    display: none;
  }
}

.search {
  padding-bottom: 30px;
  background: $white;

  @include media(tablet) {
    padding-bottom: 60px;
  }

  h1 {
    @include core-24;
    font-weight: bold;
    padding-bottom: 10px;
  }

  .search-header {
    position: relative;
    margin: 0;
    padding: 10px 15px 15px;
    overflow: visible;

    @include media(tablet) {
      padding: 20px 30px 30px;
      width: 66.666%;
    }

    .search-input {
      position: static;
      margin: 0;
      padding: 0 50px 0 0;

      @include ie(7) {
        padding-right: 62px;
      }
    }

    .search-submit {
      position: absolute;
      bottom: 15px;
      right: 15px;
      height: 50px;
      width: 50px;
      overflow: visible;

      @include media(tablet) {
        bottom: 30px;
        right: 30px;
      }
    }

    input {
      @include core-19;
      @include box-sizing(border-box);
      width: 100%;
      margin: 0;
      padding: 0 0 0 10px;
      display: block;
      height: 50px;
      border-color: $search-border;
      border-right: none;
      line-height: 48px!important;

      &::-webkit-search-cancel-button {
        -webkit-appearance: none;
      }

      @include ie-lte(7) {
        height: 48px;
        margin-bottom: -1px;
      }
    }

    button {
      @include border-radius(0);
      @include box-shadow(none);
      position: absolute;
      z-index: 4;
      right: 0;
      top: 0;
      width: 50px;
      height: 50px;
      border: none;
      overflow: hidden;
      text-indent: -5000px;
      color: $white;
      background-color: #28a197;
      background-image: image-url("search/search-button.png");
      background-repeat: no-repeat;
      background-position: -12.5% 50%;
      &:hover {
        background-color: #3ABAA8;
      }
    }
  }

  #search-results-tabs.shouty-tabs {
    #search-index-navigation {
      position: relative;
      top: 1px;
      margin: 0;
      padding: 0 15px;

      @include media(tablet) {
        padding: 0 30px;
      }

      li {
        margin: 0;
        float: left;
        display: inline;
        list-style: none;
      }

      a {
        display: block;
        overflow: hidden;
        margin: 5px 5px 6px;
        padding: 4px 4px;
        text-decoration: none;
        background: $grey-2;
        border: 1px solid $grey-2;
        border-bottom: none;

        &:hover,<commit_msg>Replace grey-2 with equivalent semantic colour name<commit_after>// TODO: needs to be swapped out for a semantic colour.
$search-border: #b8c6cc;

body.search {
  #global-header #search,
  #global-breadcrumb {
    display: none;
  }
}

.search {
  padding-bottom: 30px;
  background: $white;

  @include media(tablet) {
    padding-bottom: 60px;
  }

  h1 {
    @include core-24;
    font-weight: bold;
    padding-bottom: 10px;
  }

  .search-header {
    position: relative;
    margin: 0;
    padding: 10px 15px 15px;
    overflow: visible;

    @include media(tablet) {
      padding: 20px 30px 30px;
      width: 66.666%;
    }

    .search-input {
      position: static;
      margin: 0;
      padding: 0 50px 0 0;

      @include ie(7) {
        padding-right: 62px;
      }
    }

    .search-submit {
      position: absolute;
      bottom: 15px;
      right: 15px;
      height: 50px;
      width: 50px;
      overflow: visible;

      @include media(tablet) {
        bottom: 30px;
        right: 30px;
      }
    }

    input {
      @include core-19;
      @include box-sizing(border-box);
      width: 100%;
      margin: 0;
      padding: 0 0 0 10px;
      display: block;
      height: 50px;
      border-color: $search-border;
      border-right: none;
      line-height: 48px!important;

      &::-webkit-search-cancel-button {
        -webkit-appearance: none;
      }

      @include ie-lte(7) {
        height: 48px;
        margin-bottom: -1px;
      }
    }

    button {
      @include border-radius(0);
      @include box-shadow(none);
      position: absolute;
      z-index: 4;
      right: 0;
      top: 0;
      width: 50px;
      height: 50px;
      border: none;
      overflow: hidden;
      text-indent: -5000px;
      color: $white;
      background-color: #28a197;
      background-image: image-url("search/search-button.png");
      background-repeat: no-repeat;
      background-position: -12.5% 50%;
      &:hover {
        background-color: #3ABAA8;
      }
    }
  }

  #search-results-tabs.shouty-tabs {
    #search-index-navigation {
      position: relative;
      top: 1px;
      margin: 0;
      padding: 0 15px;

      @include media(tablet) {
        padding: 0 30px;
      }

      li {
        margin: 0;
        float: left;
        display: inline;
        list-style: none;
      }

      a {
        display: block;
        overflow: hidden;
        margin: 5px 5px 6px;
        padding: 4px 4px;
        text-decoration: none;
        background: $border-colour;
        border: 1px solid $border-colour;
        border-bottom: none;

        &:hover,
{'fraction_non_alphanumeric': 0.11991476172026347, 'fraction_numerical': 0.04242541650523053, 'mean_word_length': 1.7521321961620469, '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': '1546511', 'n_tokens_mistral': 1938, 'n_tokens_neox': 1710, 'n_words': 415}