Some experiment with sexy FX
A Pen by Erick Jones on CodePen.
# --------------------------------------------------------------------------- | |
# | |
# Description: This file holds all my BASH configurations and aliases | |
# | |
# Sections: | |
# 1. Environment Configuration | |
# 2. Make Terminal Better (remapping defaults and adding functionality) | |
# 3. File and Folder Management | |
# 4. Searching | |
# 5. Process Management |
@mixin remify($property, $sizes) { | |
$pixelSizes: (); | |
$remSizes: (); | |
@each $s in $sizes { | |
$pixelSizes: append($pixelSizes, $s * 1px); | |
$remSizes: append($remSizes, rem($s)); | |
} | |
#{$property}: $pixelSizes; |
// Defaults | |
$base_font_size: 16px; | |
$rem_fallback: true; | |
// Usage: rem(16px); | |
@function rem( | |
$size, | |
$base_font_size: $base_font_size | |
) { | |
@return #{$size / $base_font_size}rem; |
Some experiment with sexy FX
A Pen by Erick Jones on CodePen.
.green-dog { | |
-webkit-transform: rotate(30deg); /* Ch <36, Saf 5.1+, iOS, An =<4.4.4 */ | |
-ms-transform: rotate(30deg); /* IE 9 */ | |
transform: rotate(30deg); /* IE 10, Fx 16+, Op 12.1+ */ | |
} |
@mixin transform-rotate($rotateValue) { | |
-webkit-transform: rotate($rotateValue); /* Ch <36, Saf 5.1+, iOS, An =<4.4.4 */ | |
-ms-transform: rotate($rotateValue); /* IE 9 */ | |
transform: rotate($rotateValue); /* IE 10, Fx 16+, Op 12.1+ */ | |
} | |
.green-dog { | |
@include transform-rotate(30deg); | |
} |
.black-dog { | |
background-color: #333; | |
} | |
.black-cat { | |
@extend .black-dog; | |
width:20px; | |
} |
.black-dog, .black-cat { | |
background-color: #333; | |
} | |
.black-cat { | |
width: 20px; | |
} |
@import '_reset'; | |
// The rest of your code goes here |
* { | |
margin: 0; | |
padding: 0; | |
border: 0; | |
} |