Animations @mixin keyframes($name) { @-ms-keyframes #{$name} { @content } @-o-keyframes #{$name} { @content } @-moz-keyframes #{$name} { @content } @-webkit-keyframes #{$name} { @content } @keyframes #{$name} { @content } } @mixin animation($val) { -ms-animation: $val; -o-animation: $val; -webkit-animation: $val; -moz-animation: $val; animation: $val; } Example @include animation(( delay: .8s, duration: 1.6s, iteration-count: 1, name: fadeFromHilite, […]

When I’m building a new site, I usually spend a fair amount of time showing and hiding things at various breakpoints. This code defines the major breakpoints in use, then prints out a bunch of helper classes to make the showing/hiding easier. First create a sass map of all the breakpoints. $breakpoints: ( small:550px, medium:800px, […]