32 lines
1.0 KiB
SCSS
32 lines
1.0 KiB
SCSS
//下一个断点
|
|
@function breakpoint-next( $name, $breakpoints: breakpoints, $breakpoint-names: map-keys($breakpoints)) {
|
|
$n: index($breakpoint-names, $name);
|
|
@return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);
|
|
}
|
|
|
|
//断点最小值
|
|
@function breakpoint-min($name, $breakpoints: $breakpoints) {
|
|
$min: map-get($breakpoints, $name); // @return if($min != 0, $min, null);
|
|
@return $min;
|
|
}
|
|
|
|
//断点最大值
|
|
@function breakpoint-max($name, $breakpoints: $breakpoints) {
|
|
$next: breakpoint-next($name, $breakpoints);
|
|
@return if($next, breakpoint-min($next, $breakpoints) - 1px, null);
|
|
}
|
|
|
|
//生成类名“-sm、-md、-lg、-cl” -xs?
|
|
@function breakpoint-infix($name, $breakpoints: $breakpoints) {
|
|
@return if(breakpoint-min($name, $breakpoints)==null, "", "-#{$name}");
|
|
}
|
|
|
|
@function px2rem($pixels, $context: $remFactor) {
|
|
@if (unitless($pixels)) {
|
|
$pixels: $pixels * 1px;
|
|
}
|
|
@if (unitless($context)) {
|
|
$context: $context * 1px;
|
|
}
|
|
@return $pixels / $context * 1rem;
|
|
} |