<commit_before>$input-rhythm: r(1);
$error-rhythm: r(3);

%control-border-bottom {
  content: "";
  display: block;
  size: 100% 1px;
  background-color: $accent;
  position: absolute n() 0 0 0;
  transform: scaleX(0);
  transition: transform .3s ease 0s;  
}

.form-group {
  $bottom-gap: r(2);
  margin-bottom: $bottom-gap;
  padding-top: r(1);
  position: relative;
  &.text {
    &::before { @extend %control-border-bottom; }
    &.is-focused::before { transform: scaleX(1); }
  }
  &.squish-before { margin-top: r(-1); }
  &.addon-forgot-password {
    padding-right: 5em;
    &::before {
      content: "";
      display: block;
      size: 100% 1px;
      background-color: $divider-gray;
      position: absolute n() 0 0 0;
    }

    input { border-bottom: none; }
  }
  &.addon-prefix {
    &.is-focused .control-label { color: $white; }
    input:-webkit-autofill + .control-label { color: $white; }
    
    input { padding-left: r(3); }

    .control-label { padding-left: r(3); }

    .icon {
      size: 18px;
      fill: $text-secondary;
      position: absolute ($input-rhythm * 2) n() n() 0;
    }
  }
  &.has-error,
  &.has-hint {
    .control-label::before {
      top: r(5) + 1px; bottom: auto;
    }
  }
}

.form-actions {
  padding: r(1) n();
  &--space-between {
    display: flex;
    justify-content: space-between;
  }

  .flat-button--large {
    margin: r(2) n() r(-1);
  }

  .flat-button + .raised-button { margin-left: r(1); }
}

#{$all-text-inputs} {
  display: block;
  padding: $input-rhythm 0;
  width: 100%;
  line-height: 1.25;
  border: none;
  border-bottom: 1px solid $divider-gray;
  box-shadow: none;
  outline: none;
  &:focus,
  &:not(:disabled):active {
    + .control-label::before { transform: scaleX(1); }
  }
  &:disabled,
  &.readonly { color: $text-disabled; }
}
input, textarea {
  @include input-placeholder { color: $text-secondary; }
}
input:-webkit-autofill {
  background-color: transparent !important;
  box-shadow: 0 0 0 100px $white inset;
  -webkit-text-fill-color: $text-secondary;
}

@mixin active-control-label {
  text: $text-secondary ms(-1);
  top: 0;
  pointer-events: none;
}
.control-label {
  text: $gray 1.25;
  position: absolute ($input-rhythm * 2) 0 0 0;
  transition: all .3s ease 0s;
  &.disabled { color: $text-disabled !important; }
  &::before { @extend %control-border-bottom; }
  .readonly & {
    color: $text-disabled !important;
    &::before { opacity: 0; }
  }
  .is-focused &,
  input[value] + &,
  input:focus + &,
  select ~ & { @include active-control-label; }
}
input:-webkit-autofill + .control-label { @include active-control-label; }

[type="checkbox"] {
  @include Normalize();
  size: 18px;
  margin-right: r(1);
  &::after {
    content: "";
    display: inline-block;
    border: 2px solid $divider-gray;
    border-radius: 2px;
    size: 18px;
    background-color: #fff;
    position: relative 4px n() n() n();
  }
  &:checked::after {
    background: url(checked.svg) 50% 50% / contain no-repeat;
    border-color: $accent;
  }
  &:focus::after { border-color: $accent; }
}

select {
  @include Select;
  size: 100% 34px;
  outline: none;
  &:focus + .control-label::before { transform: scaleX(1); }
  &:disabled { color: $text-disabled; }
}
.chosen-container { width: 100% !important; }
.chosen-container-active + .control-label::before { transform: scaleX(1); }
.chosen-single {
  .chosen-container-single & {
    @include Select;
    text: ms(0);
    size: 100% 34px;
    line-height: 34px;
    box-shadow: none;
    div { display: none; }    
  }
  .chosen-container-active & { box-shadow: none; }
  .chosen-container-active.chosen-with-drop & {
    border: none;
    background-image: none;
  }
}
.chosen-container-single .chosen-search input[type="text"] {
  border-color: $divider-gray;
  border-radius: $global-radius;
  background-image: url(search.svg);
  background-position: 100% 50%;
}
.chosen-drop {
  text: ms(0) 1.5;
  .chosen-container.chosen-with-drop & {
    background: $white;
    box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.12), 0px 8px 8px 0px rgba(0,0,0,0.24);
    border-radius: $global-radius;    
    border: none;
    left: r(-1); right: r(-1);
    width: auto;
  }
}
.chosen-results {
  .chosen-container & {
    color: $text-color;
    padding: 0;
    margin: 0;
  }<commit_msg>fix chosen retina arrow and reform search input<commit_after>$input-rhythm: r(1);
$error-rhythm: r(3);

%control-border-bottom {
  content: "";
  display: block;
  size: 100% 1px;
  background-color: $accent;
  position: absolute n() 0 0 0;
  transform: scaleX(0);
  transition: transform .3s ease 0s;  
}

.form-group {
  $bottom-gap: r(2);
  margin-bottom: $bottom-gap;
  padding-top: r(1);
  position: relative;
  &.text {
    &::before { @extend %control-border-bottom; }
    &.is-focused::before { transform: scaleX(1); }
  }
  &.squish-before { margin-top: r(-1); }
  &.addon-forgot-password {
    padding-right: 5em;
    &::before {
      content: "";
      display: block;
      size: 100% 1px;
      background-color: $divider-gray;
      position: absolute n() 0 0 0;
    }

    input { border-bottom: none; }
  }
  &.addon-prefix {
    &.is-focused .control-label { color: $white; }
    input:-webkit-autofill + .control-label { color: $white; }
    
    input { padding-left: r(3); }

    .control-label { padding-left: r(3); }

    .icon {
      size: 18px;
      fill: $text-secondary;
      position: absolute ($input-rhythm * 2) n() n() 0;
    }
  }
  &.has-error,
  &.has-hint {
    .control-label::before {
      top: r(5) + 1px; bottom: auto;
    }
  }
}

.form-actions {
  padding: r(1) n();
  &--space-between {
    display: flex;
    justify-content: space-between;
  }

  .flat-button--large {
    margin: r(2) n() r(-1);
  }

  .flat-button + .raised-button { margin-left: r(1); }
}

#{$all-text-inputs} {
  display: block;
  padding: $input-rhythm 0;
  width: 100%;
  line-height: 1.25;
  border: none;
  border-bottom: 1px solid $divider-gray;
  box-shadow: none;
  outline: none;
  &:focus,
  &:not(:disabled):active {
    + .control-label::before { transform: scaleX(1); }
  }
  &:disabled,
  &.readonly { color: $text-disabled; }
}
input, textarea {
  @include input-placeholder { color: $text-secondary; }
}
input:-webkit-autofill {
  background-color: transparent !important;
  box-shadow: 0 0 0 100px $white inset;
  -webkit-text-fill-color: $text-secondary;
}

@mixin active-control-label {
  text: $text-secondary ms(-1);
  top: 0;
  pointer-events: none;
}
.control-label {
  text: $gray 1.25;
  position: absolute ($input-rhythm * 2) 0 0 0;
  transition: all .3s ease 0s;
  &.disabled { color: $text-disabled !important; }
  &::before { @extend %control-border-bottom; }
  .readonly & {
    color: $text-disabled !important;
    &::before { opacity: 0; }
  }
  .is-focused &,
  input[value] + &,
  input:focus + &,
  select ~ & { @include active-control-label; }
}
input:-webkit-autofill + .control-label { @include active-control-label; }

[type="checkbox"] {
  @include Normalize();
  size: 18px;
  margin-right: r(1);
  &::after {
    content: "";
    display: inline-block;
    border: 2px solid $divider-gray;
    border-radius: 2px;
    size: 18px;
    background-color: #fff;
    position: relative 4px n() n() n();
  }
  &:checked::after {
    background: url(checked.svg) 50% 50% / contain no-repeat;
    border-color: $accent;
  }
  &:focus::after { border-color: $accent; }
}

select {
  @include Select;
  size: 100% 34px;
  outline: none;
  &:focus + .control-label::before { transform: scaleX(1); }
  &:disabled { color: $text-disabled; }
}
.chosen-container { width: 100% !important; }
.chosen-container-active + .control-label::before { transform: scaleX(1); }
.chosen-single {
  .chosen-container-single & {
    @include Select;
    text: ms(0);
    size: 100% 34px;
    line-height: 34px;
    box-shadow: none;
    div { display: none; }    
  }
  .chosen-container-active & { box-shadow: none; }
  .chosen-container-active.chosen-with-drop & {
    border: none;
    background-image: none;
  }
}
.chosen-container-single .chosen-search {
  padding-bottom: 0;
  input[type="text"] {
    margin-bottom: 0;
    border-color: $divider-gray;
    border-width: 0 0 1px 0;
    line-height: 1.5;
    background-image: url(search.svg) !important;
    background-position: 100% 50% !important;
    background-size: size('search.svg') !important;
  }
}
.chosen-drop {
  text: ms(0) 1.5;
  .chosen-container.chosen-with-drop & {
    background: $white;
    box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.12), 0px 8px 8px 0px rgba(0,0,0,0.24);
    border-radius: $global-radius;    
    border: none;
    left: r(-1); right: r(-1);
    width: auto;
  }
}
.chosen-results {
  .chosen-container & {
    color: $text-color;
    padding: 0;
    margin: 0;
  }
{'fraction_non_alphanumeric': 0.1753608364586885, 'fraction_numerical': 0.029321513808387316, 'mean_word_length': 2.88178209086899, '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': '1872845', 'n_tokens_mistral': 3528, 'n_tokens_neox': 3300, 'n_words': 721}