Hi there,
I’m trying to style a CodeRay code table (:coderay_line_numbers set to :table) in such a way that overflowing code is scrolled, i.e. I want to add
to the element containing the code table. As can bee seen at https://github.com/gettalong/kramdown/blob/master/lib/kramdown/converter/html.rb#L109 this is sadly a hardcoded <div> element without any class or other identifier set, making it unreachable for CSS (unless you put an HTML attribute list after each and every single codeblock you write to include a class). Applying overflow-x: scroll to the table itself doesn’t work, because it’s the table that overflows itself, requiring me to set this on the parent element, which is unreachable without changing kramdown’s code. Here’s an example of the generated HTML (the nonsense code is just to make it overflow):
<div><table class="CodeRay"><tr>
<td class="line-numbers"><pre><a href="#n1" name="n1">1</a>
<a href="#n2" name="n2">2</a>
<a href="#n3" name="n3">3</a>
<a href="#n4" name="n4">4</a>
<a href="#n5" name="n5">5</a>
</pre></td>
<td class="code"><pre><span class="comment"># foo.rb</span>
<span class="keyword">def</span> <span class="function">foo</span>
puts <span class="string"><span class="delimiter">"</span><span class="content">Hi</span><span class="delimiter">"</span></span>
jkdhg dkjghd kjhdfg kjhdfg dkjfghdgh dfhgdkghdg dkjdjg(gdg) jsdhfs ksjdfhsjfs kjjjj skdjf
<span class="keyword">end</span>
</pre></td>
</tr></table>
</div>
A workaround is setting :coderay_line_numbers to :inline, but this in turn makes simple select-n-copy by mouse impossible (because the line numbers are now copied, too). Disabling line numbers altogether is not an option for me, as I sometimes have quite long code listings.
Suggestion: Add a new option coderay_div_class or something like that that allows to globally apply a class to the <div> sorrounding a coderay table.
Valete,
Quintus
Hi there,
I’m trying to style a CodeRay code table (
:coderay_line_numbersset to:table) in such a way that overflowing code is scrolled, i.e. I want to addto the element containing the code table. As can bee seen at https://github.com/gettalong/kramdown/blob/master/lib/kramdown/converter/html.rb#L109 this is sadly a hardcoded
<div>element without any class or other identifier set, making it unreachable for CSS (unless you put an HTML attribute list after each and every single codeblock you write to include a class). Applyingoverflow-x: scrollto the table itself doesn’t work, because it’s the table that overflows itself, requiring me to set this on the parent element, which is unreachable without changing kramdown’s code. Here’s an example of the generated HTML (the nonsense code is just to make it overflow):A workaround is setting
:coderay_line_numbersto:inline, but this in turn makes simple select-n-copy by mouse impossible (because the line numbers are now copied, too). Disabling line numbers altogether is not an option for me, as I sometimes have quite long code listings.Suggestion: Add a new option
coderay_div_classor something like that that allows to globally apply a class to the<div>sorrounding a coderay table.Valete,
Quintus