<commit_before>//
// Switch Variables
//
$include-html-form-classes: $include-html-classes !default;

// Controlling border styles and background colors for the switch container
$switch-border-color: darken(#fff, 20%) !default;
$switch-border-style: solid !default;
$switch-border-width: 1px !default;
$switch-bg: #fff !default;

// We use these to control the switch heights for our default classes
$switch-height-tny: 22px !default;
$switch-height-sml: 28px !default;
$switch-height-med: 36px !default;
$switch-height-lrg: 44px !default;
$switch-bottom-margin: em-calc(20) !default;

// We use these to control default font sizes for our classes.
$switch-font-size-tny: 11px !default;
$switch-font-size-sml: 12px !default;
$switch-font-size-med: 14px !default;
$switch-font-size-lrg: 17px !default;
$switch-label-side-padding: 6px !default;

// We use these to style the switch-paddle
$switch-paddle-bg: #fff !default;
$switch-paddle-fade-to-color: darken($switch-paddle-bg, 10%) !default;
$switch-paddle-border-color: darken($switch-paddle-bg, 35%) !default;
$switch-paddle-border-width: 1px !default;
$switch-paddle-border-style: solid !default;
$switch-paddle-transition-speed: .1s !default;
$switch-paddle-transition-ease: ease-out !default;
$switch-positive-color: lighten($success-color, 50%) !default;
$switch-negative-color: #f5f5f5 !default;

// Outline Style for tabbing through switches
$switch-label-outline: 1px dotted #888 !default;


//
// Switch Mixins
//

// We use this mixin to create the base styles for our switch element.
@mixin switch-base($transition-speed:$switch-paddle-transition-speed, $transition-ease:$switch-paddle-transition-ease) {

  // Default position and structure for switch container.
  position: relative;
  padding: 0;
  display: block;
  overflow: hidden;
  border-style: $switch-border-style;
  border-width: $switch-border-width;
  margin-bottom: $switch-bottom-margin;

  // Default label styles for type and transition
  label {
    position: relative;
    #{$default-float}: 0;
    z-index: 2;
    float: $default-float;
    width: 50%;
    height: 100%;
    margin: 0;
    font-weight: bold;
    text-align: $default-float;

    // Transition for the switch label to follow paddle
    @include single-transition(all, $transition-speed, $transition-ease);
  }

  // So that we don't need to recreate the form with any JS, we use the
  // existing radio button, but we cleverly position and hide it.
  input {
    position: absolute;
    z-index: 3;
    opacity: 0;
    width: 100%;
    height: 100%;
    -moz-appearance: none;

    // Hover and focus styles for the paddle
    &:hover,
    &:focus {
      cursor: $cursor-pointer-value;
    }
  }

  // The toggle area for radio switches. We call is a paddle.
  span:last-child {
    position: absolute;
    top: -1px;
    #{$default-float}: -1px;
    z-index: 1;
    display: block;
    padding: 0;
    border-width: $switch-paddle-border-width;
    border-style: $switch-paddle-border-style;

    // Transition for the switch paddle
    @include single-transition(all, $transition-speed, $transition-ease);
  }

  // When a label isn't :checked, we hide it as it slides away.
  input:not(:checked) + label { opacity: 0; }

  // Controlling the position of the labels as they are toggled.
  input:checked { display: none !important; }
  input { #{$default-float}: 0; display: block !important; }

  // Left Label alignment and position changes, including fixes for while inside a custom form
  input:first-of-type + label,
  input:first-of-type + span + label { #{$default-float}: -50%; }
  input:first-of-type:checked + label,
  input:first-of-type:checked + span + label { #{$default-float}: 0%; }

  // Right Label alignment and position changes, including fixes for while inside a custom form
  input:last-of-type + label,
  input:last-of-type + span + label {#{$opposite-direction}: -50%; #{$default-float}: auto; text-align: $opposite-direction; }
  input:last-of-type:checked + label,
  input:last-of-type:checked + span + label { #{$opposite-direction}: 0%; #{$default-float}: auto; }

  // Hiding custom form spans since we auto-create them
  span.custom { display: none !important; }

  // Bugfix for older Webkit, including mobile Webkit. Adapted from:
  // http://css-tricks.com/webkit-sibling-bug/
  @media only screen and (-webkit-min-device-pixel-ratio:0) and (max-device-width:480px) {
    @if $experimental { -webkit-animation: webkitSiblingBugfix infinite 1s; }
  }

  @media only screen and (-webkit-min-device-pixel-ratio:1.5) {
    @if $experimental { -webkit-animation: none 0; }
  }

  form.custom & .hidden-field {
    margin-left: auto;
    position: absolute;
    visibility: visible;
  }
}

// We use this mixin to create the size styles for switches.
@mixin switch-size($height:$switch-height-med, $font-size:$switch-font-size-med, $line-height:2.3em) {

  height: em-calc($height);

  label {
    padding: em-calc(0, $switch-label-side-padding);
    line-height: $line-height;
    font-size: em-calc($font-size);
  }

  input {
    // Move the paddle to the right position<commit_msg>Fixes small typo in SASS syntax for switch label text padding<commit_after>//
// Switch Variables
//
$include-html-form-classes: $include-html-classes !default;

// Controlling border styles and background colors for the switch container
$switch-border-color: darken(#fff, 20%) !default;
$switch-border-style: solid !default;
$switch-border-width: 1px !default;
$switch-bg: #fff !default;

// We use these to control the switch heights for our default classes
$switch-height-tny: 22px !default;
$switch-height-sml: 28px !default;
$switch-height-med: 36px !default;
$switch-height-lrg: 44px !default;
$switch-bottom-margin: em-calc(20) !default;

// We use these to control default font sizes for our classes.
$switch-font-size-tny: 11px !default;
$switch-font-size-sml: 12px !default;
$switch-font-size-med: 14px !default;
$switch-font-size-lrg: 17px !default;
$switch-label-side-padding: 6px !default;

// We use these to style the switch-paddle
$switch-paddle-bg: #fff !default;
$switch-paddle-fade-to-color: darken($switch-paddle-bg, 10%) !default;
$switch-paddle-border-color: darken($switch-paddle-bg, 35%) !default;
$switch-paddle-border-width: 1px !default;
$switch-paddle-border-style: solid !default;
$switch-paddle-transition-speed: .1s !default;
$switch-paddle-transition-ease: ease-out !default;
$switch-positive-color: lighten($success-color, 50%) !default;
$switch-negative-color: #f5f5f5 !default;

// Outline Style for tabbing through switches
$switch-label-outline: 1px dotted #888 !default;


//
// Switch Mixins
//

// We use this mixin to create the base styles for our switch element.
@mixin switch-base($transition-speed:$switch-paddle-transition-speed, $transition-ease:$switch-paddle-transition-ease) {

  // Default position and structure for switch container.
  position: relative;
  padding: 0;
  display: block;
  overflow: hidden;
  border-style: $switch-border-style;
  border-width: $switch-border-width;
  margin-bottom: $switch-bottom-margin;

  // Default label styles for type and transition
  label {
    position: relative;
    #{$default-float}: 0;
    z-index: 2;
    float: $default-float;
    width: 50%;
    height: 100%;
    margin: 0;
    font-weight: bold;
    text-align: $default-float;

    // Transition for the switch label to follow paddle
    @include single-transition(all, $transition-speed, $transition-ease);
  }

  // So that we don't need to recreate the form with any JS, we use the
  // existing radio button, but we cleverly position and hide it.
  input {
    position: absolute;
    z-index: 3;
    opacity: 0;
    width: 100%;
    height: 100%;
    -moz-appearance: none;

    // Hover and focus styles for the paddle
    &:hover,
    &:focus {
      cursor: $cursor-pointer-value;
    }
  }

  // The toggle area for radio switches. We call is a paddle.
  span:last-child {
    position: absolute;
    top: -1px;
    #{$default-float}: -1px;
    z-index: 1;
    display: block;
    padding: 0;
    border-width: $switch-paddle-border-width;
    border-style: $switch-paddle-border-style;

    // Transition for the switch paddle
    @include single-transition(all, $transition-speed, $transition-ease);
  }

  // When a label isn't :checked, we hide it as it slides away.
  input:not(:checked) + label { opacity: 0; }

  // Controlling the position of the labels as they are toggled.
  input:checked { display: none !important; }
  input { #{$default-float}: 0; display: block !important; }

  // Left Label alignment and position changes, including fixes for while inside a custom form
  input:first-of-type + label,
  input:first-of-type + span + label { #{$default-float}: -50%; }
  input:first-of-type:checked + label,
  input:first-of-type:checked + span + label { #{$default-float}: 0%; }

  // Right Label alignment and position changes, including fixes for while inside a custom form
  input:last-of-type + label,
  input:last-of-type + span + label {#{$opposite-direction}: -50%; #{$default-float}: auto; text-align: $opposite-direction; }
  input:last-of-type:checked + label,
  input:last-of-type:checked + span + label { #{$opposite-direction}: 0%; #{$default-float}: auto; }

  // Hiding custom form spans since we auto-create them
  span.custom { display: none !important; }

  // Bugfix for older Webkit, including mobile Webkit. Adapted from:
  // http://css-tricks.com/webkit-sibling-bug/
  @media only screen and (-webkit-min-device-pixel-ratio:0) and (max-device-width:480px) {
    @if $experimental { -webkit-animation: webkitSiblingBugfix infinite 1s; }
  }

  @media only screen and (-webkit-min-device-pixel-ratio:1.5) {
    @if $experimental { -webkit-animation: none 0; }
  }

  form.custom & .hidden-field {
    margin-left: auto;
    position: absolute;
    visibility: visible;
  }
}

// We use this mixin to create the size styles for switches.
@mixin switch-size($height:$switch-height-med, $font-size:$switch-font-size-med, $line-height:2.3em) {

  height: em-calc($height);

  label {
    padding: em-calc(0 $switch-label-side-padding);
    line-height: $line-height;
    font-size: em-calc($font-size);
  }

  input {
    // Move the paddle to the right position
{'fraction_non_alphanumeric': 0.13871313150978293, 'fraction_numerical': 0.014990752457899348, 'mean_word_length': 3.605109816225908, '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': '3505725', 'n_tokens_mistral': 3519, 'n_tokens_neox': 3290, 'n_words': 963}