<commit_before>// Foundation by ZURB
// foundation.zurb.com
// Licensed under MIT Open Source

@import "global";
@import "buttons";

//
// @variables
//
$include-html-form-classes: $include-html-classes !default;

// We use this to set the base for lots of form spacing and positioning styles
$form-spacing: rem-calc(16) !default;

// We use these to style the labels in different ways
$form-label-pointer: pointer !default;
$form-label-font-size: rem-calc(14) !default;
$form-label-font-weight: $font-weight-normal !default;
$form-label-line-height: 1.5 !default;
$form-label-font-color: scale-color(#000, $lightness: 30%) !default;
$form-label-small-transform: capitalize !default;
$form-label-bottom-margin: 0 !default;
$input-font-family: inherit !default;
$input-font-color: rgba(0,0,0,0.75) !default;
$input-font-size: rem-calc(14) !default;
$input-bg-color: #fff !default;
$input-focus-bg-color: scale-color(#fff, $lightness: -2%) !default;
$input-border-color: scale-color(#fff, $lightness: -20%) !default;
$input-focus-border-color: scale-color(#fff, $lightness: -40%) !default;
$input-border-style: solid !default;
$input-border-width: 1px !default;
$input-border-radius: $global-radius !default;
$input-disabled-bg: #ddd !default;
$input-disabled-cursor: $cursor-default-value !default;
$input-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1) !default;
$input-include-glowing-effect: true !default;

// We use these to style the fieldset border and spacing.
$fieldset-border-style: solid !default;
$fieldset-border-width: 1px !default;
$fieldset-border-color: #ddd !default;
$fieldset-padding: rem-calc(20) !default;
$fieldset-margin: rem-calc(18 0) !default;

// We use these to style the legends when you use them
$legend-bg: #fff !default;
$legend-font-weight: $font-weight-bold !default;
$legend-padding: rem-calc(0 3) !default;

// We use these to style the prefix and postfix input elements
$input-prefix-bg: scale-color(#fff, $lightness: -5%) !default;
$input-prefix-border-color: scale-color(#fff, $lightness: -20%) !default;
$input-prefix-border-size: 1px !default;
$input-prefix-border-type: solid !default;
$input-prefix-overflow: hidden !default;
$input-prefix-font-color: #333 !default;
$input-prefix-font-color-alt: #fff !default;

// We use this setting to turn on/off HTML5 number spinners (the up/down arrows)
$input-number-spinners: true !default;

// We use these to style the error states for inputs and labels
$input-error-message-padding: rem-calc(6 9 9) !default;
$input-error-message-top: -1px !default;
$input-error-message-font-size: rem-calc(12) !default;
$input-error-message-font-weight: $font-weight-normal !default;
$input-error-message-font-style: italic !default;
$input-error-message-font-color: #fff !default;
$input-error-message-font-color-alt: #333 !default;

// We use this to style the glowing effect of inputs when focused
$glowing-effect-fade-time: 0.45s !default;
$glowing-effect-color: $input-focus-border-color !default;

// Select variables
$select-bg-color: #fafafa !default;
$select-hover-bg-color: scale-color($select-bg-color, $lightness: -3%) !default;

//
// @MIXINS
//

// We use this mixin to give us form styles for rows inside of forms
@mixin form-row-base {
  .row { margin: 0 ((-$form-spacing) / 2);

    .column,
    .columns { padding: 0 $form-spacing / 2; }

    // Use this to collapse the margins of a form row
    &.collapse { margin: 0;

      .column,
      .columns { padding: 0; }
      input {
        @include side-radius($opposite-direction, 0);
      }

    }
  }
  input.column,
  input.columns,
  textarea.column,
  textarea.columns { padding-#{$default-float}: $form-spacing / 2; }
}

// @MIXIN
//
// We use this mixin to give all basic form elements their style
@mixin form-element {
  background-color: $input-bg-color;
  font-family: $input-font-family;
  border: $input-border-width $input-border-style $input-border-color;
  box-shadow: $input-box-shadow;
  color: $input-font-color;
  display: block;
  font-size: $input-font-size;
  margin: 0 0 $form-spacing 0;
  padding: $form-spacing / 2;
  height: ($input-font-size + ($form-spacing * 1.5) - rem-calc(1));
  width: 100%;
  @include box-sizing(border-box);
  @if $input-include-glowing-effect {
    @include block-glowing-effect(focus, $glowing-effect-fade-time, $glowing-effect-color);
  }
  // Basic focus styles
  &:focus {
    background: $input-focus-bg-color;
    border-color: $input-focus-border-color;
    outline: none;
  }
  // Disbaled Styles
  &:disabled {
    background-color: $input-disabled-bg;
    cursor: $input-disabled-cursor;
  }

  // Disabled background input background color
  &[disabled],
  &[readonly],
  fieldset[disabled] & {
    background-color: $input-disabled-bg;
    cursor: $input-disabled-cursor;
  }
}

// @MIXIN
//
// We use this mixin to create form labels
//
// $alignment - Alignment options. Default: false. Options: [right, inline, false]
// $base-style - Control whether or not the base styles come through. Default: true.
@mixin form-label($alignment:false, $base-style:true) {

  // Control whether or not the base styles come through.
  @if $base-style {
    font-size: $form-label-font-size;
    color: $form-label-font-color;
    cursor: $form-label-pointer;<commit_msg>Form focus change background to background-color<commit_after>// Foundation by ZURB
// foundation.zurb.com
// Licensed under MIT Open Source

@import "global";
@import "buttons";

//
// @variables
//
$include-html-form-classes: $include-html-classes !default;

// We use this to set the base for lots of form spacing and positioning styles
$form-spacing: rem-calc(16) !default;

// We use these to style the labels in different ways
$form-label-pointer: pointer !default;
$form-label-font-size: rem-calc(14) !default;
$form-label-font-weight: $font-weight-normal !default;
$form-label-line-height: 1.5 !default;
$form-label-font-color: scale-color(#000, $lightness: 30%) !default;
$form-label-small-transform: capitalize !default;
$form-label-bottom-margin: 0 !default;
$input-font-family: inherit !default;
$input-font-color: rgba(0,0,0,0.75) !default;
$input-font-size: rem-calc(14) !default;
$input-bg-color: #fff !default;
$input-focus-bg-color: scale-color(#fff, $lightness: -2%) !default;
$input-border-color: scale-color(#fff, $lightness: -20%) !default;
$input-focus-border-color: scale-color(#fff, $lightness: -40%) !default;
$input-border-style: solid !default;
$input-border-width: 1px !default;
$input-border-radius: $global-radius !default;
$input-disabled-bg: #ddd !default;
$input-disabled-cursor: $cursor-default-value !default;
$input-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1) !default;
$input-include-glowing-effect: true !default;

// We use these to style the fieldset border and spacing.
$fieldset-border-style: solid !default;
$fieldset-border-width: 1px !default;
$fieldset-border-color: #ddd !default;
$fieldset-padding: rem-calc(20) !default;
$fieldset-margin: rem-calc(18 0) !default;

// We use these to style the legends when you use them
$legend-bg: #fff !default;
$legend-font-weight: $font-weight-bold !default;
$legend-padding: rem-calc(0 3) !default;

// We use these to style the prefix and postfix input elements
$input-prefix-bg: scale-color(#fff, $lightness: -5%) !default;
$input-prefix-border-color: scale-color(#fff, $lightness: -20%) !default;
$input-prefix-border-size: 1px !default;
$input-prefix-border-type: solid !default;
$input-prefix-overflow: hidden !default;
$input-prefix-font-color: #333 !default;
$input-prefix-font-color-alt: #fff !default;

// We use this setting to turn on/off HTML5 number spinners (the up/down arrows)
$input-number-spinners: true !default;

// We use these to style the error states for inputs and labels
$input-error-message-padding: rem-calc(6 9 9) !default;
$input-error-message-top: -1px !default;
$input-error-message-font-size: rem-calc(12) !default;
$input-error-message-font-weight: $font-weight-normal !default;
$input-error-message-font-style: italic !default;
$input-error-message-font-color: #fff !default;
$input-error-message-font-color-alt: #333 !default;

// We use this to style the glowing effect of inputs when focused
$glowing-effect-fade-time: 0.45s !default;
$glowing-effect-color: $input-focus-border-color !default;

// Select variables
$select-bg-color: #fafafa !default;
$select-hover-bg-color: scale-color($select-bg-color, $lightness: -3%) !default;

//
// @MIXINS
//

// We use this mixin to give us form styles for rows inside of forms
@mixin form-row-base {
  .row { margin: 0 ((-$form-spacing) / 2);

    .column,
    .columns { padding: 0 $form-spacing / 2; }

    // Use this to collapse the margins of a form row
    &.collapse { margin: 0;

      .column,
      .columns { padding: 0; }
      input {
        @include side-radius($opposite-direction, 0);
      }

    }
  }
  input.column,
  input.columns,
  textarea.column,
  textarea.columns { padding-#{$default-float}: $form-spacing / 2; }
}

// @MIXIN
//
// We use this mixin to give all basic form elements their style
@mixin form-element {
  background-color: $input-bg-color;
  font-family: $input-font-family;
  border: $input-border-width $input-border-style $input-border-color;
  box-shadow: $input-box-shadow;
  color: $input-font-color;
  display: block;
  font-size: $input-font-size;
  margin: 0 0 $form-spacing 0;
  padding: $form-spacing / 2;
  height: ($input-font-size + ($form-spacing * 1.5) - rem-calc(1));
  width: 100%;
  @include box-sizing(border-box);
  @if $input-include-glowing-effect {
    @include block-glowing-effect(focus, $glowing-effect-fade-time, $glowing-effect-color);
  }
  // Basic focus styles
  &:focus {
    background-color: $input-focus-bg-color;
    border-color: $input-focus-border-color;
    outline: none;
  }
  // Disbaled Styles
  &:disabled {
    background-color: $input-disabled-bg;
    cursor: $input-disabled-cursor;
  }

  // Disabled background input background color
  &[disabled],
  &[readonly],
  fieldset[disabled] & {
    background-color: $input-disabled-bg;
    cursor: $input-disabled-cursor;
  }
}

// @MIXIN
//
// We use this mixin to create form labels
//
// $alignment - Alignment options. Default: false. Options: [right, inline, false]
// $base-style - Control whether or not the base styles come through. Default: true.
@mixin form-label($alignment:false, $base-style:true) {

  // Control whether or not the base styles come through.
  @if $base-style {
    font-size: $form-label-font-size;
    color: $form-label-font-color;
    cursor: $form-label-pointer;
{'fraction_non_alphanumeric': 0.1573416642999148, 'fraction_numerical': 0.015336552115876171, 'mean_word_length': 3.950328022492971, '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': '352711', 'n_tokens_mistral': 3762, 'n_tokens_neox': 3588, 'n_words': 948}