Example of using the useful sass mixin for responsive design

usage-of-useful-sass-mixin-for-responsive-design.scss

.selector {
  
  // small screens (xsmall - small)
  @include breakpoint(small){
    // add styling here
  }
  
  // medium screens (small - medium)
  @include breakpoint(medium){
    // add styling here
  }
  
    // xlarge and up
  @include breakpoint(xlarge){
    // add styling here   
  }

  // medium and down
  @include breakpoint(medium-and-down){
    // add styling here 
  }
  
  // small and down
  @include breakpoint(small-and-down){
   // add styling here 
  }
  
  // and so on....
  
}