<commit_before>/**
* @desc         button classes.
* @name         buttons
* @author       <NAME>
* @tested       N/A
* @requires     [
          toolkit/_colours.scss,
          toolkit/_typography.scss,
          toolkit/design-patterns/_buttons.scss
        ]
*/



button, .button {
  text-transform: capitalize;
  @include button($button-colour);
  @include core-19();
  margin: 0 em(15) 0 0;



}

.button--alert {
  @include button($red);
  @include core-19();
}

.button--get-started {
  @extend .button;
  @include bold-24();
  margin: em(10) 0;
  padding-right: 40px;
  background-image: url("../images/icons/icon-pointer.png");
  background-position: 100% 50%;
  background-repeat: no-repeat;

  &:hover {
    background-image: url("../images/icons/icon-pointer.png");
    background-position: 100% 50%;
    background-repeat: no-repeat;
  }
}

.button--secondary {
  @include button($grey-8);
  @include core-19();
}

.button--small {
  @include button($button-colour);
  @include core-16();
  margin-top: 10px;
}

/**
 * For links that need to be positioned beside buttons
 * Used in conjunction with button class
 */
.button--link {
  background-color: transparent;
  box-shadow: none;
  text-decoration: underline;

  &:hover, 
  &:focus, 
  &:active {
    top: 0;
    outline: none;
    background-color: transparent;
  }

  &:hover, &:focus {
    color: $link-hover-colour;
  }

  &:active {
    color: $link-active-colour;
  }

}

.button.button--link {
  color: $link-colour;
}

<commit_msg>[API-481] Combined button with button--link as there's a depedency<commit_after>/**
* @desc         button classes.
* @name         buttons
* @author       <NAME>
* @tested       N/A
* @requires     [
          toolkit/_colours.scss,
          toolkit/_typography.scss,
          toolkit/design-patterns/_buttons.scss
        ]
*/

button, .button {
  text-transform: capitalize;
  @include button($button-colour);
  @include core-19();
  margin: 0 em(15) 0 0;
}

.button--alert {
  @include button($red);
  @include core-19();
}

.button--get-started {
  @extend .button;
  @include bold-24();
  margin: em(10) 0;
  padding-right: 40px;
  background-image: url("../images/icons/icon-pointer.png");
  background-position: 100% 50%;
  background-repeat: no-repeat;

  &:hover {
    background-image: url("../images/icons/icon-pointer.png");
    background-position: 100% 50%;
    background-repeat: no-repeat;
  }
}

.button--secondary {
  @include button($grey-8);
  @include core-19();
}

.button--small {
  @include button($button-colour);
  @include core-16();
  margin-top: 10px;
}

/**
 * For links that need to be positioned beside buttons
 * Used in conjunction with button class
 */
.button.button--link {
  background-color: transparent;
  box-shadow: none;
  text-decoration: underline;
  color: $link-colour;

  &:hover, 
  &:focus, 
  &:active {
    top: 0;
    outline: none;
    background-color: transparent;
  }

  &:hover, &:focus {
    color: $link-hover-colour;
  }

  &:active {
    color: $link-active-colour;
  }

}


{'fraction_non_alphanumeric': 0.16169235815021318, 'fraction_numerical': 0.0232863233847163, 'mean_word_length': 2.710462287104623, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 5, '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': '641972', 'n_tokens_mistral': 1142, 'n_tokens_neox': 1047, 'n_words': 227}