Separate vendor prefixes for CSS sucks

Seriously.

Here's my Sass mixins for some CSS3 stuff:

@mixin box-shadow($color, $radius = 1em) {
-moz-box-shadow: 0 0 $radius $color;
-webkit-box-shadow: 0 0 $radius $color;
box-shadow: 0 0 $radius $color;
}

@mixin transitions($properties, $duration, $delay = 0) {
-moz-transition-property: $properties;
-webkit-transition-property: $properties;
-o-transition-property: $properties;
transition-property: $properties;

-moz-transition-duration: $duration;
-webkit-transition-duration: $duration;
-o-transition-duration: $duration;
transition-duration: $duration;

-moz-transition-delay: $delay;
-webkit-transition-delay: $delay;
-o-transition-delay: $delay;
transition-delay: $delay;
}

and here's where they get used:

.post.snippet:hover {
@include transitions(background-color, 2s);
@include transitions(box-shadow, 2s);
@include transitions(-moz-box-shadow, 4s);
@include transitions(-webkit-box-shadow, 4s);
@include transitions(box-shadow, 4s);

@include box-shadow(#0481B5, 1em);
background-color: #0481B5;
}

Which results in this:

.post.snippet:hover {
-moz-transition-property: background-color;
-webkit-transition-property: background-color;
-o-transition-property: background-color;
transition-property: background-color;
-moz-transition-duration: 2s;
-webkit-transition-duration: 2s;
-o-transition-duration: 2s;
transition-duration: 2s;
-moz-transition-delay: 0;
-webkit-transition-delay: 0;
-o-transition-delay: 0;
transition-delay: 0;
-moz-transition-property: box-shadow;
-webkit-transition-property: box-shadow;
-o-transition-property: box-shadow;
transition-property: box-shadow;
-moz-transition-duration: 2s;
-webkit-transition-duration: 2s;
-o-transition-duration: 2s;
transition-duration: 2s;
-moz-transition-delay: 0;
-webkit-transition-delay: 0;
-o-transition-delay: 0;
transition-delay: 0;
-moz-transition-property: -moz-box-shadow;
-webkit-transition-property: -moz-box-shadow;
-o-transition-property: -moz-box-shadow;
transition-property: -moz-box-shadow;
-moz-transition-duration: 4s;
-webkit-transition-duration: 4s;
-o-transition-duration: 4s;
transition-duration: 4s;
-moz-transition-delay: 0;
-webkit-transition-delay: 0;
-o-transition-delay: 0;
transition-delay: 0;
-moz-transition-property: -webkit-box-shadow;
-webkit-transition-property: -webkit-box-shadow;
-o-transition-property: -webkit-box-shadow;
transition-property: -webkit-box-shadow;
-moz-transition-duration: 4s;
-webkit-transition-duration: 4s;
-o-transition-duration: 4s;
transition-duration: 4s;
-moz-transition-delay: 0;
-webkit-transition-delay: 0;
-o-transition-delay: 0;
transition-delay: 0;
-moz-transition-property: box-shadow;
-webkit-transition-property: box-shadow;
-o-transition-property: box-shadow;
transition-property: box-shadow;
-moz-transition-duration: 4s;
-webkit-transition-duration: 4s;
-o-transition-duration: 4s;
transition-duration: 4s;
-moz-transition-delay: 0;
-webkit-transition-delay: 0;
-o-transition-delay: 0;
transition-delay: 0;
-moz-box-shadow: 0 0 1em #0481b5;
-webkit-box-shadow: 0 0 1em #0481b5;
box-shadow: 0 0 1em #0481b5;
background-color: #0481B5; }

...

So, yeah: I'm switching to jQueryUI for most of the animation heavy lifting, now. Hopefully browsers start dropping the -moz, -o and -webkit for primary use and settle on -v (vendor) or something like that in the future. Maybe with fallbacks to their own prefixes in case someone really really really needs to specify that -moz handles it another way.