Skip to content

Instantly share code, notes, and snippets.

@buzzedword buzzedword/_mixins.scss
Last active Aug 29, 2015

Embed
What would you like to do?
Bootstrap default media queries
@mixin breakpoint($point) {
@if $point == large {
@media (min-width: 1200px) { @content; }
}
@else if $point == medium {
@media (min-width: 992px) and (max-width: 1119px) { @content; }
}
@else if $point == small {
@media (min-width: 768px) and (max-width: 991px) { @content; }
}
@else if $point == xsmall {
@media (max-width: 767px) { @content; }
}
}
.breakpoint(@point, @content) when (@point = large) {
@media (min-width: 1200px) { @content; }
}
.breakpoint(@point, @content) when (@point = medium) {
@media (min-width: 992px) and (max-width: 1119px) { @content; }
}
.breakpoint(@point, @content) when (@point = small) {
@media (min-width: 768px) and (max-width: 991px) { @content; }
}
.breakpoint(@point, @content) when (@point = xsmall) {
@media (max-width: 767px) { @content; }
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.