(chiliproject#169) - Wrap code block in a table instead of a span.

    This allows the selecting of code without line numbers as well
    as toggling line numbers.

Two things to note:
  - This translates the <code> tag into a <div> tag since the code
    tag didn't seem to like having a <table> inside it.
  - This removes padding from the <pre> tag; there was some
    extra spacing that just didn't look right.

lib/redmine/syntax_highlighting.rb

@@ -46,7 +46,7 @@ def highlight_by_filename(text, filename)
         # Highlights +text+ using +language+ syntax
         # Should not return outer pre tag
         def highlight_by_language(text, language)
-          ::CodeRay.scan(text, language).html(:line_numbers => :inline, :wrap => :span)
+          ::CodeRay.scan(text, language).html(:line_numbers => :table, :wrap => :div)
         end
       end
     end

lib/redmine/wiki_formatting/textile/formatter.rb

@@ -53,7 +53,7 @@ def smooth_offtags( text )
             text.gsub!(/<redpre#(\d+)>/) do
               content = @pre_list[$1.to_i]
               if content.match(/<code\s+class="(\w+)">\s?(.+)/m)
-                content = "<code class=\"#{$1} syntaxhl\">" + 
+                content = "<div class=\"#{$1} syntaxhl\">" +
                   Redmine::SyntaxHighlighting.highlight_by_language($2, $1)
               end
               content

public/stylesheets/application.css

@@ -697,7 +697,6 @@ div.wiki a.new {
 
 div.wiki pre {
     margin: 1em 1em 1em 1.6em;
-    padding: 2px 2px 2px 0;
     background-color: #fafafa;
     border: 1px solid #dadada;
     width:auto;

public/stylesheets/scm.css

@@ -90,9 +90,44 @@ div.action_D { background: #f88 }
 div.action_A { background: #bfb }
 
 /************* CodeRay styles *************/
-.syntaxhl div {display: inline;}
-.syntaxhl .no { padding: 2px 4px 2px 4px; background-color: #eee; margin:0 }
-.syntaxhl .code pre { overflow: auto }
+
+div.syntaxhl {
+  display: inline;
+  background-color: #f8f8f8;
+}
+
+div.syntaxhl pre {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  background: transparent;
+}
+
+div.syntaxhl table {
+  padding: 0;
+  margin: 0;
+  border: 0;
+  float: left;
+}
+
+.syntaxhl table td {
+  border: 0;
+  vertical-align: top;
+}
+
+.syntaxhl .line_numbers {
+  background-color: #ddeeff;
+  color: gray;
+  text-align: right;
+}
+
+.syntaxhl .line_numbers tt { font-weight: bold; }
+.syntaxhl .code { width: 100%; }
+.syntaxhl .code pre {
+  overflow: auto;
+  border: 0;
+}
+
 .syntaxhl .debug { color:white ! important; background:blue ! important; }
 
 .syntaxhl .af { color:#00C }