scss-grid/examples/layout/buttons/buttons.scss

@import "../../../framework";

body {
  background-color: #8faf91;
}

$color-ln: #bab7ff;
$color-bgr: #1d9d73;

.mail {

  .mail-15 {
    @include mail-button(
                    15px,
                    $color-ln,
                    $color-bgr
    )
  }
  .mail-30 {
    @include mail-button(
                    30px,
                    $color-ln,
                    $color-bgr
    )
  }
  .mail-60 {
    @include mail-button(
                    60px,
                    $color-ln,
                    $color-bgr
    )
  }
  .mail-120 {
    @include mail-button(
                    120px,
                    $color-ln,
                    $color-bgr
    )
  }
}

.search {

  .search-15 {
@include search-symbol-button(
                15px,
                $color-ln,
                $color-bgr
)
  }
  .search-30 {
    @include search-symbol-button(
                    30px,
                    $color-ln,
                    $color-bgr
    )
  }
  .search-60 {
    @include search-symbol-button(
                    60px,
                    $color-ln,
                    $color-bgr
    )
  }
  .search-120 {
    @include search-symbol-button(
                    120px,
                    $color-ln,
                    $color-bgr
    )
  }
}

.arrow {

  .arrow-15 {
    @include arrow-button(
                    15px,
                    $color-ln,
                    $color-bgr
    )
  }
  .arrow-30 {
    @include arrow-button(
                    30px,
                    $color-ln,
                    $color-bgr
    )
  }
  .arrow-60 {
    @include arrow-button(
                    60px,
                    $color-ln,
                    $color-bgr
    )
  }
  .arrow-120 {
    @include arrow-button(
                    120px,
                    $color-ln,
                    $color-bgr
    )
  }
}