Fixing sample tests.

11 files changed, 214 insertions, 109 deletions

diff --git a/sample/css.expected b/sample/css.expected
index bda52ff..c101aee 100644
--- a/sample/css.expected
+++ b/sample/css.expected
@@ -2,7 +2,7 @@
   background-color: #f8f8f8;
   border: 1px solid silver;
   font-family: 'Courier New', 'Terminal', monospace;
-  color: #100;
+  color: #000;
 }
 .CodeRay pre { margin: 0px }
 
@@ -19,6 +19,7 @@ table.CodeRay td { padding: 2px 4px; vertical-align: top }
   text-align: right;
 }
 .CodeRay .line_numbers tt { font-weight: bold }
+.CodeRay .line_numbers .highlighted { color: red }
 .CodeRay .no { padding: 0px 4px }
 .CodeRay .code { width: 100% }
 
@@ -31,10 +32,11 @@ ol.CodeRay li { white-space: pre }
 
 .CodeRay .af { color:#00C }
 .CodeRay .an { color:#007 }
+.CodeRay .at { color:#f08 }
 .CodeRay .av { color:#700 }
 .CodeRay .aw { color:#C00 }
 .CodeRay .bi { color:#509; font-weight:bold }
-.CodeRay .c  { color:#666; }
+.CodeRay .c  { color:#888; }
 
 .CodeRay .ch { color:#04D }
 .CodeRay .ch .k { color:#04D }
@@ -48,6 +50,7 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .di { color:#088; font-weight:bold }
 .CodeRay .dl { color:black }
 .CodeRay .do { color:#970 }
+.CodeRay .dt { color:#34b }
 .CodeRay .ds { color:#D42; font-weight:bold }
 .CodeRay .e  { color:#666; font-weight:bold }
 .CodeRay .en { color:#800; font-weight:bold }
@@ -60,11 +63,12 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .i  { color:#00D; font-weight:bold }
 .CodeRay .ic { color:#B44; font-weight:bold }
 
-.CodeRay .il { background: #eee }
+.CodeRay .il { background: #eee; color: black }
 .CodeRay .il .il { background: #ddd }
 .CodeRay .il .il .il { background: #ccc }
-.CodeRay .il .idl { font-weight: bold; color: #888 }
+.CodeRay .il .idl { font-weight: bold; color: #777 }
 
+.CodeRay .im { color:#f00; }
 .CodeRay .in { color:#B2B; font-weight:bold }
 .CodeRay .iv { color:#33B }
 .CodeRay .la { color:#970; font-weight:bold }
@@ -74,9 +78,15 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .op { }
 .CodeRay .pc { color:#038; font-weight:bold }
 .CodeRay .pd { color:#369; font-weight:bold }
-.CodeRay .pp { color:#579 }
-.CodeRay .pt { color:#339; font-weight:bold }
-.CodeRay .r  { color:#080; font-weight:bold }
+.CodeRay .pp { color:#579; }
+.CodeRay .ps { color:#00C; font-weight: bold; }
+.CodeRay .pt { color:#349; font-weight:bold }
+.CodeRay .r, .kw  { color:#080; font-weight:bold }
+
+.CodeRay .ke { color: #808; }
+.CodeRay .ke .dl { color: #606; }
+.CodeRay .ke .ch { color: #80f; }
+.CodeRay .vl { color: #088; }
 
 .CodeRay .rx { background-color:#fff0ff }
 .CodeRay .rx .k { color:#808 }
@@ -84,14 +94,15 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .rx .mod { color:#C2C }
 .CodeRay .rx .fu  { color:#404; font-weight: bold }
 
-.CodeRay .s  { background-color:#fff0f0 }
-.CodeRay .s  .s { background-color:#ffe0e0 }
-.CodeRay .s  .s  .s { background-color:#ffd0d0 }
-.CodeRay .s  .k { color:#D20 }
-.CodeRay .s  .dl { color:#710 }
+.CodeRay .s { background-color:#fff0f0; color: #D20; }
+.CodeRay .s .s { background-color:#ffe0e0 }
+.CodeRay .s .s  .s { background-color:#ffd0d0 }
+.CodeRay .s .k { }
+.CodeRay .s .ch { color: #b0b; }
+.CodeRay .s .dl { color: #710; }
 
-.CodeRay .sh { background-color:#f0fff0 }
-.CodeRay .sh .k { color:#2B2 }
+.CodeRay .sh { background-color:#f0fff0; color:#2B2 }
+.CodeRay .sh .k { }
 .CodeRay .sh .dl { color:#161 }
 
 .CodeRay .sy { color:#A60 }
@@ -104,3 +115,13 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .ty { color:#339; font-weight:bold }
 .CodeRay .v  { color:#036 }
 .CodeRay .xt { color:#444 }
+
+.CodeRay .ins { background: #afa; }
+.CodeRay .del { background: #faa; }
+.CodeRay .chg { color: #aaf; background: #007; }
+.CodeRay .head { color: #f8f; background: #505 }
+
+.CodeRay .ins .ins { color: #080; font-weight:bold }
+.CodeRay .del .del { color: #800; font-weight:bold }
+.CodeRay .chg .chg { color: #66f; }
+.CodeRay .head .head { color: #f4f; }
diff --git a/sample/div.expected b/sample/div.expected
index ef5ff90..9ad26cb 100644
--- a/sample/div.expected
+++ b/sample/div.expected
@@ -1,17 +1,17 @@
 <div class="CodeRay">
-  <div class="code"><pre><span style="color:#080; font-weight:bold">for</span> a <span style="color:#080; font-weight:bold">in</span> <span style="color:#00D; font-weight:bold">0</span>..<span style="color:#00D; font-weight:bold">255</span>
+  <div class="code"><pre><span style="color:#080;font-weight:bold">for</span> a <span style="color:#080;font-weight:bold">in</span> <span style="color:#00D;font-weight:bold">0</span>..<span style="color:#00D;font-weight:bold">255</span>
         a = a.chr
-        <span style="color:#080; font-weight:bold">begin</span>
-                x = eval(<span style="background-color:#fff0f0"><span style="color:#710">&quot;</span><span style="color:#D20">?</span><span style="color:#04D">\\</span><span style="background: #eee"><span style="font-weight: bold; color: #888">#{</span>a<span style="font-weight: bold; color: #888">}</span></span><span style="color:#710">&quot;</span></span>)
-                <span style="color:#080; font-weight:bold">if</span> x == a[<span style="color:#00D; font-weight:bold">0</span>]
-                        <span style="color:#080; font-weight:bold">next</span>
-                <span style="color:#080; font-weight:bold">else</span>
-                        print <span style="background-color:#fff0f0"><span style="color:#710">&quot;</span><span style="background: #eee"><span style="font-weight: bold; color: #888">#{</span>a<span style="font-weight: bold; color: #888">}</span></span><span style="color:#D20">: </span><span style="background: #eee"><span style="font-weight: bold; color: #888">#{</span>x<span style="font-weight: bold; color: #888">}</span></span><span style="color:#710">&quot;</span></span>
-                <span style="color:#080; font-weight:bold">end</span>
-        <span style="color:#080; font-weight:bold">rescue</span> <span style="color:#036; font-weight:bold">SyntaxError</span> =&gt; boom
-                print <span style="background-color:#fff0f0"><span style="color:#710">&quot;</span><span style="background: #eee"><span style="font-weight: bold; color: #888">#{</span>a<span style="font-weight: bold; color: #888">}</span></span><span style="color:#D20">: error</span><span style="color:#710">&quot;</span></span>
-        <span style="color:#080; font-weight:bold">end</span>
+        <span style="color:#080;font-weight:bold">begin</span>
+                x = eval(<span style="background-color:#fff0f0;color:#D20"><span style="color:#710">&quot;</span><span style="">?</span><span style="color:#b0b">\\</span><span style="background:#eee;color:black"><span style="font-weight:bold;color:#777">#{</span>a<span style="font-weight:bold;color:#777">}</span></span><span style="color:#710">&quot;</span></span>)
+                <span style="color:#080;font-weight:bold">if</span> x == a[<span style="color:#00D;font-weight:bold">0</span>]
+                        <span style="color:#080;font-weight:bold">next</span>
+                <span style="color:#080;font-weight:bold">else</span>
+                        print <span style="background-color:#fff0f0;color:#D20"><span style="color:#710">&quot;</span><span style="background:#eee;color:black"><span style="font-weight:bold;color:#777">#{</span>a<span style="font-weight:bold;color:#777">}</span></span><span style="">: </span><span style="background:#eee;color:black"><span style="font-weight:bold;color:#777">#{</span>x<span style="font-weight:bold;color:#777">}</span></span><span style="color:#710">&quot;</span></span>
+                <span style="color:#080;font-weight:bold">end</span>
+        <span style="color:#080;font-weight:bold">rescue</span> <span style="color:#036;font-weight:bold">SyntaxError</span> =&gt; boom
+                print <span style="background-color:#fff0f0;color:#D20"><span style="color:#710">&quot;</span><span style="background:#eee;color:black"><span style="font-weight:bold;color:#777">#{</span>a<span style="font-weight:bold;color:#777">}</span></span><span style="">: error</span><span style="color:#710">&quot;</span></span>
+        <span style="color:#080;font-weight:bold">end</span>
         puts
-<span style="color:#080; font-weight:bold">end</span>
+<span style="color:#080;font-weight:bold">end</span>
 </pre></div>
 </div>
diff --git a/sample/highlight.expected b/sample/highlight.expected
index 07956ad..afcdd1d 100644
--- a/sample/highlight.expected
+++ b/sample/highlight.expected
@@ -8,7 +8,7 @@
   background-color: #f8f8f8;
   border: 1px solid silver;
   font-family: 'Courier New', 'Terminal', monospace;
-  color: #100;
+  color: #000;
 }
 .CodeRay pre { margin: 0px }
 
@@ -25,6 +25,7 @@ table.CodeRay td { padding: 2px 4px; vertical-align: top }
   text-align: right;
 }
 .CodeRay .line_numbers tt { font-weight: bold }
+.CodeRay .line_numbers .highlighted { color: red }
 .CodeRay .no { padding: 0px 4px }
 .CodeRay .code { width: 100% }
 
@@ -37,10 +38,11 @@ ol.CodeRay li { white-space: pre }
 
 .CodeRay .af { color:#00C }
 .CodeRay .an { color:#007 }
+.CodeRay .at { color:#f08 }
 .CodeRay .av { color:#700 }
 .CodeRay .aw { color:#C00 }
 .CodeRay .bi { color:#509; font-weight:bold }
-.CodeRay .c  { color:#666; }
+.CodeRay .c  { color:#888; }
 
 .CodeRay .ch { color:#04D }
 .CodeRay .ch .k { color:#04D }
@@ -54,6 +56,7 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .di { color:#088; font-weight:bold }
 .CodeRay .dl { color:black }
 .CodeRay .do { color:#970 }
+.CodeRay .dt { color:#34b }
 .CodeRay .ds { color:#D42; font-weight:bold }
 .CodeRay .e  { color:#666; font-weight:bold }
 .CodeRay .en { color:#800; font-weight:bold }
@@ -66,11 +69,12 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .i  { color:#00D; font-weight:bold }
 .CodeRay .ic { color:#B44; font-weight:bold }
 
-.CodeRay .il { background: #eee }
+.CodeRay .il { background: #eee; color: black }
 .CodeRay .il .il { background: #ddd }
 .CodeRay .il .il .il { background: #ccc }
-.CodeRay .il .idl { font-weight: bold; color: #888 }
+.CodeRay .il .idl { font-weight: bold; color: #777 }
 
+.CodeRay .im { color:#f00; }
 .CodeRay .in { color:#B2B; font-weight:bold }
 .CodeRay .iv { color:#33B }
 .CodeRay .la { color:#970; font-weight:bold }
@@ -80,9 +84,15 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .op { }
 .CodeRay .pc { color:#038; font-weight:bold }
 .CodeRay .pd { color:#369; font-weight:bold }
-.CodeRay .pp { color:#579 }
-.CodeRay .pt { color:#339; font-weight:bold }
-.CodeRay .r  { color:#080; font-weight:bold }
+.CodeRay .pp { color:#579; }
+.CodeRay .ps { color:#00C; font-weight: bold; }
+.CodeRay .pt { color:#349; font-weight:bold }
+.CodeRay .r, .kw  { color:#080; font-weight:bold }
+
+.CodeRay .ke { color: #808; }
+.CodeRay .ke .dl { color: #606; }
+.CodeRay .ke .ch { color: #80f; }
+.CodeRay .vl { color: #088; }
 
 .CodeRay .rx { background-color:#fff0ff }
 .CodeRay .rx .k { color:#808 }
@@ -90,14 +100,15 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .rx .mod { color:#C2C }
 .CodeRay .rx .fu  { color:#404; font-weight: bold }
 
-.CodeRay .s  { background-color:#fff0f0 }
-.CodeRay .s  .s { background-color:#ffe0e0 }
-.CodeRay .s  .s  .s { background-color:#ffd0d0 }
-.CodeRay .s  .k { color:#D20 }
-.CodeRay .s  .dl { color:#710 }
+.CodeRay .s { background-color:#fff0f0; color: #D20; }
+.CodeRay .s .s { background-color:#ffe0e0 }
+.CodeRay .s .s  .s { background-color:#ffd0d0 }
+.CodeRay .s .k { }
+.CodeRay .s .ch { color: #b0b; }
+.CodeRay .s .dl { color: #710; }
 
-.CodeRay .sh { background-color:#f0fff0 }
-.CodeRay .sh .k { color:#2B2 }
+.CodeRay .sh { background-color:#f0fff0; color:#2B2 }
+.CodeRay .sh .k { }
 .CodeRay .sh .dl { color:#161 }
 
 .CodeRay .sy { color:#A60 }
@@ -111,6 +122,16 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .v  { color:#036 }
 .CodeRay .xt { color:#444 }
 
+.CodeRay .ins { background: #afa; }
+.CodeRay .del { background: #faa; }
+.CodeRay .chg { color: #aaf; background: #007; }
+.CodeRay .head { color: #f8f; background: #505 }
+
+.CodeRay .ins .ins { color: #080; font-weight:bold }
+.CodeRay .del .del { color: #800; font-weight:bold }
+.CodeRay .chg .chg { color: #66f; }
+.CodeRay .head .head { color: #f4f; }
+
 </style>
 
 <body>
@@ -130,17 +151,17 @@ ol.CodeRay li { white-space: pre }
 </tt>13<tt>
 </tt>14<tt>
 </tt></pre></td>
-  <td class="code"><pre ondblclick="with (this.style) { overflow = (overflow == 'auto' || overflow == '') ? 'visible' : 'auto' }">require <span style="background-color:#fff0f0"><span style="color:#710">'</span><span style="color:#D20">coderay</span><span style="color:#710">'</span></span><tt>
+  <td class="code"><pre ondblclick="with (this.style) { overflow = (overflow == 'auto' || overflow == '') ? 'visible' : 'auto' }">require <span style="background-color:#fff0f0;color:#D20"><span style="color:#710">'</span><span style="">coderay</span><span style="color:#710">'</span></span><tt>
 </tt><tt>
-</tt>puts <span style="color:#036; font-weight:bold">CodeRay</span>.highlight(<span style="background-color:#fff0f0"><span style="color:#710">'</span><span style="color:#D20">puts &quot;Hello, World!&quot;</span><span style="color:#710">'</span></span>, <span style="color:#A60">:ruby</span>)<tt>
+</tt>puts <span style="color:#036;font-weight:bold">CodeRay</span>.highlight(<span style="background-color:#fff0f0;color:#D20"><span style="color:#710">'</span><span style="">puts &quot;Hello, World!&quot;</span><span style="color:#710">'</span></span>, <span style="color:#A60">:ruby</span>)<tt>
 </tt><tt>
-</tt>output = <span style="color:#036; font-weight:bold">CodeRay</span>.highlight_file(<span style="color:#d70; font-weight:bold">$0</span>, <span style="color:#A60">:line_numbers</span> =&gt; <span style="color:#A60">:table</span>)<tt>
-</tt>puts <span style="background-color:#fff0f0"><span style="color:#710">&lt;&lt;HTML</span></span><span style="background-color:#fff0f0"><span style="color:#D20"><tt>
+</tt>output = <span style="color:#036;font-weight:bold">CodeRay</span>.highlight_file(<span style="color:#d70;font-weight:bold">$0</span>, <span style="color:#A60">:line_numbers</span> =&gt; <span style="color:#A60">:table</span>)<tt>
+</tt>puts <span style="background-color:#fff0f0;color:#D20"><span style="color:#710">&lt;&lt;HTML</span></span><span style="background-color:#fff0f0;color:#D20"><span style=""><tt>
 </tt>&lt;html&gt;<tt>
 </tt>&lt;head&gt;<tt>
-</tt></span><span style="background: #eee"><span style="font-weight: bold; color: #888">#{</span>output.stylesheet <span style="color:#038; font-weight:bold">true</span><span style="font-weight: bold; color: #888">}</span></span><span style="color:#D20"><tt>
+</tt></span><span style="background:#eee;color:black"><span style="font-weight:bold;color:#777">#{</span>output.stylesheet <span style="color:#038;font-weight:bold">true</span><span style="font-weight:bold;color:#777">}</span></span><span style=""><tt>
 </tt>&lt;body&gt;<tt>
-</tt></span><span style="background: #eee"><span style="font-weight: bold; color: #888">#{</span>output<span style="font-weight: bold; color: #888">}</span></span><span style="color:#D20"><tt>
+</tt></span><span style="background:#eee;color:black"><span style="font-weight:bold;color:#777">#{</span>output<span style="font-weight:bold;color:#777">}</span></span><span style=""><tt>
 </tt>&lt;/body&gt;<tt>
 </tt>&lt;/html&gt;</span><span style="color:#710"><tt>
 </tt>HTML</span></span><tt>
diff --git a/sample/html.expected b/sample/html.expected
index 4e4c99a..25616dc 100644
--- a/sample/html.expected
+++ b/sample/html.expected
@@ -9,7 +9,7 @@
   background-color: #f8f8f8;
   border: 1px solid silver;
   font-family: 'Courier New', 'Terminal', monospace;
-  color: #100;
+  color: #000;
 }
 .CodeRay pre { margin: 0px }
 
@@ -26,6 +26,7 @@ table.CodeRay td { padding: 2px 4px; vertical-align: top }
   text-align: right;
 }
 .CodeRay .line_numbers tt { font-weight: bold }
+.CodeRay .line_numbers .highlighted { color: red }
 .CodeRay .no { padding: 0px 4px }
 .CodeRay .code { width: 100% }
 
@@ -38,10 +39,11 @@ ol.CodeRay li { white-space: pre }
 
 .CodeRay .af { color:#00C }
 .CodeRay .an { color:#007 }
+.CodeRay .at { color:#f08 }
 .CodeRay .av { color:#700 }
 .CodeRay .aw { color:#C00 }
 .CodeRay .bi { color:#509; font-weight:bold }
-.CodeRay .c  { color:#666; }
+.CodeRay .c  { color:#888; }
 
 .CodeRay .ch { color:#04D }
 .CodeRay .ch .k { color:#04D }
@@ -55,6 +57,7 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .di { color:#088; font-weight:bold }
 .CodeRay .dl { color:black }
 .CodeRay .do { color:#970 }
+.CodeRay .dt { color:#34b }
 .CodeRay .ds { color:#D42; font-weight:bold }
 .CodeRay .e  { color:#666; font-weight:bold }
 .CodeRay .en { color:#800; font-weight:bold }
@@ -67,11 +70,12 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .i  { color:#00D; font-weight:bold }
 .CodeRay .ic { color:#B44; font-weight:bold }
 
-.CodeRay .il { background: #eee }
+.CodeRay .il { background: #eee; color: black }
 .CodeRay .il .il { background: #ddd }
 .CodeRay .il .il .il { background: #ccc }
-.CodeRay .il .idl { font-weight: bold; color: #888 }
+.CodeRay .il .idl { font-weight: bold; color: #777 }
 
+.CodeRay .im { color:#f00; }
 .CodeRay .in { color:#B2B; font-weight:bold }
 .CodeRay .iv { color:#33B }
 .CodeRay .la { color:#970; font-weight:bold }
@@ -81,9 +85,15 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .op { }
 .CodeRay .pc { color:#038; font-weight:bold }
 .CodeRay .pd { color:#369; font-weight:bold }
-.CodeRay .pp { color:#579 }
-.CodeRay .pt { color:#339; font-weight:bold }
-.CodeRay .r  { color:#080; font-weight:bold }
+.CodeRay .pp { color:#579; }
+.CodeRay .ps { color:#00C; font-weight: bold; }
+.CodeRay .pt { color:#349; font-weight:bold }
+.CodeRay .r, .kw  { color:#080; font-weight:bold }
+
+.CodeRay .ke { color: #808; }
+.CodeRay .ke .dl { color: #606; }
+.CodeRay .ke .ch { color: #80f; }
+.CodeRay .vl { color: #088; }
 
 .CodeRay .rx { background-color:#fff0ff }
 .CodeRay .rx .k { color:#808 }
@@ -91,14 +101,15 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .rx .mod { color:#C2C }
 .CodeRay .rx .fu  { color:#404; font-weight: bold }
 
-.CodeRay .s  { background-color:#fff0f0 }
-.CodeRay .s  .s { background-color:#ffe0e0 }
-.CodeRay .s  .s  .s { background-color:#ffd0d0 }
-.CodeRay .s  .k { color:#D20 }
-.CodeRay .s  .dl { color:#710 }
+.CodeRay .s { background-color:#fff0f0; color: #D20; }
+.CodeRay .s .s { background-color:#ffe0e0 }
+.CodeRay .s .s  .s { background-color:#ffd0d0 }
+.CodeRay .s .k { }
+.CodeRay .s .ch { color: #b0b; }
+.CodeRay .s .dl { color: #710; }
 
-.CodeRay .sh { background-color:#f0fff0 }
-.CodeRay .sh .k { color:#2B2 }
+.CodeRay .sh { background-color:#f0fff0; color:#2B2 }
+.CodeRay .sh .k { }
 .CodeRay .sh .dl { color:#161 }
 
 .CodeRay .sy { color:#A60 }
@@ -112,6 +123,16 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .v  { color:#036 }
 .CodeRay .xt { color:#444 }
 
+.CodeRay .ins { background: #afa; }
+.CodeRay .del { background: #faa; }
+.CodeRay .chg { color: #aaf; background: #007; }
+.CodeRay .head { color: #f8f; background: #505 }
+
+.CodeRay .ins .ins { color: #080; font-weight:bold }
+.CodeRay .del .del { color: #800; font-weight:bold }
+.CodeRay .chg .chg { color: #66f; }
+.CodeRay .head .head { color: #f4f; }
+
   </style>
 </head>
 <body style="background-color: white;">
diff --git a/sample/html.rb b/sample/html.rb
index c854635..c18284a 100644
--- a/sample/html.rb
+++ b/sample/html.rb
@@ -2,9 +2,9 @@ $: << '..'
 require 'coderay'
 
 tokens = CodeRay.scan DATA.read, :ruby
-html = tokens.html(:tab_width => 2, :line_numbers => :table)
+html = tokens.page(:tab_width => 2, :line_numbers => :table, :title => 'CodeRay HTML Encoder Example')
 
-puts html.page
+puts html
 
 __END__
 require 'scanner'
diff --git a/sample/html2.expected b/sample/html2.expected
index e276d3e..829ffbf 100644
--- a/sample/html2.expected
+++ b/sample/html2.expected
@@ -9,7 +9,7 @@
   background-color: #f8f8f8;
   border: 1px solid silver;
   font-family: 'Courier New', 'Terminal', monospace;
-  color: #100;
+  color: #000;
 }
 .CodeRay pre { margin: 0px }
 
@@ -26,6 +26,7 @@ table.CodeRay td { padding: 2px 4px; vertical-align: top }
   text-align: right;
 }
 .CodeRay .line_numbers tt { font-weight: bold }
+.CodeRay .line_numbers .highlighted { color: red }
 .CodeRay .no { padding: 0px 4px }
 .CodeRay .code { width: 100% }
 
@@ -38,10 +39,11 @@ ol.CodeRay li { white-space: pre }
 
 .CodeRay .af { color:#00C }
 .CodeRay .an { color:#007 }
+.CodeRay .at { color:#f08 }
 .CodeRay .av { color:#700 }
 .CodeRay .aw { color:#C00 }
 .CodeRay .bi { color:#509; font-weight:bold }
-.CodeRay .c  { color:#666; }
+.CodeRay .c  { color:#888; }
 
 .CodeRay .ch { color:#04D }
 .CodeRay .ch .k { color:#04D }
@@ -55,6 +57,7 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .di { color:#088; font-weight:bold }
 .CodeRay .dl { color:black }
 .CodeRay .do { color:#970 }
+.CodeRay .dt { color:#34b }
 .CodeRay .ds { color:#D42; font-weight:bold }
 .CodeRay .e  { color:#666; font-weight:bold }
 .CodeRay .en { color:#800; font-weight:bold }
@@ -67,11 +70,12 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .i  { color:#00D; font-weight:bold }
 .CodeRay .ic { color:#B44; font-weight:bold }
 
-.CodeRay .il { background: #eee }
+.CodeRay .il { background: #eee; color: black }
 .CodeRay .il .il { background: #ddd }
 .CodeRay .il .il .il { background: #ccc }
-.CodeRay .il .idl { font-weight: bold; color: #888 }
+.CodeRay .il .idl { font-weight: bold; color: #777 }
 
+.CodeRay .im { color:#f00; }
 .CodeRay .in { color:#B2B; font-weight:bold }
 .CodeRay .iv { color:#33B }
 .CodeRay .la { color:#970; font-weight:bold }
@@ -81,9 +85,15 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .op { }
 .CodeRay .pc { color:#038; font-weight:bold }
 .CodeRay .pd { color:#369; font-weight:bold }
-.CodeRay .pp { color:#579 }
-.CodeRay .pt { color:#339; font-weight:bold }
-.CodeRay .r  { color:#080; font-weight:bold }
+.CodeRay .pp { color:#579; }
+.CodeRay .ps { color:#00C; font-weight: bold; }
+.CodeRay .pt { color:#349; font-weight:bold }
+.CodeRay .r, .kw  { color:#080; font-weight:bold }
+
+.CodeRay .ke { color: #808; }
+.CodeRay .ke .dl { color: #606; }
+.CodeRay .ke .ch { color: #80f; }
+.CodeRay .vl { color: #088; }
 
 .CodeRay .rx { background-color:#fff0ff }
 .CodeRay .rx .k { color:#808 }
@@ -91,14 +101,15 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .rx .mod { color:#C2C }
 .CodeRay .rx .fu  { color:#404; font-weight: bold }
 
-.CodeRay .s  { background-color:#fff0f0 }
-.CodeRay .s  .s { background-color:#ffe0e0 }
-.CodeRay .s  .s  .s { background-color:#ffd0d0 }
-.CodeRay .s  .k { color:#D20 }
-.CodeRay .s  .dl { color:#710 }
+.CodeRay .s { background-color:#fff0f0; color: #D20; }
+.CodeRay .s .s { background-color:#ffe0e0 }
+.CodeRay .s .s  .s { background-color:#ffd0d0 }
+.CodeRay .s .k { }
+.CodeRay .s .ch { color: #b0b; }
+.CodeRay .s .dl { color: #710; }
 
-.CodeRay .sh { background-color:#f0fff0 }
-.CodeRay .sh .k { color:#2B2 }
+.CodeRay .sh { background-color:#f0fff0; color:#2B2 }
+.CodeRay .sh .k { }
 .CodeRay .sh .dl { color:#161 }
 
 .CodeRay .sy { color:#A60 }
@@ -112,6 +123,16 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .v  { color:#036 }
 .CodeRay .xt { color:#444 }
 
+.CodeRay .ins { background: #afa; }
+.CodeRay .del { background: #faa; }
+.CodeRay .chg { color: #aaf; background: #007; }
+.CodeRay .head { color: #f8f; background: #505 }
+
+.CodeRay .ins .ins { color: #080; font-weight:bold }
+.CodeRay .del .del { color: #800; font-weight:bold }
+.CodeRay .chg .chg { color: #66f; }
+.CodeRay .head .head { color: #f4f; }
+
   </style>
 </head>
 <body style="background-color: white;">
@@ -129,31 +150,31 @@ ol.CodeRay li { white-space: pre }
 </tt><strong>10</strong><tt>
 </tt>11<tt>
 </tt></pre></td>
-  <td class="code"><pre ondblclick="with (this.style) { overflow = (overflow == 'auto' || overflow == '') ? 'visible' : 'auto' }">require <span style="background-color:#fff0f0"><span style="color:#710">'</span><span style="color:#D20">coderay</span><span style="color:#710">'</span></span><tt>
+  <td class="code"><pre ondblclick="with (this.style) { overflow = (overflow == 'auto' || overflow == '') ? 'visible' : 'auto' }">require <span style="background-color:#fff0f0;color:#D20"><span style="color:#710">'</span><span style="">coderay</span><span style="color:#710">'</span></span><tt>
 </tt><tt>
-</tt><span style="color:#666;"># scan this file</span><tt>
-</tt>tokens = <span style="color:#036; font-weight:bold">CodeRay</span>.scan(<span style="color:#036; font-weight:bold">File</span>.read(<span style="color:#d70; font-weight:bold">$0</span>) * <span style="color:#00D; font-weight:bold">1</span>, <span style="color:#A60">:ruby</span>)<tt>
+</tt><span style="color:#888"># scan this file</span><tt>
+</tt>tokens = <span style="color:#036;font-weight:bold">CodeRay</span>.scan(<span style="color:#036;font-weight:bold">File</span>.read(<span style="color:#d70;font-weight:bold">$0</span>) * <span style="color:#00D;font-weight:bold">1</span>, <span style="color:#A60">:ruby</span>)<tt>
 </tt><tt>
-</tt><span style="color:#666;"># output it with two styles of line numbers</span><tt>
+</tt><span style="color:#888"># output it with two styles of line numbers</span><tt>
 </tt>out = tokens.div(<span style="color:#A60">:line_numbers</span> =&gt; <span style="color:#A60">:table</span>)<tt>
-</tt>out &lt;&lt; <span style="background-color:#fff0f0"><span style="color:#710">'</span><span style="color:#D20">&lt;hr /&gt;</span><span style="color:#710">'</span></span><tt>
-</tt>out &lt;&lt; tokens.div(<span style="color:#A60">:line_numbers</span> =&gt; <span style="color:#A60">:inline</span>, <span style="color:#A60">:line_number_start</span> =&gt; <span style="color:#00D; font-weight:bold">8</span>)<tt>
+</tt>out &lt;&lt; <span style="background-color:#fff0f0;color:#D20"><span style="color:#710">'</span><span style="">&lt;hr /&gt;</span><span style="color:#710">'</span></span><tt>
+</tt>out &lt;&lt; tokens.div(<span style="color:#A60">:line_numbers</span> =&gt; <span style="color:#A60">:inline</span>, <span style="color:#A60">:line_number_start</span> =&gt; <span style="color:#00D;font-weight:bold">8</span>)<tt>
 </tt><tt>
-</tt>puts out.page<tt>
+</tt>puts out.page(<span style="color:#A60">:title</span> =&gt; <span style="background-color:#fff0f0;color:#D20"><span style="color:#710">'</span><span style="">CodeRay HTML Encoder Example</span><span style="color:#710">'</span></span>)<tt>
 </tt></pre></td>
 </tr></table>
 <hr /><div class="CodeRay">
-  <div class="code"><pre><span class="no"> 8</span> require <span style="background-color:#fff0f0"><span style="color:#710">'</span><span style="color:#D20">coderay</span><span style="color:#710">'</span></span>
+  <div class="code"><pre><span class="no"> 8</span> require <span style="background-color:#fff0f0;color:#D20"><span style="color:#710">'</span><span style="">coderay</span><span style="color:#710">'</span></span>
 <span class="no"> 9</span> 
-<span class="no"><strong>10</strong></span> <span style="color:#666;"># scan this file</span>
-<span class="no">11</span> tokens = <span style="color:#036; font-weight:bold">CodeRay</span>.scan(<span style="color:#036; font-weight:bold">File</span>.read(<span style="color:#d70; font-weight:bold">$0</span>) * <span style="color:#00D; font-weight:bold">1</span>, <span style="color:#A60">:ruby</span>)
+<span class="no"><strong>10</strong></span> <span style="color:#888"># scan this file</span>
+<span class="no">11</span> tokens = <span style="color:#036;font-weight:bold">CodeRay</span>.scan(<span style="color:#036;font-weight:bold">File</span>.read(<span style="color:#d70;font-weight:bold">$0</span>) * <span style="color:#00D;font-weight:bold">1</span>, <span style="color:#A60">:ruby</span>)
 <span class="no">12</span> 
-<span class="no">13</span> <span style="color:#666;"># output it with two styles of line numbers</span>
+<span class="no">13</span> <span style="color:#888"># output it with two styles of line numbers</span>
 <span class="no">14</span> out = tokens.div(<span style="color:#A60">:line_numbers</span> =&gt; <span style="color:#A60">:table</span>)
-<span class="no">15</span> out &lt;&lt; <span style="background-color:#fff0f0"><span style="color:#710">'</span><span style="color:#D20">&lt;hr /&gt;</span><span style="color:#710">'</span></span>
-<span class="no">16</span> out &lt;&lt; tokens.div(<span style="color:#A60">:line_numbers</span> =&gt; <span style="color:#A60">:inline</span>, <span style="color:#A60">:line_number_start</span> =&gt; <span style="color:#00D; font-weight:bold">8</span>)
+<span class="no">15</span> out &lt;&lt; <span style="background-color:#fff0f0;color:#D20"><span style="color:#710">'</span><span style="">&lt;hr /&gt;</span><span style="color:#710">'</span></span>
+<span class="no">16</span> out &lt;&lt; tokens.div(<span style="color:#A60">:line_numbers</span> =&gt; <span style="color:#A60">:inline</span>, <span style="color:#A60">:line_number_start</span> =&gt; <span style="color:#00D;font-weight:bold">8</span>)
 <span class="no">17</span> 
-<span class="no">18</span> puts out.page
+<span class="no">18</span> puts out.page(<span style="color:#A60">:title</span> =&gt; <span style="background-color:#fff0f0;color:#D20"><span style="color:#710">'</span><span style="">CodeRay HTML Encoder Example</span><span style="color:#710">'</span></span>)
 </pre></div>
 </div>
 
diff --git a/sample/html2.rb b/sample/html2.rb
index 7ce9d60..618d168 100644
--- a/sample/html2.rb
+++ b/sample/html2.rb
@@ -8,4 +8,4 @@ out = tokens.div(:line_numbers => :table)
 out << '<hr />'
 out << tokens.div(:line_numbers => :inline, :line_number_start => 8)
 
-puts out.page
+puts out.page(:title => 'CodeRay HTML Encoder Example')
diff --git a/sample/html_list.expected b/sample/html_list.expected
index 9065842..5351672 100644
--- a/sample/html_list.expected
+++ b/sample/html_list.expected
@@ -9,7 +9,7 @@
   background-color: #f8f8f8;
   border: 1px solid silver;
   font-family: 'Courier New', 'Terminal', monospace;
-  color: #100;
+  color: #000;
 }
 .CodeRay pre { margin: 0px }
 
@@ -26,6 +26,7 @@ table.CodeRay td { padding: 2px 4px; vertical-align: top }
   text-align: right;
 }
 .CodeRay .line_numbers tt { font-weight: bold }
+.CodeRay .line_numbers .highlighted { color: red }
 .CodeRay .no { padding: 0px 4px }
 .CodeRay .code { width: 100% }
 
@@ -38,10 +39,11 @@ ol.CodeRay li { white-space: pre }
 
 .CodeRay .af { color:#00C }
 .CodeRay .an { color:#007 }
+.CodeRay .at { color:#f08 }
 .CodeRay .av { color:#700 }
 .CodeRay .aw { color:#C00 }
 .CodeRay .bi { color:#509; font-weight:bold }
-.CodeRay .c  { color:#666; }
+.CodeRay .c  { color:#888; }
 
 .CodeRay .ch { color:#04D }
 .CodeRay .ch .k { color:#04D }
@@ -55,6 +57,7 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .di { color:#088; font-weight:bold }
 .CodeRay .dl { color:black }
 .CodeRay .do { color:#970 }
+.CodeRay .dt { color:#34b }
 .CodeRay .ds { color:#D42; font-weight:bold }
 .CodeRay .e  { color:#666; font-weight:bold }
 .CodeRay .en { color:#800; font-weight:bold }
@@ -67,11 +70,12 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .i  { color:#00D; font-weight:bold }
 .CodeRay .ic { color:#B44; font-weight:bold }
 
-.CodeRay .il { background: #eee }
+.CodeRay .il { background: #eee; color: black }
 .CodeRay .il .il { background: #ddd }
 .CodeRay .il .il .il { background: #ccc }
-.CodeRay .il .idl { font-weight: bold; color: #888 }
+.CodeRay .il .idl { font-weight: bold; color: #777 }
 
+.CodeRay .im { color:#f00; }
 .CodeRay .in { color:#B2B; font-weight:bold }
 .CodeRay .iv { color:#33B }
 .CodeRay .la { color:#970; font-weight:bold }
@@ -81,9 +85,15 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .op { }
 .CodeRay .pc { color:#038; font-weight:bold }
 .CodeRay .pd { color:#369; font-weight:bold }
-.CodeRay .pp { color:#579 }
-.CodeRay .pt { color:#339; font-weight:bold }
-.CodeRay .r  { color:#080; font-weight:bold }
+.CodeRay .pp { color:#579; }
+.CodeRay .ps { color:#00C; font-weight: bold; }
+.CodeRay .pt { color:#349; font-weight:bold }
+.CodeRay .r, .kw  { color:#080; font-weight:bold }
+
+.CodeRay .ke { color: #808; }
+.CodeRay .ke .dl { color: #606; }
+.CodeRay .ke .ch { color: #80f; }
+.CodeRay .vl { color: #088; }
 
 .CodeRay .rx { background-color:#fff0ff }
 .CodeRay .rx .k { color:#808 }
@@ -91,14 +101,15 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .rx .mod { color:#C2C }
 .CodeRay .rx .fu  { color:#404; font-weight: bold }
 
-.CodeRay .s  { background-color:#fff0f0 }
-.CodeRay .s  .s { background-color:#ffe0e0 }
-.CodeRay .s  .s  .s { background-color:#ffd0d0 }
-.CodeRay .s  .k { color:#D20 }
-.CodeRay .s  .dl { color:#710 }
+.CodeRay .s { background-color:#fff0f0; color: #D20; }
+.CodeRay .s .s { background-color:#ffe0e0 }
+.CodeRay .s .s  .s { background-color:#ffd0d0 }
+.CodeRay .s .k { }
+.CodeRay .s .ch { color: #b0b; }
+.CodeRay .s .dl { color: #710; }
 
-.CodeRay .sh { background-color:#f0fff0 }
-.CodeRay .sh .k { color:#2B2 }
+.CodeRay .sh { background-color:#f0fff0; color:#2B2 }
+.CodeRay .sh .k { }
 .CodeRay .sh .dl { color:#161 }
 
 .CodeRay .sy { color:#A60 }
@@ -112,6 +123,16 @@ ol.CodeRay li { white-space: pre }
 .CodeRay .v  { color:#036 }
 .CodeRay .xt { color:#444 }
 
+.CodeRay .ins { background: #afa; }
+.CodeRay .del { background: #faa; }
+.CodeRay .chg { color: #aaf; background: #007; }
+.CodeRay .head { color: #f8f; background: #505 }
+
+.CodeRay .ins .ins { color: #080; font-weight:bold }
+.CodeRay .del .del { color: #800; font-weight:bold }
+.CodeRay .chg .chg { color: #66f; }
+.CodeRay .head .head { color: #f4f; }
+
   </style>
 </head>
 <body style="background-color: white;">
@@ -123,7 +144,7 @@ ol.CodeRay li { white-space: pre }
 <span class="no"> 2</span> tokens = <span class="co">CodeRay</span>.scan <span class="co">File</span>.read(<span class="pc">__FILE__</span>), <span class="sy">:ruby</span>
 <span class="no"> 3</span> html = tokens.html(<span class="sy">:tab_width</span> =&gt; <span class="i">2</span>, <span class="sy">:line_numbers</span> =&gt; <span class="sy">:inline</span>, <span class="sy">:line_number_start</span> =&gt; <span class="i">-1</span>)
 <span class="no"> 4</span> 
-<span class="no"> 5</span> puts html.page
+<span class="no"> 5</span> puts html.page(<span class="sy">:title</span> =&gt; <span class="s"><span class="dl">'</span><span class="k">CodeRay HTML Encoder Example</span><span class="dl">'</span></span>)
 <span class="no"> 6</span> 
 <span class="no"> 7</span> commment = <span class="s"><span class="dl">&lt;&lt;_</span></span><span class="s"><span class="k">
 <span class="no"> 8</span> This code must be &gt; 10 lines
diff --git a/sample/html_list.rb b/sample/html_list.rb
index 97724f2..fdfa512 100644
--- a/sample/html_list.rb
+++ b/sample/html_list.rb
@@ -4,7 +4,7 @@ require 'coderay'
 tokens = CodeRay.scan File.read(__FILE__), :ruby

 html = tokens.html(:tab_width => 2, :line_numbers => :inline, :line_number_start => -1)

 

-puts html.page

+puts html.page(:title => 'CodeRay HTML Encoder Example')

 

 commment = <<_

 This code must be > 10 lines

diff --git a/sample/more.expected b/sample/more.expected
index 72632d3..61fabe6 100644
--- a/sample/more.expected
+++ b/sample/more.expected
@@ -1,2 +1,2 @@
-Input: 4983B, Output: 22625B
+Input: 4983B, Output: 23316B
 Take a look with your browser.
diff --git a/sample/simple.expected b/sample/simple.expected
index 7e9206a..b3d7875 100644
--- a/sample/simple.expected
+++ b/sample/simple.expected
@@ -1 +1 @@
-<span class="CodeRay">puts <span style="background-color:#fff0f0"><span style="color:#710">'</span><span style="color:#D20">Hello, world!</span><span style="color:#710">'</span></span></span>
+<span class="CodeRay">puts <span style="background-color:#fff0f0;color:#D20"><span style="color:#710">'</span><span style="">Hello, world!</span><span style="color:#710">'</span></span></span>