Button zoom animation (based on https://codepen.io/brownerd/pen/wWOOqj)

button-animation-zoom.scss

.button {
  // border: 2px solid currentColor;
  // border-radius: 3rem;
  // color: #ff0;
  // font-family: roboto;
  // font-size: 4rem;
  // font-weight: 100;
  overflow: hidden;
  // padding: 1rem 2rem;
  position: relative;
  text-decoration: none;
  transition: 0.2s transform ease-in-out;
  will-change: transform;
  z-index: 0;

  &::after {
    background-color: $primary;
    border-radius: 3rem;
    content: '';
    display: block;
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    transform: translate(-100%, 0) rotate(10deg);
    transform-origin: top left;
    transition: 0.2s transform ease-out;
    will-change: transform;
    z-index: -1;
  }

  &:hover {
    border: 0 solid transparent;
    color: #ffffff;
    transform: scale(1.1);
    will-change: transform;

    &::after {
      transform: translate(0, 0);
    }
  }
}