Skip to content

Instantly share code, notes, and snippets.

@krijnhoetmer
Created July 27, 2011 12:21
Show Gist options
  • Save krijnhoetmer/1109243 to your computer and use it in GitHub Desktop.
Save krijnhoetmer/1109243 to your computer and use it in GitHub Desktop.
CSS 'build' thingy
<?php
$src = 'foo { border-radius: 4px; }
bar { box-shadow: 5px 0 0 rgba(0, 0, 0, .5);
baz { background-image: url(img/baz.png); }
quux { background-image: url(img/quuz.png#!); }';
preg_match_all('/url\((.*\.png)\)/U', $src, $matches);
foreach ($matches[1] as $match) {
$src = str_replace($match, 'data:image/png;base64,' . base64_encode(file_get_contents($match)), $src);
}
$src = str_replace('#!', '', $src);
$src = preg_replace('/border-radius: (.*);/U', '-webkit-border-radius: $1; -moz-border-radius: $1; -ms-border-radius: $1; border-radius: $1;', $src);
$src = preg_replace('/box-shadow: (.*);/U', '-webkit-box-shadow: $1; -moz-box-shadow: $1; -ms-box-shadow: $1; box-shadow: $1;', $src);
$src = preg_replace('/box-sizing: (.*);/U', '-moz-box-sizing: $1; -webkit-box-sizing: $1; -ms-box-sizing: $1; box-sizing: $1;', $src);
$src = preg_replace('/transition: (.*);/U', '-moz-transition: $1; -ms-transition: $1; -webkit-transition: $1; -o-transition: $1; transition: $1;', $src);
$src = preg_replace('/transform: (.*);/U', '-moz-transform: $1; -ms-transform: $1; -webkit-transform: $1; -o-transform: $1; transform: $1;', $src);
$src = preg_replace('/background-image: linear-gradient\((.*)\);/U', 'background-image: -webkit-linear-gradient($1); background-image: -moz-linear-gradient($1); background-image: -o-linear-gradient($1); background-image: linear-gradient($1);', $src);
$src = preg_replace('/background-image: -webkit-linear-gradient\(\#(.*), \#(.*)\);/U', 'background-image: -webkit-gradient(linear, left top, left bottom, from(#$1), to(#$2)); background-image: -webkit-linear-gradient(#$1, #$2);', $src);
echo $src;
?>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment