Question

I have about 200 CSS files like this:

/**
 * GeSHi Dynamically Generated Stylesheet
 * --------------------------------------
 * Dynamically generated stylesheet for bnf
 * CSS class: , CSS id: 
 * GeSHi (C) 2004 - 2007 Nigel McNie, 2007 - 2008 Benny Baumann
 * (http://qbnz.com/highlighter/ and http://geshi.org/)
 * --------------------------------------
 */
.bnf .de1, .bnf .de2 {font: normal normal 1em/1.2em monospace; margin:0; padding:0; background:none; vertical-align:top;}
.bnf  {font-family:monospace;}
.bnf .imp {font-weight: bold; color: red;}
.bnf li, .bnf .li1 {font-weight: normal; vertical-align:top;}
.bnf .ln {width:1px;text-align:right;margin:0;padding:0 2px;vertical-align:top;}
.bnf .li2 {font-weight: bold; vertical-align:top;}
.bnf .sy0 {color: #000066; font-weight: bold;}
.bnf .st0 {color: #a00;}
.bnf .st1 {color: #a00;}
.bnf .re0 {color: #007;}
.bnf .ln-xtra, .bnf li.ln-xtra, .bnf div.ln-xtra {background-color: #ffc;}
.bnf span.xtra { display:block; }

But colors in these CSS files are designed to look ok only on light (preferably white) backgrounds. Is there an algo (I can express in PHP code) I can apply to colors in these files to make them look nice on dark backgrounds (close to black)? May be I should just invert all colors? Or is there a better way?

Answer 1

To convert all color values found from an CSS file to their inverse values, you can use this function:

function inverseColors($css) {
    preg_match_all('/#([a-f0-9]{6}|[a-f0-9]{3})/i', $css, $matches);
    $original = $matches[0];
    $inversed = array();
    foreach($matches[1] as $key => $color) {    
        $parts = str_split($color, strlen($color) == 3 ? 1 : 2);
        foreach($parts as &$part) {
            $part = str_pad(dechex(255 - hexdec($part)), 2, 0, STR_PAD_LEFT);
        }
        $inversed[$key] = '#'.implode('', $parts);    
    }

    $css = str_replace($original, $inversed, $css);
    echo $css;
}

That’ll work on both three and six digit hex color values. But note that this will not result in optimal colors, inverse color will probably not be the best for your layout. Better results could be achieved by creating a lookup table for all colors and substituting those values in the new CSS.

To loop through all CSS files, you can use SPL classes to do a recursive search, then replace the CSS files using

file_put_contents($file, inverseColors(file_get_contents($file)));

Take a look at PHP’s documentation about glob to learn more how to iterate directories recursively (in the comments section).