<commit_before>$height: 40px;
$spacing: 10px;
$placeholder-colour: #AAA;
$select-colour: #2875C7;
$font-size: 14px;
$border-colour: #DDD;

@mixin vertical-center($height) {
  height: $height;
  line-height: $height !important;
  display: inline-block;
  vertical-align: middle;
}

dropdown {
  float: left;
  display: block;
  width: 250px;

    >div {
      float: left;
      width: 100%;

        >div.dropdown-display {
          float: left;
          width: 100%;
          background: white;
          height: $height;
          cursor: pointer;
          border: solid 1px $border-colour;
          box-sizing: border-box;

          $icon-width: 14px;

            >* {
              float: left;
              height: 100%;
              @include vertical-center($height);
            }

            >span {
              font-size: $font-size;
              width: 100%;
              position: relative;
              box-sizing: border-box;
              padding-right: $icon-width + $spacing * 2;
              padding-left: $spacing;

                &.placeholder, &.display {
                  color: $placeholder-colour;
                }
            }

            >i {
              position:relative;
              width: $icon-width;
              margin-left: ($spacing + $icon-width) * -1;
              font-size: 1.125em;
              font-weight: bold;
              padding-right: $spacing;
              text-align: right;
            }
        }

        >div.dropdown-list {
          color: $placeholder-colour;
          float: left;
          z-index: 1;
          width: 100%;
          position: relative;
          transform: scale(1, 0);
          transition: transform ease 250ms;

            >div {
              position: absolute;
              width: 100%;
              z-index: 2;
              cursor: pointer;
              background: white;

                >div {
                  float: left;
                  width: 100%;
                  padding: 0 $spacing;
                  font-size: $font-size;
                  box-sizing: border-box;
                  border: solid 1px $border-colour; border-top:none;

                  $icon-width: 20px;

                    &:hover {
                      background: #F0F0F0;
                    }

                    &.selected {
                      background: $select-colour;
                      color: white;
                    }

                    >* {
                     @include vertical-center($height);
                    }

                    >span {
                      float: left;
                      width: 100%;
                      position: relative;
                      padding-right:  $icon-width + $spacing;
                      box-sizing: border-box;
                      color: inherit;
                    }

                    >i {
                      float: left;
                      width: $icon-width;
                      margin-left: $icon-width * -1;<commit_msg>refactor dropdown styles<commit_after>$height: 3.5rem;
$spacing: 0.8rem;
$font-size: 1.15rem;

@mixin vertical-center($height) {
  height: $height;
  line-height: $height !important;
  display: inline-block;
  vertical-align: middle;
}

dropdown {
  /* float: left; */
  display: block;
  width: 250px;

    >div {
      /* float: left; */
      width: 100%;

        >div.dropdown-display {
          /* float: left; */
          width: 100%;
          height: $height;
          cursor: pointer;          
          box-sizing: border-box;
            
            &.cornflower {
              background-color: $cornflower;              
            }

            &.carnation {
              background-color: $carnation;              
            }

          $icon-width: 1rem;

            >* {
              float: left;
              height: 100%;
              @include vertical-center($height);
            }

            >span {
              font-size: $font-size;
              width: 100%;
              position: relative;
              box-sizing: border-box;
              padding-right: $icon-width + $spacing * 2;
              padding-left: $spacing;

                &.placeholder, &.display {
                  color: $white;
                }
            }

            >i {
              color: $white;
              position:relative;
              width: $icon-width;
              margin-left: ($spacing + $icon-width) * -1;
              font-size: 1.125em;
              font-weight: bold;
              padding-right: $spacing;
              text-align: right;
            }
        }

        >div.dropdown-list {
          color: $black;
          float: left;
          z-index: 1;
          width: 100%;
          position: relative;
          transform: scale(1, 0);
          transition: transform ease 250ms;

            >div {
              position: absolute;
              width: 100%;
              z-index: 2;
              cursor: pointer;              

                >div {
                  background: white;
                  float: left;
                  width: 100%;
                  padding: 0 $spacing;
                  font-size: $font-size;
                  box-sizing: border-box;
                  border: solid 1px $alto; border-top:none;

                  $icon-width: 1.2rem;

                    &:last-child {
                      margin-bottom: 2rem;
                    }

                    &:hover {
                      background: #F0F0F0;
                    }

                    &.selected {
                      background: $black;
                      border: none;
                      color: white;
                        
                        &.cornflower {
                          background: $cornflower;                      
                        }

                        &.carnation {
                          background: $carnation;                      
                        }
                    }


                    >* {
                     @include vertical-center($height);
                    }

                    >span {
                      float: left;
                      width: 100%;
                      position: relative;
                      padding-right:  $icon-width + $spacing;
                      box-sizing: border-box;
                      color: inherit;
                    }

                    >i {
                      float: left;
                      width: $icon-width;
                      margin-left: $icon-width * -1;
{'fraction_non_alphanumeric': 0.10052990158970478, 'fraction_numerical': 0.01801665404996215, 'mean_word_length': 0.8735110606920022, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 25, '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': '7540251', 'n_tokens_mistral': 1833, 'n_tokens_neox': 1585, 'n_words': 358}