Sass mixin so overlay scrolls instead of the content bellow on iOS

ios-scrollable-mixin.scss

@mixin scrollable-overlay {
  overflow: auto;

  // iOS Specific tweaks
  // See for hack explanation: http://browserbu.gs/css-hacks/webkit-full-page-media/
  _::-webkit-full-page-media, & {

    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;

    // Forces overflow so -webkit-overflow-scrolling is picked up properly
    // See http://patrickmuff.ch/blog/2014/10/01/how-we-fixed-the-webkit-overflow-scrolling-touch-bug-on-ios/#comment-172592
    &::before {
      content:””;
      margin-left: -1px;
      width: 1px;
      float: left;
      height: calc(100% + 1px);
    }
    &::after{
      content:””;
      width: 100%;
      clear: both;
    }
  }
}