src/assets/styles/mixins/_fluid.scss
// ----
// libsass (v3.5.0.beta.2)
// ----
// =========================================================================
//
// PRECISE CONTROL OVER RESPONSIVE TYPOGRAPHY FOR SASS
// ---------------------------------------------------
// Indrek Paas @indrekpaas
//
// Inspired by Mike Riethmuller's Precise control over responsive typography
// http://madebymike.com.au/writing/precise-control-responsive-typography/
//
// Borrowed `strip-unit` function from Hugo Giraudel
// https://css-tricks.com/snippets/sass/strip-unit-function/
//
// 02.04.2018 Remove `screen` keyword from media queries
// 11.08.2016 Remove redundant `&` self-reference
// 31.03.2016 Remove redundant parenthesis from output
// 02.10.2015 Add support for multiple properties
// 24.04.2015 Initial release
//
// =========================================================================
/* stylelint-disable */
@mixin fluid-type($properties, $min-vw, $max-vw, $min_value, $max_value) {
@each $property in $properties {
#{$property}: $min_value;
}
@media (min-width : $min-vw) {
@each $property in $properties {
#{$property}: calc(
#{$min_value} + #{strip-unit($max_value - $min_value)} * (100vw - #{$min-vw}) / #{strip-unit(
$max-vw - $min-vw
)}
);
}
}
@media (min-width : $max-vw) {
@each $property in $properties {
#{$property}: $max_value;
}
}
}
@function strip-unit($number) {
@if type-of($number) == 'number' and not unitless($number) {
@return $number / ($number * 0 + 1);
}
@return $number;
}