<commit_before>@import '../basic';

/* Variables */

$toggleButtonWidth: 50px;
$toggleButtonHeight: 50px;
$buttonColor1: #2980B9;
$buttonColor2: #3498DB;
$listeningBoxColor: #2980B9;
$instructionColor: #fff;

/* Theme styles */

#skitt-ui {
  display: inline-block;
  background-color: $listeningBoxColor;
  z-index: 200;
  border-radius: $toggleButtonWidth/2;
  position: fixed;
  bottom: 20px;
  left: 20px;
  outline: none;
  border: none;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 8px;
  cursor: default;
  font-family: Lato,Helvetica,Arial,sans-serif;
}

#skitt-toggle-button {
  width: $toggleButtonWidth;
  height: $toggleButtonHeight;
  border-radius: $toggleButtonWidth/2;
  cursor: pointer;
  display: inline-block;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMSBUaW55Ly9FTicgICdodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS10aW55LmR0ZCc+PHN2ZyBiYXNlUHJvZmlsZT0idGlueSIgaGVpZ2h0PSIzMnB4IiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMycHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3L<KEY>');
  background-size: 36px 36px;
  background-repeat: no-repeat;
  background-position: 7px 6px;
  -webkit-transition: background-color 400ms ease;
  float: left;
}

label#skitt-toggle-button__label {
  display: none;
}

.skitt-ui--not-listening #skitt-toggle-button {
  background-color: $buttonColor1;
}

.skitt-ui--listening #skitt-toggle-button {
  -webkit-animation: listen_pulse 2s ease-out infinite;
}

@-webkit-keyframes "listen_pulse" {
  0% {
    background-color: $buttonColor1;
  }
  50% {
    background-color: $buttonColor2;
  }
  100% {
    background-color: $buttonColor1;
  }
}

.skitt-ui--not-listening #skitt-toggle-button:hover {
  background-color: $buttonColor2
}
.skitt-ui--listening #skitt-toggle-button:hover {
  background-color: $buttonColor2
}

#skitt-listening-box {
  float: left;
  display: inline-block;
  line-height: $toggleButtonHeight;
  height: $toggleButtonHeight;
  color: $instructionColor;
}

#skitt-listening-text {
  display: inline-block;
  overflow: hidden;
  height: $toggleButtonHeight;
}
.skitt-ui--not-listening #skitt-listening-text {
  width: 0;
}
.skitt-ui--listening #skitt-listening-text {
  width: 100%;
  -webkit-transition: width 1s ease-in-out;
  margin: 0 $toggleButtonWidth/2 0 15px;
}

#skitt-listening-text__samples {
  font-weight: bold;
  margin-left: 10px;
}<commit_msg>Flat theme variables can now be overridden<commit_after>@import '../basic';

/* Variables */

$toggleButtonWidth: 50px !default;
$toggleButtonHeight: 50px !default;
$buttonColor1: #2980B9 !default;
$buttonColor2: #3498DB !default;
$listeningBoxColor: #2980B9 !default;
$instructionColor: #fff !default;

/* Theme styles */

#skitt-ui {
  display: inline-block;
  background-color: $listeningBoxColor;
  z-index: 200;
  border-radius: $toggleButtonWidth/2;
  position: fixed;
  bottom: 20px;
  left: 20px;
  outline: none;
  border: none;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 8px;
  cursor: default;
  font-family: Lato,Helvetica,Arial,sans-serif;
}

#skitt-toggle-button {
  width: $toggleButtonWidth;
  height: $toggleButtonHeight;
  border-radius: $toggleButtonWidth/2;
  cursor: pointer;
  display: inline-block;
  background: url('data:image/svg+xml;base64,<KEY>');
  background-size: 36px 36px;
  background-repeat: no-repeat;
  background-position: 7px 6px;
  -webkit-transition: background-color 400ms ease;
  float: left;
}

label#skitt-toggle-button__label {
  display: none;
}

.skitt-ui--not-listening #skitt-toggle-button {
  background-color: $buttonColor1;
}

.skitt-ui--listening #skitt-toggle-button {
  -webkit-animation: listen_pulse 2s ease-out infinite;
}

@-webkit-keyframes "listen_pulse" {
  0% {
    background-color: $buttonColor1;
  }
  50% {
    background-color: $buttonColor2;
  }
  100% {
    background-color: $buttonColor1;
  }
}

.skitt-ui--not-listening #skitt-toggle-button:hover {
  background-color: $buttonColor2
}
.skitt-ui--listening #skitt-toggle-button:hover {
  background-color: $buttonColor2
}

#skitt-listening-box {
  float: left;
  display: inline-block;
  line-height: $toggleButtonHeight;
  height: $toggleButtonHeight;
  color: $instructionColor;
}

#skitt-listening-text {
  display: inline-block;
  overflow: hidden;
  height: $toggleButtonHeight;
}
.skitt-ui--not-listening #skitt-listening-text {
  width: 0;
}
.skitt-ui--listening #skitt-listening-text {
  width: 100%;
  -webkit-transition: width 1s ease-in-out;
  margin: 0 $toggleButtonWidth/2 0 15px;
}

#skitt-listening-text__samples {
  font-weight: bold;
  margin-left: 10px;
}
{'fraction_non_alphanumeric': 0.1334481274214378, 'fraction_numerical': 0.04068015497201894, 'mean_word_length': 4.680929095354523, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 5, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 2}, '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': '2811098', 'n_tokens_mistral': 1993, 'n_tokens_neox': 1849, 'n_words': 308}