<commit_before>.button {
  display: inline-block;
  appearance: none;
  height: 70px;
  line-height: 1.2;
  border: none;
  padding: 24px;
  @include font-size(20px);
  text-align: left;
  background-color: $dark_cyan;
  color: $white;
  font-weight: bold;
  text-decoration: none;
  transition: background 250ms ease, color 250ms ease, box-shadow 250ms ease, transform 250ms ease;
  outline: 0;
  white-space: nowrap;
  @include no-select;
  &:focus, &:hover {
    background-color: lighten($dark_cyan, 1%);
    box-shadow: 0 19px 60px -10px rgba(0,0,0,.35);
    transform: translateY(-2px);
  }
  &:active {
    background-color: darken($dark_cyan, 5%);
    outline: 0;
  }

  // make it so
  &--half-width {
    width: 50%;
  }

  // make it so
  &--full-width {
    width: 100%;
  }

  // secondary action
  &--grey {
    background-color: $light_grey;
    color: $dark_grey;
    &:hover {
      background-color: lighten($light_grey, 2%);
    }
    &:focus {
      background-color: darken($light_grey, 5%);
    }
  }

  // used for delete buttons
  &--remove {
    background-color: $dark_pink;
    color: $white;
    &:hover {
      background-color: lighten($dark_pink, 2%);
    }
    &:focus {
      background-color: darken($dark_pink, 5%);
    }
  }
}

.button__icon {
  display: block;
  @include width-from($smallish_device) {
    display: none;
  }
}

.button__text {
  display: none;
  @include width-from($smallish_device) {<commit_msg>Fix safari text flicker on buttons<commit_after>.button {
  display: inline-block;
  appearance: none;
  height: 70px;
  line-height: 1.2;
  border: none;
  padding: 24px;
  @include font-size(20px);
  text-align: left;
  background-color: $dark_cyan;
  color: $white;
  font-weight: bold;
  text-decoration: none;
  transition: background 250ms ease, color 250ms ease, box-shadow 250ms ease, transform 250ms ease;
  outline: 0;
  white-space: nowrap;
  @include no-select;
  transform-style: preserve-3d; // Fix safari text flicker (children need backface-visibility: hidden;)
  &:focus, &:hover {
    background-color: lighten($dark_cyan, 1%);
    box-shadow: 0 19px 60px -10px rgba(0,0,0,.35);
    transform: translateY(-2px);
  }
  &:active {
    background-color: darken($dark_cyan, 5%);
    outline: 0;
  }

  // make it so
  &--half-width {
    width: 50%;
  }

  // make it so
  &--full-width {
    width: 100%;
  }

  // secondary action
  &--grey {
    background-color: $light_grey;
    color: $dark_grey;
    &:hover {
      background-color: lighten($light_grey, 2%);
    }
    &:focus {
      background-color: darken($light_grey, 5%);
    }
  }

  // used for delete buttons
  &--remove {
    background-color: $dark_pink;
    color: $white;
    &:hover {
      background-color: lighten($dark_pink, 2%);
    }
    &:focus {
      background-color: darken($dark_pink, 5%);
    }
  }
}

.button__icon {
  display: block;
  backface-visibility: hidden; // Fix safari text flicker (parent needs transform-style: preserve-3d)
  @include width-from($smallish_device) {
    display: none;
  }
}

.button__text {
  display: none;
  backface-visibility: hidden; // Fix safari text flicker (parent needs transform-style: preserve-3d)
  @include width-from($smallish_device) {
{'fraction_non_alphanumeric': 0.1469223631302196, 'fraction_numerical': 0.029384472626043923, 'mean_word_length': 2.94390243902439, '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': '4653062', 'n_tokens_mistral': 1270, 'n_tokens_neox': 1154, 'n_words': 273}