github markdown css+script with syntax highlighting. Works with http://markedapp.com

gh-like.css

/* 
   Some simple Github-like styles, with syntax highlighting CSS via Pygments.
*/
body{
	font-family: helvetica, arial, freesans, clean, sans-serif;
	color: #333;
	background-color: #fff;
	border: none;
	line-height: 1.5;
	margin: 2em 3em;
	text-align:left;
}
pre{
	background-color: #eee;
	padding: 10px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	overflow: auto;
}
code{
	background-color: #eee;
	padding: 1px 3px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;	
}
li p{
	margin: 0.3em;
}
li{
	list-style-type: disc;
}
a:link, a:visited{
	color: #33e;
	text-decoration: none;
}
a:hover{
	color: #00f;
	text-shadow:1px 1px 2px #ccf;
	text-decoration:underline;
}
h1{
	color: #999;
	font-weight: bold;
}
h2{
	border-bottom: 1px dotted #aaa;
	margin-bottom: 1em;
	color: #333;
}
h3{
	color: #666;
}
.shadow{
	-webkit-box-shadow:0 5px 15px #000;
	-moz-box-shadow:0 5px 15px #000;
	box-shadow:0 5px 15px #000;		
}


.hll { background-color: #ffffcc }
.c { color: #888888 } /* Comment */
.err { color: #a61717; background-color: #e3d2d2 } /* Error */
.k { color: #008800; font-weight: bold } /* Keyword */
.cm { color: #888888 } /* Comment.Multiline */
.cp { color: #cc0000; font-weight: bold } /* Comment.Preproc */
.c1 { color: #888888 } /* Comment.Single */
.cs { color: #cc0000; font-weight: bold; background-color: #fff0f0 } /* Comment.Special */
.gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
.ge { font-style: italic } /* Generic.Emph */
.gr { color: #aa0000 } /* Generic.Error */
.gh { color: #303030 } /* Generic.Heading */
.gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
.go { color: #888888 } /* Generic.Output */
.gp { color: #555555 } /* Generic.Prompt */
.gs { font-weight: bold } /* Generic.Strong */
.gu { color: #606060 } /* Generic.Subheading */
.gt { color: #aa0000 } /* Generic.Traceback */
.kc { color: #008800; font-weight: bold } /* Keyword.Constant */
.kd { color: #008800; font-weight: bold } /* Keyword.Declaration */
.kn { color: #008800; font-weight: bold } /* Keyword.Namespace */
.kp { color: #008800 } /* Keyword.Pseudo */
.kr { color: #008800; font-weight: bold } /* Keyword.Reserved */
.kt { color: #888888; font-weight: bold } /* Keyword.Type */
.m { color: #0000DD; font-weight: bold } /* Literal.Number */
.s { color: #dd2200; background-color: #fff0f0 } /* Literal.String */
.na { color: #336699 } /* Name.Attribute */
.nb { color: #003388 } /* Name.Builtin */
.nc { color: #bb0066; font-weight: bold } /* Name.Class */
.no { color: #003366; font-weight: bold } /* Name.Constant */
.nd { color: #555555 } /* Name.Decorator */
.ne { color: #bb0066; font-weight: bold } /* Name.Exception */
.nf { color: #0066bb; font-weight: bold } /* Name.Function */
.nl { color: #336699; font-style: italic } /* Name.Label */
.nn { color: #bb0066; font-weight: bold } /* Name.Namespace */
.py { color: #336699; font-weight: bold } /* Name.Property */
.nt { color: #bb0066; font-weight: bold } /* Name.Tag */
.nv { color: #336699 } /* Name.Variable */
.ow { color: #008800 } /* Operator.Word */
.w { color: #bbbbbb } /* Text.Whitespace */
.mf { color: #0000DD; font-weight: bold } /* Literal.Number.Float */
.mh { color: #0000DD; font-weight: bold } /* Literal.Number.Hex */
.mi { color: #0000DD; font-weight: bold } /* Literal.Number.Integer */
.mo { color: #0000DD; font-weight: bold } /* Literal.Number.Oct */
.sb { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Backtick */
.sc { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Char */
.sd { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Doc */
.s2 { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Double */
.se { color: #0044dd; background-color: #fff0f0 } /* Literal.String.Escape */
.sh { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Heredoc */
.si { color: #3333bb; background-color: #fff0f0 } /* Literal.String.Interpol */
.sx { color: #22bb22; background-color: #f0fff0 } /* Literal.String.Other */
.sr { color: #008800; background-color: #fff0ff } /* Literal.String.Regex */
.s1 { color: #dd2200; background-color: #fff0f0 } /* Literal.String.Single */
.ss { color: #aa6600; background-color: #fff0f0 } /* Literal.String.Symbol */
.bp { color: #003388 } /* Name.Builtin.Pseudo */
.vc { color: #336699 } /* Name.Variable.Class */
.vg { color: #dd7700 } /* Name.Variable.Global */
.vi { color: #3333bb } /* Name.Variable.Instance */
.il { color: #0000DD; font-weight: bold } /* Literal.Number.Integer.Long */

ghmarkdown.rb

#!/usr/bin/ruby
#  Github-flavored markdown to HTML, in a command-line util.
#
#  $ cat README.md | ./ghmarkdown.rb
#
#  Notes:
#
#  You will need to install Pygments for syntax coloring
#
#    $ sudo easy_install pygments
#
#  Install the gems redcarpet, albino, and nokogiri
#
#  To work with http://markedapp.com/ I also had to
#    $ sudo ln -s /usr/local/bin/pygmentize /usr/bin
#
require 'rubygems'
require 'redcarpet'
require 'albino'
require 'nokogiri'

def markdown(text)
  options = [:hard_wrap, :filter_html, :autolink, :no_intraemphasis, :fenced_code, :gh_blockcode]
  html = Redcarpet.new(text, *options).to_html 
  syntax_highlighter(html)
end

def syntax_highlighter(html)
  doc = Nokogiri::HTML(html)
  doc.search("//pre[@lang]").each do |pre|
    pre.replace Albino.colorize(pre.text.rstrip, pre[:lang])
  end
  doc.to_s # doc.at_css("body").inner_html.to_s
end

puts markdown(ARGF.read)

thanks for this very usefull gist, i have a little question, when i run your script the markdown is renderer with a DOCTYPE, <html> and <body> tags. I have searched on the web a way to remove these tags but haven't found yet.

For exemple when i render this markdown:

# hello

with your script, it's like this :

<!DOCTYPE html>
<html><body>
<h1>Hello</h1>
</body></html>

What i'm looking for is something like:

<h1>Hello</h1>

Do you know an option for that ? many thanks

Hi - to get rid of the <html> etc, see line 33 of the ruby script:

  doc.at_css("body").inner_html.to_s

Just use that instead of doc.to_s and I believe it will do what you want. Let me know!

oh! haven't seen it, works perfectly thanks.

Dang this is so cool! I'm using it in my blog. Thanks man!

thank you, this is so useful!