Simple SCSS breakpoint implementation

breakpoints.scss

$breakpoints: (
    zero: 0px,
    small: 900px,
    medium: 1200px,
    medium-large: 1400px,
    large: 1600px,
    xlarge: 2000px
);

@mixin breakpoint($left, $right: null) {
    @if $right != null {
        @media screen and (min-width: map-get($breakpoints, $left)) and (max-width: map-get($breakpoints, $right) - 1) {
            @content;
        }
    } @else {
        @media screen and (min-width: map-get($breakpoints, $left)) {
            @content;
        }
    }
}

test.scss

.foo {
    @include breakpoint(zero, small) {
        width: 100px;
    }
    @include breakpoint(small, medium) {
        width: 200px;
    }
    @include breakpoint(medium) {
        width: 300px;
    }
}