<commit_before>.multi-select-dropdown {
  .dropdown-toggle {
    width: 110px;
  }
  &__apply {
    margin: 0;
    transition:
      opacity 0.25s ease;
    opacity: 0;
    @include gradient-h($c-ocean, $c-pool);
    border-radius: 3px 3px 0 0;
    padding: 9px;

    & + .dropdown-menu {
      border-top-left-radius: 0;
      border-top-right-radius: 0;
    }
  }
  .dropdown-menu {
    opacity: 0;
    display: block !important;
    transition: opacity 0.25s ease;
  }
  .dropdown-options {
    width: 100%;
    position: absolute;
    top: 100%;
    left: 0;
    visibility: hidden;
    transition-property: all;
  }
  /* Styling Active State of items */
  .dropdown-menu > li.active > a {
    outline: none;
    &,
    &:focus,
    &:active,
    &:active:focus {
      color: $g20-white !important;
      background: $c-sapphire;
      background: -moz-linear-gradient(left,  $c-sapphire 0%, $c-pool 100%) !important;
      background: -webkit-linear-gradient(left,  $c-sapphire 0%,$c-pool 100%) !important;
      background: linear-gradient(to right,  $c-sapphire 0%,$c-pool 100%) !important;
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$c-sapphire', endColorstr='$c-pool',GradientType=1 ) !important;
    }
  }
}
/* Open State */
.multi-select-dropdown.open {
  .dropdown-options {
    visibility: visible;
    z-index: 9999;
  }
  .dropdown-menu,
  .multi-select-dropdown__apply {
    opacity: 1;
  }
}
.multi-select-dropdown__label {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  padding-right: 10px;
}<commit_msg>Add checkboxes to list items in multi-select dropdown<commit_after>$ms-normal-left-padding: 9px;
$ms-item-height: 26px;
$ms-checkbox-size: 14px;
$ms-checkbox-dot-size: 6px;
$ms-checkbox-bg: $c-sapphire;
$ms-checkbox-bg-hover: $c-ocean;
$ms-checkbox-dot: $g20-white;

.multi-select-dropdown {
  .multi-select-dropdown__item > a {
    color: $c-neutrino !important;
    height: $ms-item-height;
    line-height: $ms-item-height;
    position: relative;
    padding-top: 0;
    padding-bottom: 0;
    padding-right: $ms-normal-left-padding;
    padding-left: ($ms-normal-left-padding + $ms-checkbox-size + ($ms-normal-left-padding - 2px));

    &,
    &:focus,
    &:active,
    &:active:focus {
      background: none !important;

      &:hover {
        background: $c-pool;
        background: -moz-linear-gradient(left,  $c-pool 0%, $c-pool 100%) !important;
        background: -webkit-linear-gradient(left,  $c-pool 0%,$c-pool 100%) !important;
        background: linear-gradient(to right,  $c-pool 0%,$c-pool 100%) !important;
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$c-pool', endColorstr='$c-pool',GradientType=1 ) !important;
      }
    }
    /* Shared Checkbox Styles */
    &:before,
    &:after {
      content: '';
      position: absolute;
      display: block;
      top: 50%;
    }
    /* Before = Checkbox */
    &:before {
      width: $ms-checkbox-size;
      height: $ms-checkbox-size;
      border-radius: $radius-small;
      background-color: $ms-checkbox-bg;
      left: $ms-normal-left-padding;
      transform: translateY(-50%);
    }
    /* After = Dot */
    &:after {
      width: $ms-checkbox-dot-size;
      height: $ms-checkbox-dot-size;
      background-color: $ms-checkbox-dot;
      border-radius: 50%;
      transform: translate(-50%,-50%) scale(2,2);
      opacity: 0;
      left: ($ms-normal-left-padding + ($ms-checkbox-size / 2));
      transition:
        opacity 0.25s ease,
        transform 0.25s ease;
    }
    /* Hover State */
    &:hover {
      color: $g20-white !important;
    }
  }
  .dropdown-toggle {
    width: 110px;

    &.btn-xs {
      height: 22px;
      line-height: 22px;
      padding-left: 0;
      padding-right: 0;
    }
  }
  &__apply {
    margin: 0;
    transition:
      opacity 0.25s ease;
    opacity: 0;
    @include gradient-h($c-ocean, $c-pool);
    border-radius: 3px 3px 0 0;
    padding: 9px;

    & + .dropdown-menu {
      border-top-left-radius: 0;
      border-top-right-radius: 0;
    }
  }
  .dropdown-menu {
    opacity: 0;
    display: block !important;
    transition: opacity 0.25s ease;
  }
  .dropdown-options {
    width: 100%;
    position: absolute;
    top: 100%;
    left: 0;
    visibility: hidden;
    transition-property: all;
  }
  /* Styling Active State of items */
  .dropdown-menu > li.active > a {
    outline: none;
    &,
    &:focus,
    &:active,
    &:active:focus {
      color: $g20-white !important;
      background: $c-sapphire;
      background: -moz-linear-gradient(left,  $c-sapphire 0%, $c-pool 100%) !important;
      background: -webkit-linear-gradient(left,  $c-sapphire 0%,$c-pool 100%) !important;
      background: linear-gradient(to right,  $c-sapphire 0%,$c-pool 100%) !important;
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$c-sapphire', endColorstr='$c-pool',GradientType=1 ) !important;
    }
  }
}

/* Checked State */
.multi-select-dropdown li.multi-select-dropdown__item.active > a {
  &,
  &:focus,
  &:active,
  &:active:focus {
    background: none !important;  
  }
  color: $g20-white !important;

  &:after {
    transform: translate(-50%,-50%) scale(1,1);
    opacity: 1;
  }
}
/* Open State */
.multi-select-dropdown.open {
  .dropdown-options {
    visibility: visible;
    z-index: 9999;
  }
  .dropdown-menu,
  .multi-select-dropdown__apply {
    opacity: 1;
  }
}
.multi-select-dropdown__label {
  top: 50%;
  transform: translateY(-50%);
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  padding-right: 10px;
  position: absolute;
  width: calc(100% - #{($ms-normal-left-padding * 2)});
  left: $ms-normal-left-padding;
}
{'fraction_non_alphanumeric': 0.15776614310645723, 'fraction_numerical': 0.028795811518324606, 'mean_word_length': 2.631812420785805, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 9, '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': '5894725', 'n_tokens_mistral': 2193, 'n_tokens_neox': 2017, 'n_words': 408}