user44 · October 7, 2016 14:41
diff --git a/mobile menu button b/mobile menu button
 HTML
 <div class="mobile-menu-toggle"><span></span></div>

 SASS
 .mobile-menu-toggle
  display: block
  width: 30px
  height: 23px
  margin: 30px auto 10px
  cursor: pointer
  span
    &:after, &:before
      content: ""
      position: absolute
      left: 0
      top: 9px
    &:after
      top: 18px
      width: 100%
      height: 5px
      background-color: #888
      transition: all 0.3s
      backface-visibility: hidden
      border-radius: 2px
    position: relative
    display: block
    width: 100%
    height: 5px
    background-color: #888
    transition: all 0.3s
    backface-visibility: hidden
    border-radius: 2px
    &:before
      width: 100%
      height: 5px
      background-color: #888
      transition: all 0.3s
      backface-visibility: hidden
      border-radius: 2px
  &.on
    span
      // transform-origin: left top
      transform: rotate(45deg) translate3d(6px, 7px, 0)
      &:before
        background-color: transparent
        transform: rotate(-45deg) translate3d(6px, -7px, 0)
        // transition: none
      &:after
        // transform-origin: left bottom
        transform: rotate(-90deg) translate3d(18px, 0px, 0)
    + #menu
      opacity: 1
      visibility: visible