Last active
August 29, 2015 14:19
-
-
Save justinhough/c789e9510133b68d0aaf to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// ---- | |
// libsass (v3.1.0) | |
// ---- | |
$default-font-size: 16; | |
@function remove-unit($num) { | |
@return $num / ($num * 0 + 1); | |
} | |
@mixin rem($property, $values) { | |
$total: length($values); | |
$px-value: ""; | |
$rem-value: ""; | |
@for $i from 1 through $total { | |
$value: nth($values, $i); | |
// Check if $value is string or not | |
@if type_of($value) != string{ | |
// convert to REM | |
$value: remove-unit(nth($values, $i)); | |
$px-value: #{$px-value + $value}px; | |
$rem-value: #{$rem-value + $value / $default-font-size}rem; | |
} | |
@else { | |
// pass value is string | |
$value: nth($values, $i); | |
$px-value: #{$px-value + $value}; | |
$rem-value: #{$rem-value + $value}; | |
} | |
@if $i < $total { | |
// Set PX | |
$rem-value: #{$rem-value + " "}; | |
// Set REM | |
$px-value: #{$px-value + " "}; | |
} | |
} | |
#{$property}: $px-value; | |
#{$property}: $rem-value; | |
} | |
/* WITH VALUES */ | |
@include rem(padding, 12px 16px); | |
@include rem(margin, 16 20); | |
/* WITH AUTO */ | |
@include rem(margin, 12px auto); | |
@include rem(margin, 16 auto); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* WITH VALUES */ | |
padding: 12px 16px; | |
padding: 0.75rem 1rem; | |
margin: 16px 20px; | |
margin: 1rem 1.25rem; | |
/* WITH AUTO */ | |
margin: 12px auto; | |
margin: 0.75rem auto; | |
margin: 16px auto; | |
margin: 1rem auto; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment