Different alternatives for media queries

_breakpoints.scss

$breakpoint__screen-size--medium: new-breakpoint(max-width $screen-size--medium 6);

style.scss

// Native CSS breakpoint
@media screen and (max-width: 1023px) {
  // styles
}

// Device size breakpoint
@media screen and (max-width: $screen-size--medium) {
    // styles
}

// Device size with Neat function `media`
@include media($breakpoint__screen-size--medium) {
    // styles
}