Contents

@mixin btn-chains {
  &.full, &.btn-block {
    display: block;
    width: 100%;
    &[type=submit], &[type="reset"], &[type="button"] {
      width: 100%;
    }
  }
  &.btn-block + .btn-block {
    margin-top: 5px;
  }
  &.large, &.btn-lg, .btn-group > .btn {
    @include button-size($padding-large-vertical, $padding-large-horizontal, $font-large - 2px, $line-height-large, $border-rad-heavy);
  }
  &.small, &.btn-sm, .btn-group > .btn {
    @include button-size($padding-small-vertical, $padding-small-horizontal, $font-small, $line-height-small, $border-rad-light);
  }
  &.micro, &.btn-xs, .btn-group > .btn {
    @include button-size($padding-xs-vertical, $padding-xs-horizontal, $font-smaller, $line-height-small, $border-rad-lighter);
    .fa {
      font-size: $font-smaller;
    }
  }
  &.square {
    border-radius: 0;
  }
}

// Effect the button look here
@mixin btn-styles {
  border-radius: $border-rad-light;
  font-weight: 600;
  white-space: nowrap;
  @include button-size($padding-base-vertical, $padding-base-horizontal, $font-size-base, $line-height-base, $border-rad-light);
  transition-property: color, border-color, background-color;
  transition-duration: 0.15s;
  transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);
  @include smooth-font;
}

// Every Button Gets These Resets
@mixin button-base {
  outline: 0;
  border: 1px solid transparent;
  text-align: center;
  text-decoration: none;
  line-height: 1em;
  width: auto;
  display: inline-block;
  cursor: pointer;
  text-shadow: none;
  margin-bottom: 0;
  vertical-align: middle;
  touch-action: manipulation;
  background-image: none;
  user-select: none;
  @include btn-chains;
}

// Button sizes
@mixin button-size($padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
  padding: $padding-vertical $padding-horizontal;
  font-size: $font-size;
  line-height: $line-height;
  border-radius: $border-radius;
}

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
nitro_sg-3.0.2	sass-mixins/nitro-ui/buttons/_button-mixins.scss
nitro_sg-3.0.1	sass-mixins/nitro-ui/buttons/_button-mixins.scss