Skip to content

Instantly share code, notes, and snippets.

@lunelson
Created April 29, 2013 10:48
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save lunelson/5480906 to your computer and use it in GitHub Desktop.
Save lunelson/5480906 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com, the Sass playground.
//========== REM dimensions, pixel fallback
$base-font-size: 10px !default
=rem($prop, $rems...)
@if type-of($prop) == 'list' and nth($prop,1) == position
position: #{nth($prop,2)}
@each $rem in $rems
#{nth($rem,1)}: #{nth($rem,2) * 1rem}
*#{nth($rem,1)}: #{nth($rem,2) * $base-font-size}
@else if index((absolute, fixed, relative),$prop)
position: #{$prop}
@each $rem in $rems
#{nth($rem,1)}: #{nth($rem,2) * 1rem}
*#{nth($rem,1)}: #{nth($rem,2) * $base-font-size}
@else
$rm: ()
$px: ()
@each $rem in $rems
@if type-of($rem) == 'string'
$rm: append($rm, $rem)
$px: append($px, $rem)
@else
$rm: append($rm, $rem * 1rem)
$px: append($px, $rem * $base-font-size)
#{$prop}: $rm
*#{$prop}: $px
.test
+rem(position relative, bottom 0, right 5)
+rem(height, 2)
+rem(width, 1.5)
+rem(margin, 2, auto, 3)
+rem(position absolute, bottom 0, right 0)
+rem(fixed, bottom 0)
+rem(width, 20)
+rem(height, 4)
.test2
+rem(fixed, top 0)
+rem(font-size, 1)
=position($type, $params...)
position: #{$type}
@each $param in $params
#{nth($param,1)}: #{nth($param,2)}
.test {
position: relative;
bottom: 0rem;
*bottom: 0px;
right: 5rem;
*right: 50px;
height: 2rem;
*height: 20px;
width: 1.5rem;
*width: 15px;
margin: 2rem auto 3rem;
*margin: 20px auto 30px;
position: absolute;
bottom: 0rem;
*bottom: 0px;
right: 0rem;
*right: 0px;
position: fixed;
bottom: 0rem;
*bottom: 0px;
width: 20rem;
*width: 200px;
height: 4rem;
*height: 40px;
}
.test2 {
position: fixed;
top: 0rem;
*top: 0px;
font-size: 1rem;
*font-size: 10px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment