SCSS breakpoint mixins

breakpoint-mixins.scss

@mixin tiny {
  @at-root {
    @media screen and (max-width: 480px) {
      @content;
    }
  }
}

@mixin mobile {
  @at-root {
    @media screen and (max-width: 768px) {
      @content;
    }
  }
}

@mixin tablet {
  @at-root {
    @media screen and (max-width: 992px) {
      @content;
    }
  }
}