- Notifications
You must be signed in to change notification settings - Fork25
pauloapi/media-queries-scss-mixins
Folders and files
Name | Name | Last commit message | Last commit date | |
---|---|---|---|---|
Repository files navigation
Media Queries SCSS Mixins based on Angular FlexLayout
Download and includemedia-queries.scss
.
@use'media-queries.scss'as*;
.container {@includexs {background:blue; }@includegt-md {color:green }}
Demo:Stackblitz
You can associate breakpoints with mediaQuery definitions using breakpoint alias(es):
Breakpoint | Media Query |
---|---|
xs | 'screen and (max-width: 599px)' |
sm | 'screen and (min-width: 600px) and (max-width: 959px)' |
md | 'screen and (min-width: 960px) and (max-width: 1279px)' |
lg | 'screen and (min-width: 1280px) and (max-width: 1919px)' |
xl | 'screen and (min-width: 1920px) and (max-width: 5000px)' |
lt-sm | 'screen and (max-width: 599px)' |
lt-md | 'screen and (max-width: 959px)' |
lt-lg | 'screen and (max-width: 1279px)' |
lt-xl | 'screen and (max-width: 1919px)' |
gt-xs | 'screen and (min-width: 600px)' |
gt-sm | 'screen and (min-width: 960px)' |
gt-md | 'screen and (min-width: 1280px)' |
gt-lg | 'screen and (min-width: 1920px)' |
Reference:Angular Flex Layout MediaQueries
About
Media Queries SCSS Mixins
Topics
Resources
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Releases
No releases published
Packages0
No packages published