use the correct asset paths for the wiki syntax help page + some indentation

app/views/help/wiki_syntax.html.erb

@@ -13,46 +13,166 @@
 <h1>Wiki Syntax Quick Reference</h1>
 
 <table width="100%">
-<tr><th colspan="3">Font Styles</th></tr>
-<tr><th><img src="../images/jstoolbar/bt_strong.png" style="border: 1px solid #bbb;" alt="Strong" /></th><td width="50%">*Strong*</td><td width="50%"><strong>Strong</strong></td></tr>
-<tr><th><img src="../images/jstoolbar/bt_em.png" style="border: 1px solid #bbb;" alt="Italic" /></th><td>_Italic_</td><td><em>Italic</em></td></tr>
-<tr><th><img src="../images/jstoolbar/bt_ins.png" style="border: 1px solid #bbb;" alt="Underline" /></th><td>+Underline+</td><td><ins>Underline</ins></td></tr>
-<tr><th><img src="../images/jstoolbar/bt_del.png" style="border: 1px solid #bbb;" alt="Deleted" /></th><td>-Deleted-</td><td><del>Deleted</del></td></tr>
-<tr><th></th><td>??Quote??</td><td><cite>Quote</cite></td></tr>
-<tr><th><img src="../images/jstoolbar/bt_code.png" style="border: 1px solid #bbb;" alt="Inline Code" /></th><td>@Inline Code@</td><td><code>Inline Code</code></td></tr>
-<tr><th><img src="../images/jstoolbar/bt_pre.png" style="border: 1px solid #bbb;" alt="Preformatted text" /></th><td>&lt;pre><br />&nbsp;lines<br />&nbsp;of code<br />&lt;/pre></td><td>
+  <tr>
+    <th colspan="3">Font Styles</th>
+  </tr>
+  <tr>
+    <th><%= image_tag 'jstoolbar/bt_strong.png', :style => 'border: 1px solid #bbb', :alt => 'Strong' %></th>
+    <td width="50%">*Strong*</td>
+    <td width="50%"><strong>Strong</strong></td>
+  </tr>
+  <tr>
+    <th><%= image_tag 'jstoolbar/bt_em.png', :style => 'border: 1px solid #bbb', :alt => 'Italic' %></th>
+    <td>_Italic_</td>
+    <td><em>Italic</em></td>
+  </tr>
+  <tr>
+    <th><%= image_tag 'jstoolbar/bt_ins.png', :style => 'border: 1px solid #bbb', :alt => 'Underline' %></th>
+    <td>+Underline+</td>
+    <td><ins>Underline</ins></td>
+  </tr>
+  <tr>
+    <th><%= image_tag 'jstoolbar/bt_del.png', :style => 'border: 1px solid #bbb', :alt => 'Deleted' %></th>
+    <td>-Deleted-</td>
+    <td><del>Deleted</del></td>
+  </tr>
+  <tr>
+    <th></th>
+    <td>??Quote??</td>
+    <td><cite>Quote</cite></td>
+  </tr>
+  <tr>
+    <th><%= image_tag 'jstoolbar/bt_code.png', :style => 'border: 1px solid #bbb', :alt => 'Inline Code' %></th>
+    <td>@Inline Code@</td>
+    <td><code>Inline Code</code></td>
+  </tr>
+  <tr>
+    <th><%= image_tag 'jstoolbar/bt_pre.png', :style => 'border: 1px solid #bbb', :alt => 'Preformatted text' %></th>
+    <td>&lt;pre><br />&nbsp;lines<br />&nbsp;of code<br />&lt;/pre></td>
+    <td>
 <pre>
  lines
  of code
 </pre>
-</td></tr>
-
-<tr><th colspan="3">Lists</th></tr>
-<tr><th><img src="../images/jstoolbar/bt_ul.png" style="border: 1px solid #bbb;" alt="Unordered list" /></th><td>* Item 1<br />* Item 2</td><td><ul><li>Item 1</li><li>Item 2</li></ul></td></tr>
-<tr><th><img src="../images/jstoolbar/bt_ol.png" style="border: 1px solid #bbb;" alt="Ordered list" /></th><td># Item 1<br /># Item 2</td><td><ol><li>Item 1</li><li>Item 2</li></ol></td></tr>
-
-<tr><th colspan="3">Headings</th></tr>
-<tr><th><img src="../images/jstoolbar/bt_h1.png" style="border: 1px solid #bbb;" alt="Heading 1" /></th><td>h1. Title 1</td><td><h1>Title 1</h1></td></tr>
-<tr><th><img src="../images/jstoolbar/bt_h2.png" style="border: 1px solid #bbb;" alt="Heading 2" /></th><td>h2. Title 2</td><td><h2>Title 2</h2></td></tr>
-<tr><th><img src="../images/jstoolbar/bt_h3.png" style="border: 1px solid #bbb;" alt="Heading 3" /></th><td>h3. Title 3</td><td><h3>Title 3</h3></td></tr>
-
-<tr><th colspan="3">Links</th></tr>
-<tr><th></th><td>http://foo.bar</td><td><a href="#">http://foo.bar</a></td></tr>
-<tr><th></th><td>"Foo":http://foo.bar</td><td><a href="#">Foo</a></td></tr>
-
-<tr><th colspan="3">OpenProject links</th></tr>
-<tr><th><img src="../images/jstoolbar/bt_link.png" style="border: 1px solid #bbb;" alt="Link to a Wiki page" /></th><td>[[Wiki page]]</td><td><a href="#">Wiki page</a></td></tr>
-<tr><th><img src="../images/jstoolbar/bt_link.png" style="border: 1px solid #bbb;" alt="Link to a Wiki page" /></th><td>[[Sandbox:Wiki page]]</td><td><a href="#">Wiki page</a> (On the Sandbox project)</td></tr>
-<tr><th></th><td>Issue #12</td><td>Issue <a href="#">#12</a></td></tr>
-<tr><th></th><td>##12</td><td>Link with additional information</td></tr>
-<tr><th></th><td>###12</td><td>Link with additional information + description</td></tr>
-<tr><th></th><td>Revision r43</td><td>Revision <a href="#">r43</a></td></tr>
-<tr><th></th><td>commit:f30e13e43</td><td><a href="#">f30e13e4</a></td></tr>
-<tr><th></th><td>source:some/file</td><td><a href="#">source:some/file</a></td></tr>
-
-<tr><th colspan="3">Inline images</th></tr>
-<tr><th><img src="../images/jstoolbar/bt_img.png" style="border: 1px solid #bbb;" alt="Image" /></th><td>!<em>image_url</em>!</td><td></td></tr>
-<tr><th></th><td>!<em>attached_image</em>!</td><td></td></tr>
+    </td>
+  </tr>
+
+  <tr>
+    <th colspan="3">Lists</th>
+  </tr>
+  <tr>
+    <th><%= image_tag 'jstoolbar/bt_ul.png', :style => 'border: 1px solid #bbb', :alt => 'Unordered list' %></th>
+    <td>* Item 1<br />* Item 2</td>
+    <td>
+      <ul>
+        <li>Item 1</li>
+        <li>Item 2</li>
+      </ul>
+    </td>
+  </tr>
+  <tr>
+    <th><%= image_tag 'jstoolbar/bt_ol.png', :style => 'border: 1px solid #bbb', :alt => 'Ordered list' %></th>
+    <td># Item 1<br /># Item 2</td>
+    <td>
+      <ol>
+        <li>Item 1</li>
+        <li>Item 2</li>
+      </ol>
+    </td>
+  </tr>
+
+  <tr>
+    <th colspan="3">Headings</th>
+  </tr>
+  <tr>
+    <th><%= image_tag 'jstoolbar/bt_h1.png', :style => 'border: 1px solid #bbb', :alt => 'Heading 1' %></th>
+    <td>h1. Title 1</td>
+    <td><h1>Title 1</h1></td>
+  </tr>
+  <tr>
+    <th><%= image_tag 'jstoolbar/bt_h2.png', :style => 'border: 1px solid #bbb', :alt => 'Heading 2' %></th>
+    <td>h2. Title 2</td>
+    <td><h2>Title 2</h2></td>
+  </tr>
+  <tr>
+    <th><%= image_tag 'jstoolbar/bt_h3.png', :style => 'border: 1px solid #bbb', :alt => 'Heading 3' %></th>
+    <td>h3. Title 3</td>
+    <td><h3>Title 3</h3></td>
+  </tr>
+
+  <tr>
+    <th colspan="3">Links</th>
+  </tr>
+  <tr>
+    <th></th>
+    <td>http://foo.bar</td>
+    <td><a href="#">http://foo.bar</a></td>
+  </tr>
+  <tr>
+    <th></th>
+    <td>"Foo":http://foo.bar</td>
+    <td><a href="#">Foo</a></td>
+  </tr>
+
+  <tr>
+    <th colspan="3">OpenProject links</th>
+  </tr>
+  <tr>
+    <th><%= image_tag 'jstoolbar/bt_link.png', :style => 'border: 1px solid #bbb', :alt => 'Link to a Wiki page' %></th>
+    <td>[[Wiki page]]</td>
+    <td><a href="#">Wiki page</a></td>
+  </tr>
+  <tr>
+    <th><%= image_tag 'jstoolbar/bt_link.png', :style => 'border: 1px solid #bbb', :alt => 'Link to a Wiki page' %></th>
+    <td>[[Sandbox:Wiki page]]</td>
+    <td><a href="#">Wiki page</a> (On the Sandbox project)</td>
+  </tr>
+  <tr>
+    <th></th>
+    <td>Issue #12</td>
+    <td>Issue <a href="#">#12</a></td>
+  </tr>
+  <tr>
+    <th></th>
+    <td>##12</td>
+    <td>Link with additional information</td>
+  </tr>
+  <tr>
+    <th></th>
+    <td>###12</td>
+    <td>Link with additional information + description</td>
+  </tr>
+  <tr>
+    <th></th>
+    <td>Revision r43</td>
+    <td>Revision <a href="#">r43</a></td>
+  </tr>
+  <tr>
+    <th></th>
+    <td>commit:f30e13e43</td>
+    <td><a href="#">f30e13e4</a></td>
+  </tr>
+  <tr>
+    <th></th>
+    <td>source:some/file</td>
+    <td><a href="#">source:some/file</a></td>
+  </tr>
+
+  <tr>
+    <th colspan="3">Inline images</th>
+  </tr>
+  <tr>
+    <th><%= image_tag 'jstoolbar/bt_img.png', :style => 'border: 1px solid #bbb', :alt => 'Image' %></th>
+    <td>!<em>image_url</em>!</td>
+    <td></td>
+  </tr>
+  <tr>
+    <th></th>
+    <td>!<em>attached_image</em>!</td>
+    <td></td>
+  </tr>
 </table>
 
-<p><a href="wiki_syntax_detailed" onclick="window.open('wiki_syntax_detailed', '', ''); return false;">More Information</a></p>
+<p>
+  <%= link_to_function 'More Information', "window.open('wiki_syntax_detailed', '', '')" %>
+</p>