patch-detail: change patch info toggles from links to buttons

Change toggle links (i.e. show/hide and expand/collapse) in patch info
section to buttons because links normally suggest movement to another
page whereas buttons indicate an action on the current page. Also,
buttons have a bigger clickable area which boosts the efficiency of
the toggle actions.

Signed-off-by: Raxel Gutierrez <raxel@google.com>

diff --git a/patchwork/templates/patchwork/submission.html b/patchwork/templates/patchwork/submission.html
index 19d9413a4efc61b84e2dbd7240597a2b84845545..66efa0b5fce6fdc9e31e4e2e04d1026cabdf07b7 100644 (file)
--- a/patchwork/templates/patchwork/submission.html
+++ b/patchwork/templates/patchwork/submission.html
@@ -49,7 +49,7 @@
  <tr>
   <th>Headers</th>
   <td>
-    <a id="toggle-patch-headers">show</a>
+    <button id="toggle-patch-headers">show</button>
     <div id="patch-headers" class="patch-headers" style="display:none;">
       <pre>{{submission.headers}}</pre>
     </div>
@@ -62,7 +62,7 @@
    <a href="{% url 'patch-list' project_id=project.linkname %}?series={{ submission.series.id }}">
     {{ submission.series.name }}
    </a> |
-   <a id="toggle-patch-series">expand</a>
+   <button id="toggle-patch-series">expand</button>
    <div id="patch-series" class="submission-list" style="display:none;">
     <ul>
      {% with submission.series.cover_letter as cover %}
@@ -98,7 +98,7 @@
  <tr>
   <th>Related</th>
   <td>
-   <a id="toggle-related">show</a>
+   <button id="toggle-related">show</button>
    <div id="related" class="submission-list" style="display:none;">
     <ul>
      {% for sibling in related_same_project %}
@@ -111,7 +111,7 @@
       </li>
      {% endfor %}
      {% if related_different_project %}
-      <a id="toggle-related-outside">show from other projects</a>
+      <button id="toggle-related-outside">show from other projects</button>
       <div id="related-outside" class="submission-list" style="display:none;">
        {% for sibling in related_outside %}
         <li>