2010-03-06

Tune google-code-prettify for Blogger dark theme

Following up my post about using google-code-prettify to syntax highlight code on Blogger, I want to share what I did to tune it for a dark theme.

Big warning: I'm completely ignorant of any web development, html/css/js are kinda arab (no offense intended) for me, so I'm quite sure there are more elegant solutions to this, but at least it works, and seems to have broken nothing :)

So, the default CSS has some bad values for tokens colors, in particular for the keywords and tags (that are in dark blue) and for the plain text (that is in black, so completely hidden).

What I did was to simply override those values, using this table as reference; so now the code to add to Blogger "Minima Black" template (the one I'm using) is:
<link href='http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.css'
rel='stylesheet' type='text/css'/>
<style type='text/css'>
.pln { color: #C0C0C0; }
.kwd { color: #4169E1; }
.tag { color: #4169E1; }
</style>
<script src='http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.js'
type='text/javascript'> </script>

No comments: