Skip to content

Instantly share code, notes, and snippets.

View voodoocode's full-sized avatar

ɥɔɐ⅂ ɐɥɔsɐS voodoocode

View GitHub Profile
@voodoocode
voodoocode / _helpers.scss
Created August 22, 2013 09:17
scss mixin for a vertical gradient with 3 steps
@mixin vertical-3stop-gradient($fromColor, $viaColor, $toColor) {
background: #fff; /* Old browsers */
background: -moz-linear-gradient(top, $fromColor 0%, $toColor 49%, $viaColor 50%, $toColor 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, $fromColor), color-stop(49%, $toColor), color-stop(50%, $viaColor), color-stop(100%, $toColor)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, $fromColor 0%, $toColor 49%, $viaColor 50%, $toColor 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, $fromColor 0%, $toColor 49%, $viaColor 50%, $toColor 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, $fromColor 0%, $toColor 49%, $viaColor 50%, $toColor 100%); /* IE10+ */
background: linear-gradient(to bottom, $fromColor 0%, $toColor 49%, $viaColor 50%, $toColor 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#{ie-hex-str($fromColor)}', endColorstr='