thoughtbot/bourbon — pull request #25 by sean-lynch (2011-10-11 20:22:34+00:00)
Title: Fix for linear-gradient mixin on older webkit browsers

The current linear-gradient mixin is generating incorrect CSS with the -webkit-gradient value. For example, it currently generates this:
-webkit-gradient(linear, left top, left bottom, from(#eece64 0%), to(#b69c43 50%))

This is because variables $G1 and $G2 are actually lists, not single color values.

Newer Chrome and Safari browsers are not affected because they simply read the -webkit-linear-gradient rule which is also generated by the linear-gradient mixin. Unfortunately, older webkit browsers do not support this rule and only support the -webkit-gradient(linear, ...). Devices that have this older webkit version includes all iOS devices before iOS5 and all Android devices before 3.0 (could also include 3.0, I don't have a honey comb device to test).

This change modifies the -webkit-gradient to take the first and last values of the parameters and do a simple linear gradient between them. Someone with a bit more Sass muscle than I could enable the rest of the color stops by generating a rule that looks something like:
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(242, 246, 248)), color-stop(0.5, rgb(216, 225, 231)), color-stop(0.51, rgb(181, 198, 208)), to(rgb(224, 239, 249)))