KNACSS/styl/config/_mixins.styl

33 lines
988 B
Stylus
Raw Normal View History

2017-03-06 17:35:08 +01:00
// Additionnal "utility" breakpoints aliases
// ex. @include respond-to("medium-up") {...}
breakpoint(bp)
if bp == 'tiny'
return '(max-width: %s)' % tiny
2017-03-06 17:35:08 +01:00
else if bp == 'small'
return '(max-width: %s)' % small
2017-03-06 17:35:08 +01:00
else if bp == 'medium'
return '(max-width: %s)' % medium
2017-03-06 17:35:08 +01:00
else if bp == 'large'
return '(max-width: %s)' % large
2017-03-06 17:35:08 +01:00
else if bp == 'extra-large'
return '(max-width: %s)' % extra-large
2017-03-06 17:35:08 +01:00
else if bp == 'tiny-up'
return '(min-width: %s + 1)' % tiny
2017-03-06 17:35:08 +01:00
else if bp == 'small-up'
return '(min-width: %s + 1)' % small
2017-03-06 17:35:08 +01:00
else if bp == 'medium-up'
return '(min-width: %s + 1)' % medium
2017-03-06 17:35:08 +01:00
else if bp == 'large-up'
return '(min-width: %s + 1)' % large
2017-03-06 17:35:08 +01:00
else if bp == 'extra-large-up'
return '(min-width: %s + 1)' % extra-large
2017-03-06 17:35:08 +01:00
else if bp == 'retina'
return '(-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 2dppx)'
/*
respond-to(value)
string = breakpoint(value)
@media screen and string
2017-03-06 17:35:08 +01:00
{block}
*/