Skip to content

Instantly share code, notes, and snippets.

@impankratov
Last active May 31, 2016 18:14
Show Gist options
  • Select an option

  • Save impankratov/f4b29def7c679c8efc42ddf2621e06ca to your computer and use it in GitHub Desktop.

Select an option

Save impankratov/f4b29def7c679c8efc42ddf2621e06ca to your computer and use it in GitHub Desktop.
Sass mixins for easy media queries based on bootstrap breakpoint system.
// XS
=media-xs-max
@media screen and (max-width: $screen-xs-max)
@content
// SM
=media-sm-min
@media screen and (min-width: $screen-sm-min)
@content
=media-sm-max
@media screen and (max-width: $screen-sm-max)
@content
=media-sm
@media screen and (min-width: $screen-sm-min) and (max-width: $screen-sm-max)
@content
// MD
=media-md-min
@media screen and (min-width: $screen-md-min)
@content
=media-md-max
@media screen and (max-width: $screen-md-max)
@content
=media-md
@media screen and (min-width: $screen-md-min) and (max-width: $screen-md-max)
@content
// LG
=media-lg-min
@media screen and (min-width: $screen-lg-min)
@content
=media-lg-max
@media screen and (max-width: $screen-lg-max)
@content
=media-lg
@media screen and (min-width: $screen-lg-min) and (max-width: $screen-lg-max)
@content
// XL
=media-xl-min
@media screen and (min-width: $screen-xl-min)
@content
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment