Move round button mixin into its own component

[kwaledesign]

split round button mixin to it's own component

[kwaledesign]

//$round-button-padding: ($round-button-size - $round-button-icon-size) / 2;

@mixin round-button($round-button-size, $round-button-icon-size: $btn-font-size) {
  @include button-structure(50%, $btn-font-size, $round-button-padding);
  width: $round-button-size;
  height: $round-button-size;
  //padding: $round-button-padding;
}

.btn--round {
  font-size: ($base-font-size + 2px);
  padding: 9px 14px; //6
  line-height: $base-line-height;//7
  margin: 5px;//6
  border-radius: 7px;//8 

  //width: 
  //height:
  position: relative;
// apply this to a span element
  & > .btn--icon {
  position: absolute;
  top: ($round-btn-size - $round-btn-height) / 2;
  left:
  width: 100%;
  height: 100%;
  margin: 0 auto;
  }
}