<commit_before>// Based off this https://codepen.io/abergin/pen/pvEbWE

.bauble {
  position: fixed;
  top: 50%;
  left: 50%;
}

.bauble__shape {
  overflow: hidden;
  border-radius: 50%;
  background-color: #f55e69;
  z-index: 1;
  position: absolute;
  margin: -75px 0 0 -75px;
  height: 150px;
  width: 150px;
}

.bauble__shape__shading {
  position: absolute;
  border-radius: 50%;
  box-shadow: -10px -20px 0 0 rgba(154, 59, 66, 0.127) inset;
  z-index: 2;
  bottom: 0;
  right: 0;
  left: 0;
  top: 0;

  &:before {
    content: "";
    position: absolute;
    background-color: rgba(255, 255, 255, 0.1);
    width: 120px;
    height: 90px;
    border-radius: 50%;
    top: -20px;
    left: -20px;
  }
}

.bauble__nub {
  width: 40px;
  height: 40px;
  background-color: #f55e69;
  position: absolute;
  top: -90px;
  left: -20px;

  &:before {
    content: "";
    position: absolute;
    border-top-right-radius: 6px;
    border-top-left-radius: 6px;
    background-color: #d7e4fa;
    margin: -8px 0 0 -5px;
    width: 50px;
    height: 12px;
  }

  &:after {
    background-color: rgba(255, 255, 255, 0.1);
    content: "";
    position: absolute;
    width: 10px;
    height: 52px;
    top: -12px;
    right: 0;
    width: 20px;
  }
}<commit_msg>Resize the bauble + add more color variations<commit_after>// Based off: https://codepen.io/abergin/pen/pvEbWE

.bauble {
  position: fixed;
  top: 50%;
  left: 50%;
  // position: relative;

}

.bauble__shape {
  overflow: hidden;
  border-radius: 50%;
  background-color: #f55e69;
  z-index: 1;
  position: relative;
  margin-top: -1px;
  height: 40px;
  width: 40px;
}

.bauble__shape__shading {
  position: absolute;
  border-radius: 50%;
  box-shadow: -2px -5px 0 0 rgba(#000, 0.1) inset;
  z-index: 2;
  bottom: 0;
  right: 0;
  left: 0;
  top: 0;

  &:before {
    content: "";
    position: absolute;
    background-color: rgba(255, 255, 255, 0.1);
    width: 30px;
    height: 20px;
    border-radius: 50%;
    top: -5px;
    left: -5px;
  }
}

.bauble__ring {
  width: 10px;
  height: 10px;
  background-color: transparent;
  border: 2px solid #FFD700;
  border-radius: 50%;
  position: relative;
  margin: 0 auto;
}

.bauble__nub {
  width: 10px;
  height: 5px;
  background-color: #f55e69;
  margin: 0 auto;
  position: relative;

  &:before {
    content: "";
    position: absolute;
    border-top-right-radius: 6px;
    border-top-left-radius: 6px;
    background-color: #d7e4fa;
    margin: -3px 0 0 -1px;
    width: 12px;
    height: 3px;
  }

  &:after {
    background-color: rgba(255, 255, 255, 0.1);
    content: "";
    position: absolute;
    width: 5px;
    height: 5px;
    top: -0px;
    right: 0;
  }
}

.bauble--white {
  .bauble__shape,
  .bauble__nub {
    background-color: #e8e8e8;
  }
}

.bauble--blue {
  .bauble__shape,
  .bauble__nub {
    background-color: #5e60f5;
  }
}

.bauble--orange {
  .bauble__shape,
  .bauble__nub {
    background-color: #df9b27;
  }
}
{'fraction_non_alphanumeric': 0.15223274695534506, 'fraction_numerical': 0.07408660351826793, 'mean_word_length': 2.6193390452876377, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 2, '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': '5619275', 'n_tokens_mistral': 1422, 'n_tokens_neox': 1215, 'n_words': 286}