151 lines
4.2 KiB
SCSS
151 lines
4.2 KiB
SCSS
//////////////////////////////
|
|
// Converts the input value to Base EMs
|
|
//////////////////////////////
|
|
@function breakpoint-to-base-em($value) {
|
|
$value-unit: unit($value);
|
|
|
|
// Will convert relative EMs into root EMs.
|
|
@if breakpoint-get('base font size') and type-of(breakpoint-get('base font size')) == 'number' and $value-unit == 'em' {
|
|
$base-unit: unit(breakpoint-get('base font size'));
|
|
|
|
@if $base-unit == 'px' or $base-unit == '%' or $base-unit == 'em' or $base-unit == 'pt' {
|
|
@return base-conversion($value) / base-conversion(breakpoint-get('base font size')) * 1em;
|
|
}
|
|
@else {
|
|
@warn '#{breakpoint-get(\'base font size\')} is not set in valid units for font size!';
|
|
@return false;
|
|
}
|
|
}
|
|
@else {
|
|
@return base-conversion($value);
|
|
}
|
|
}
|
|
|
|
@function base-conversion($value) {
|
|
$unit: unit($value);
|
|
|
|
@if $unit == 'px' {
|
|
@return $value / 16px * 1em;
|
|
}
|
|
@else if $unit == '%' {
|
|
@return $value / 100% * 1em;
|
|
}
|
|
@else if $unit == 'em' {
|
|
@return $value;
|
|
}
|
|
@else if $unit == 'pt' {
|
|
@return $value / 12pt * 1em;
|
|
}
|
|
@else {
|
|
@return $value;
|
|
// @warn 'Everything is terrible! What have you done?!';
|
|
}
|
|
}
|
|
|
|
//////////////////////////////
|
|
// Returns whether the feature can have a min/max pair
|
|
//////////////////////////////
|
|
$breakpoint-min-max-features: 'color',
|
|
'color-index',
|
|
'aspect-ratio',
|
|
'device-aspect-ratio',
|
|
'device-height',
|
|
'device-width',
|
|
'height',
|
|
'monochrome',
|
|
'resolution',
|
|
'width';
|
|
|
|
@function breakpoint-min-max($feature) {
|
|
@each $item in $breakpoint-min-max-features {
|
|
@if $feature == $item {
|
|
@return true;
|
|
}
|
|
}
|
|
@return false;
|
|
}
|
|
|
|
//////////////////////////////
|
|
// Returns whether the feature can have a string value
|
|
//////////////////////////////
|
|
$breakpoint-string-features: 'orientation',
|
|
'scan',
|
|
'color',
|
|
'aspect-ratio',
|
|
'device-aspect-ratio',
|
|
'pointer',
|
|
'luminosity';
|
|
|
|
@function breakpoint-string-value($feature) {
|
|
@each $item in $breakpoint-string-features {
|
|
@if breakpoint-min-max($item) {
|
|
@if $feature == 'min-#{$item}' or $feature == 'max-#{$item}' {
|
|
@return true;
|
|
}
|
|
}
|
|
@else if $feature == $item {
|
|
@return true;
|
|
}
|
|
}
|
|
@return false;
|
|
}
|
|
|
|
//////////////////////////////
|
|
// Returns whether the feature is a media type
|
|
//////////////////////////////
|
|
$breakpoint-media-types: 'all',
|
|
'braille',
|
|
'embossed',
|
|
'handheld',
|
|
'print',
|
|
'projection',
|
|
'screen',
|
|
'speech',
|
|
'tty',
|
|
'tv';
|
|
|
|
@function breakpoint-is-media($feature) {
|
|
@each $media in $breakpoint-media-types {
|
|
@if ($feature == $media) or ($feature == 'not #{$media}') or ($feature == 'only #{$media}') {
|
|
@return true;
|
|
}
|
|
}
|
|
|
|
@return false;
|
|
}
|
|
|
|
//////////////////////////////
|
|
// Returns whether the feature can stand alone
|
|
//////////////////////////////
|
|
$breakpoint-single-string-features: 'color',
|
|
'color-index',
|
|
'grid',
|
|
'monochrome';
|
|
|
|
@function breakpoint-single-string($feature) {
|
|
@each $item in $breakpoint-single-string-features {
|
|
@if $feature == $item {
|
|
@return true;
|
|
}
|
|
}
|
|
@return false;
|
|
}
|
|
|
|
//////////////////////////////
|
|
// Returns whether the feature
|
|
//////////////////////////////
|
|
@function breakpoint-is-resolution($feature) {
|
|
$resolutions: 'device-pixel-ratio', 'dpr';
|
|
|
|
@if breakpoint-get('transform resolutions') {
|
|
$resolutions: append($resolutions, 'resolution');
|
|
}
|
|
|
|
@each $reso in $resolutions {
|
|
@if index($feature, $reso) or index($feature, 'min-#{$reso}') or index($feature, 'max-#{$reso}') {
|
|
@return true;
|
|
}
|
|
}
|
|
|
|
@return false;
|
|
}
|