Skip to content

Instantly share code, notes, and snippets.

@KamaMakh

KamaMakh/breakpoints.scss

Created December 25, 2020 11:22
Show Gist options
  • Save KamaMakh/400b528e9d36cbf2d319a8e7b46e13f8 to your computer and use it in GitHub Desktop.
Save KamaMakh/400b528e9d36cbf2d319a8e7b46e13f8 to your computer and use it in GitHub Desktop.
Download ZIP
scss media queries
Raw
breakpoints.scss
$lg: 1920px;
$md: 1280px;
$sm: 768px;
$xs: 360px;
@mixin xs {
@media (max-width: $sm - 1px) {
@content;
}
}
@mixin sm {
@media (min-width: $sm) and (max-width: $md - 1px) {
@content;
}
}
@mixin md {
@media (min-width: $md) and (max-width: $lg - 1px) {
@content;
}
}
@mixin lg {
@media (min-width: $lg + 1px) {
@content;
}
}
@mixin lg- {
@media (max-width: $lg - 1px) {
@content;
}
}
@mixin md- {
@media (max-width: $md - 1px) {
@content;
}
}
@mixin sm- {
@media (max-width: $sm - 1px) {
@content;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment