Cacher is the code snippet organizer for pro developers

<button class="hamburger">
  Menu
</button>

.hamburger {
  @include hamburger( 40px, 4px, #ccc );
}

// Hamburger menu creator
@mixin hamburger( $width, $height, $background ) {
  position: relative;
  display: block;
  overflow: visible;
  width: $width;
  border: 0;
  font-size: 0;
  line-height: 1;
  -webkit-appearance: none;

  &, &:before, &:after {
    height: $height;
    background-color: $background;
  }

  &:before, &:after {
    position: absolute;
    left: 0;
    right: 0;
    display: block;
    content: " ";
  }

  $newHeight: -#{(strip-units($height) * 2)}px;

  &:before {
    top: $newHeight;
  }

  &:after {
    bottom: $newHeight;
  }
}