https://www.redmine.org/https://www.redmine.org/favicon.ico?16793021292011-01-12T08:43:38ZRedmineRedmine - Defect #4544: Wiki exported HTML has different CSS formatting to the originalhttps://www.redmine.org/issues/4544?journal_id=239482011-01-12T08:43:38ZAlex Petrof
<ul><li><strong>Assignee</strong> set to <i>Jean-Philippe Lang</i></li></ul><p>Hello,</p>
<p>is there in the meantime any solution for this issue?</p>
<p>Thanks!<br />Best Regards<br />Alex Petrof</p> Redmine - Defect #4544: Wiki exported HTML has different CSS formatting to the originalhttps://www.redmine.org/issues/4544?journal_id=253032011-02-18T12:39:25ZAlex Petrof
<ul><li><strong>Assignee</strong> changed from <i>Jean-Philippe Lang</i> to <i>Azamat Hackimov</i></li></ul><p>Please, hasn't anyone something to say about this case. It's quite a big problem and we are running out of options!</p> Redmine - Defect #4544: Wiki exported HTML has different CSS formatting to the originalhttps://www.redmine.org/issues/4544?journal_id=253062011-02-18T13:20:57ZEtienne Massip
<ul></ul><p>Exported HTML is not supposed to be the same as the original.</p>
<p>If you need the original format, simply use "Save as..." ?</p> Redmine - Defect #4544: Wiki exported HTML has different CSS formatting to the originalhttps://www.redmine.org/issues/4544?journal_id=253172011-02-18T14:27:19ZAlex Petrof
<ul></ul><p>Yes it would be the prefect idea, if I didn't have to write some kind of parser which strips out all frames and stuff I don't actually need just in order to get to the plain wiki page, which is actually exactly what the html-exporter function does. Of course without the formatting, table borders etc. Isn't there some kind of option which I could hardcode in some ruby file in order to "fix" this? I tried some stuff in redmine/app/controllers/wiki_controller.rb but neither seemed to work. The problem is I am not into ruby. For now...</p>
<p>And anyway what's the point of having a nice table in your wiki, which when exported ends up without a single border, only words and values floating on the white sheet? Excuse me but I fail to see the point. If I needed that, I'd use the text export function anyway!</p>
<p>Any help would be appreciated!</p> Redmine - Defect #4544: Wiki exported HTML has different CSS formatting to the originalhttps://www.redmine.org/issues/4544?journal_id=254082011-02-21T13:05:49ZAlex Petrof
<ul></ul><p>I find it really lovely, that the so called community is so "eager" to help. <br />So the amateur as I am, I found some kind of solution myself, thanks to the helpful note of Herve Morillon (which was also left unanswered almost 3 years ago) here:<br /><a class="external" href="http://www.redmine.org/boards/2/topics/389">http://www.redmine.org/boards/2/topics/389</a></p>
<p>I will describe it here, in case somebody else stumbles upon that problem.</p>
<p>So you have to copy the parts regarding the Wiki from the <code>/redmine/public/stylesheets/application.css</code> in to <code>/redmine/app/views/wiki/export.rhtml</code> while removing the "div.wiki" clause from every statement. The part to copy (in the <style> clause) is the following:</p>
<pre><code class="css syntaxhl"><span class="nt">table</span> <span class="p">{</span>
<span class="nl">border</span><span class="p">:</span> <span class="m">1px</span> <span class="nb">solid</span> <span class="m">#505050</span><span class="p">;</span>
<span class="nl">border-collapse</span><span class="p">:</span> <span class="nb">collapse</span><span class="p">;</span>
<span class="nl">margin-bottom</span><span class="p">:</span> <span class="m">1em</span><span class="p">;</span>
<span class="p">}</span>
<span class="nt">table</span><span class="o">,</span> <span class="nt">td</span><span class="o">,</span> <span class="nt">th</span> <span class="p">{</span>
<span class="nl">border</span><span class="p">:</span> <span class="m">1px</span> <span class="nb">solid</span> <span class="m">#bbb</span><span class="p">;</span>
<span class="nl">padding</span><span class="p">:</span> <span class="m">4px</span><span class="p">;</span>
<span class="p">}</span>
<span class="nc">.external</span> <span class="p">{</span>
<span class="nl">background-position</span><span class="p">:</span> <span class="m">0%</span> <span class="m">60%</span><span class="p">;</span>
<span class="nl">background-repeat</span><span class="p">:</span> <span class="nb">no-repeat</span><span class="p">;</span>
<span class="nl">padding-left</span><span class="p">:</span> <span class="m">12px</span><span class="p">;</span>
<span class="nl">background-image</span><span class="p">:</span> <span class="sx">url(../images/external.png)</span><span class="p">;</span>
<span class="p">}</span>
<span class="nt">a</span><span class="nc">.new</span> <span class="p">{</span>
<span class="nl">color</span><span class="p">:</span> <span class="m">#0C00AE</span><span class="p">;</span>
<span class="p">}</span>
<span class="nt">pre</span> <span class="p">{</span>
<span class="nl">margin</span><span class="p">:</span> <span class="m">1em</span> <span class="m">1em</span> <span class="m">1em</span> <span class="m">1.6em</span><span class="p">;</span>
<span class="nl">padding</span><span class="p">:</span> <span class="m">2px</span> <span class="m">2px</span> <span class="m">2px</span> <span class="m">0</span><span class="p">;</span>
<span class="nl">background-color</span><span class="p">:</span> <span class="m">#fafafa</span><span class="p">;</span>
<span class="nl">border</span><span class="p">:</span> <span class="m">1px</span> <span class="nb">solid</span> <span class="m">#dadada</span><span class="p">;</span>
<span class="nl">width</span><span class="p">:</span><span class="nb">auto</span><span class="p">;</span>
<span class="nl">overflow-x</span><span class="p">:</span> <span class="nb">auto</span><span class="p">;</span>
<span class="nl">overflow-y</span><span class="p">:</span> <span class="nb">hidden</span><span class="p">;</span>
<span class="p">}</span>
<span class="nt">ul</span><span class="nc">.toc</span> <span class="p">{</span>
<span class="nl">background-color</span><span class="p">:</span> <span class="m">#ffffdd</span><span class="p">;</span>
<span class="nl">border</span><span class="p">:</span> <span class="m">1px</span> <span class="nb">solid</span> <span class="m">#e4e4e4</span><span class="p">;</span>
<span class="nl">padding</span><span class="p">:</span> <span class="m">4px</span><span class="p">;</span>
<span class="nl">line-height</span><span class="p">:</span> <span class="m">1.2em</span><span class="p">;</span>
<span class="nl">margin-bottom</span><span class="p">:</span> <span class="m">12px</span><span class="p">;</span>
<span class="nl">margin-right</span><span class="p">:</span> <span class="m">12px</span><span class="p">;</span>
<span class="nl">margin-left</span><span class="p">:</span> <span class="m">0</span><span class="p">;</span>
<span class="nl">display</span><span class="p">:</span> <span class="n">table</span>
<span class="p">}</span>
<span class="o">*</span> <span class="nt">html</span> <span class="nt">ul</span><span class="nc">.toc</span> <span class="p">{</span> <span class="nl">width</span><span class="p">:</span> <span class="m">50%</span><span class="p">;</span> <span class="p">}</span> <span class="c">/* IE6 doesn't autosize div */</span>
<span class="nt">ul</span><span class="nc">.toc.right</span> <span class="p">{</span> <span class="nl">float</span><span class="p">:</span> <span class="nb">right</span><span class="p">;</span> <span class="nl">margin-left</span><span class="p">:</span> <span class="m">12px</span><span class="p">;</span> <span class="nl">margin-right</span><span class="p">:</span> <span class="m">0</span><span class="p">;</span> <span class="nl">width</span><span class="p">:</span> <span class="nb">auto</span><span class="p">;</span> <span class="p">}</span>
<span class="nt">ul</span><span class="nc">.toc.left</span> <span class="p">{</span> <span class="nl">float</span><span class="p">:</span> <span class="nb">left</span><span class="p">;</span> <span class="nl">margin-right</span><span class="p">:</span> <span class="m">12px</span><span class="p">;</span> <span class="nl">margin-left</span><span class="p">:</span> <span class="m">0</span><span class="p">;</span> <span class="nl">width</span><span class="p">:</span> <span class="nb">auto</span><span class="p">;</span> <span class="p">}</span>
<span class="nt">ul</span><span class="nc">.toc</span> <span class="nt">li</span> <span class="p">{</span> <span class="nl">list-style-type</span><span class="p">:</span><span class="nb">none</span><span class="p">;}</span>
<span class="nt">ul</span><span class="nc">.toc</span> <span class="nt">li</span><span class="nc">.heading2</span> <span class="p">{</span> <span class="nl">margin-left</span><span class="p">:</span> <span class="m">6px</span><span class="p">;</span> <span class="p">}</span>
<span class="nt">ul</span><span class="nc">.toc</span> <span class="nt">li</span><span class="nc">.heading3</span> <span class="p">{</span> <span class="nl">margin-left</span><span class="p">:</span> <span class="m">12px</span><span class="p">;</span> <span class="nl">font-size</span><span class="p">:</span> <span class="m">0.8em</span><span class="p">;</span> <span class="p">}</span>
<span class="nt">ul</span><span class="nc">.toc</span> <span class="nt">a</span> <span class="p">{</span>
<span class="nl">font-size</span><span class="p">:</span> <span class="m">0.9em</span><span class="p">;</span>
<span class="nl">font-weight</span><span class="p">:</span> <span class="nb">normal</span><span class="p">;</span>
<span class="nl">text-decoration</span><span class="p">:</span> <span class="nb">none</span><span class="p">;</span>
<span class="nl">color</span><span class="p">:</span> <span class="m">#606060</span><span class="p">;</span>
<span class="p">}</span>
<span class="nt">ul</span><span class="nc">.toc</span> <span class="nt">a</span><span class="nd">:hover</span> <span class="p">{</span> <span class="nl">color</span><span class="p">:</span> <span class="m">#c61a1a</span><span class="p">;</span> <span class="nl">text-decoration</span><span class="p">:</span> <span class="nb">underline</span><span class="p">;}</span>
<span class="nt">a</span><span class="nc">.wiki-anchor</span> <span class="p">{</span> <span class="nl">display</span><span class="p">:</span> <span class="nb">none</span><span class="p">;</span> <span class="nl">margin-left</span><span class="p">:</span> <span class="m">6px</span><span class="p">;</span> <span class="nl">text-decoration</span><span class="p">:</span> <span class="nb">none</span><span class="p">;</span> <span class="p">}</span>
<span class="nt">a</span><span class="nc">.wiki-anchor</span><span class="nd">:hover</span> <span class="p">{</span> <span class="nl">color</span><span class="p">:</span> <span class="m">#aaa</span> <span class="cp">!important</span><span class="p">;</span> <span class="nl">text-decoration</span><span class="p">:</span> <span class="nb">none</span><span class="p">;</span> <span class="p">}</span>
<span class="nt">h1</span><span class="nd">:hover</span> <span class="nt">a</span><span class="nc">.wiki-anchor</span><span class="o">,</span> <span class="nt">h2</span><span class="nd">:hover</span> <span class="nt">a</span><span class="nc">.wiki-anchor</span><span class="o">,</span> <span class="nt">h3</span><span class="nd">:hover</span> <span class="nt">a</span><span class="nc">.wiki-anchor</span> <span class="p">{</span> <span class="nl">display</span><span class="p">:</span> <span class="nb">inline</span><span class="p">;</span> <span class="nl">color</span><span class="p">:</span> <span class="m">#ddd</span><span class="p">;</span> <span class="p">}</span>
<span class="nt">img</span> <span class="p">{</span> <span class="nl">vertical-align</span><span class="p">:</span> <span class="nb">middle</span><span class="p">;</span> <span class="p">}</span>
</code></pre>
<p>This approach brings the html formatting back to the exported html files, so they look similar to the original one in the wiki. This includes table having borders, table of contents, code snippets (although I could not get the highlighting to work), inline images etc.</p>
<p>At the end you have to restart redmine (i.e. <code>ctlscript.sh restart</code>)</p> Redmine - Defect #4544: Wiki exported HTML has different CSS formatting to the originalhttps://www.redmine.org/issues/4544?journal_id=254092011-02-21T13:11:33ZAzamat Hackimov
<ul><li><strong>Assignee</strong> deleted (<del><i>Azamat Hackimov</i></del>)</li></ul> Redmine - Defect #4544: Wiki exported HTML has different CSS formatting to the originalhttps://www.redmine.org/issues/4544?journal_id=254152011-02-21T13:40:02ZEtienne Massip
<ul></ul><p>Syntax highlighting would require that you copy the scm.css file contents.</p>
<p>I guess there could be some improvements to the HTML export feature, especially with tables, thanks for sharing your changes.</p>
<p>And please don't spit on the "community", we're just trying to help as much as we can for free, and we don't have a lot of time to share (we work too).</p> Redmine - Defect #4544: Wiki exported HTML has different CSS formatting to the originalhttps://www.redmine.org/issues/4544?journal_id=254182011-02-21T14:14:05ZAlex Petrof
<ul></ul><p style="text-align:center;"><cite>Syntax highlighting would require that you copy the scm.css file contents.</cite></p>
<p>Thank you very much for the contribution to my solution. But that's exactly my point. A single liner from someone with the experience would have saved me at least 2 hours of googling and frustrated trial and errors experimenting with some ruby code I don't have a clue of.</p> Redmine - Defect #4544: Wiki exported HTML has different CSS formatting to the originalhttps://www.redmine.org/issues/4544?journal_id=337552011-11-15T07:52:56ZYuriy Vidineev
<ul></ul><p>I also have issue with table border in HTML export. It is possible to enable Alex Petrof solution in Redmine out of box?</p> Redmine - Defect #4544: Wiki exported HTML has different CSS formatting to the originalhttps://www.redmine.org/issues/4544?journal_id=700662016-03-31T10:03:57ZTorsten Martinsen
<ul></ul><p>The solution in <a class="issue tracker-1 status-1 priority-4 priority-default" title="Defect: Wiki exported HTML has different CSS formatting to the original (New)" href="https://www.redmine.org/issues/4544#note-5">#4544-5</a> works even better if you add<br /><pre><code class="css syntaxhl"><span class="nt">body</span> <span class="p">{</span> <span class="nl">font</span><span class="p">:</span><span class="m">80%</span> <span class="n">Verdana</span><span class="p">,</span><span class="n">Tahoma</span><span class="p">,</span><span class="n">Arial</span><span class="p">,</span><span class="nb">sans-serif</span><span class="p">;</span> <span class="p">}</span>
</code></pre></p>