/*
---
name: button-gradient(name)
category: Foundations/Mixins
tag: function
---
Return the gradient for a button with the cut corner already added.
Inspired by [this pen](https://codepen.io/aaahollister/pen/wKwxNY). This is the simplest
approach I've found.

```scss
button-gradient('brand');
```
*/
@function button-gradient($name) {
  $pair: gradient-pair($name);
  @return linear-gradient(135deg, transparent 7px, nth($pair, 1) 7px, nth($pair, 2) 100%);
}

/*
---
name: button-size(name-of-scale)
category: Foundations/Mixins
tag: function
---
Mixin to generate a class for buttons. This class will modify the size of the buttons.

```scss
@include('small');
```
*/
@mixin button-size($name) {
  .button-#{$name} {
    font-size: type-scale($name);
  }
}