X-Git-Url: https://git.openstreetmap.org./osqa.git/blobdiff_plain/0f2d00f9d7d5d28149707f66c719b28edfe51aed..fb911ca1503de4dfea21871d271798f3082f582a:/forum/skins/default/templates/node/comments.html

diff --git a/forum/skins/default/templates/node/comments.html b/forum/skins/default/templates/node/comments.html
index 022f19c..87ce889 100644
--- a/forum/skins/default/templates/node/comments.html
+++ b/forum/skins/default/templates/node/comments.html
@@ -3,39 +3,32 @@
 
 <div class="comments-container" id="comments-container-{{ post.id }}">
     {% for comment in comments %}
-        <table class="comment{% if not comment.top_scorer %} not_top_scorer{% endif %}" id="comment-{{comment.id}}">
-            <tr>
-                <td rowspan="2" class="comment-score" id="comment-{{ comment.id }}-score">
-                    {% if comment.score %}{{ comment.score }}{% endif %}
-                </td>
-                <td class="comment-text" id="comment-{{comment.id}}-text">
-                    {{ comment.comment }}
-                </td>
-            </tr>
-            <tr>
-                <td class="comment-info" id="comment-{{comment.id}}-info">
-                    <a class="comment-user userinfo" href="{{comment.user.get_profile_url}}">{{comment.user}}</a>
-                    <span class="comment-age">({% diff_date comment.added_at %})</span>
-                    {% if comment.can_like %}
-                        <a id="comment-{{ comment.id }}-like" href="{% url like_comment id=comment.id %}"
-                         title="{% trans "I like this comment (click again to cancel)" %}" class="ajax-command comment-like{% if comment.likes %} on{% endif %}"
-                        rel="nofollow"> </a>
-                    {% endif %}
-                    {% if comment.can_edit %}
-                        <a id="comment-{{ comment.id }}-edit" href="#" title="{% trans "Edit comment" %}"
-                            class="comment-edit" rel="nofollow"> </a>
-                    {% endif %}
-                    {% if comment.can_delete %}
-                        <a id="comment-{{ comment.id }}-delete" href="{% url delete_comment id=comment.id %}" title="{% trans "Delete comment" %}"
-                            class="ajax-command comment-delete" rel="nofollow"> </a>
-                    {% endif %}
-                </td>
-            </tr>
-        </table>
+        <a name="{{ comment.id }}"></a>
+        <div class="comment{% if not comment.top_scorer %} not_top_scorer{% endif %}" id="comment-{{comment.id}}">
+            <div id="post-{{ comment.id }}-score" class="comment-score">{% if comment.score %}{{ comment.score }}{% endif %}</div>
+            <div class="comment-text">{{ comment.comment }}</div>
+            <div class="comment-info" id="comment-{{comment.id}}-info">
+                {% if comment.can_like %}
+                    <a id="post-{{ comment.id }}-upvote" href="{% url like_comment id=comment.id %}"
+                     title="{% trans "I like this comment (click again to cancel)" %}" class="ajax-command comment-like{% if comment.likes %} on{% endif %}"
+                    rel="nofollow"> </a>
+                {% endif %}
+                {% if comment.can_edit %}
+                    <a id="comment-{{ comment.id }}-edit" href="{% url node_markdown id=comment.id %}" title="{% trans "Edit comment" %}"
+                        class="comment-edit" rel="nofollow"> </a>
+                {% endif %}
+                {% if comment.can_delete %}
+                    <a id="comment-{{ comment.id }}-delete" href="{% url delete_comment id=comment.id %}" title="{% trans "Delete comment" %}"
+                        class="ajax-command comment-delete" rel="nofollow"> </a>
+                {% endif %}
+                <span class="comment-age">({% diff_date comment.added_at %})</span>
+                <a class="comment-user userinfo" href="{{comment.user.get_profile_url}}">{{comment.user.decorated_name}}</a>
+                {% if show_gravatar %}{% gravatar comment.user 18 %}{% endif %}
+            </div>
+        </div>
     {% endfor %}
 </div>
 <div id="comment-tools-{{ post.id }}" class="comment-tools">
-    <img src="/m/default/media/images/gray-up-arrow-h18px.png" />
     {% ifnotequal showing total %}
         <span class="comments-showing">
             {% blocktrans %}showing {{ showing }} of {{ total }}{% endblocktrans %}
@@ -46,37 +39,39 @@
         <a href="#" class="add-comment-link">{% trans "add new comment" %}</a>
     {% endif %}
 </div>
-{% if can_comment %}
 <div id="comment-{{ post.id }}-form-container" class="comment-form-container">
-    <form id="comment-{{ post.id }}-form" method="post" action="{% url comment id=post.id %}">
+    {% if can_comment %}
+    <form id="comment-{{ post.id }}-form" method="post" action="{% url comment id=post.id %}" accept-charset="utf-8">
         <div class="comment-form-widgets-container">
-            <textarea name="comment"></textarea>
-            <input type="submit" value="{% trans " add comment" %}" />
+            <textarea name="comment" class="commentBox"></textarea>
+            <div class="comment-form-buttons">
+                <span id="comment-{{ post.id }}-chars-left" class="comment-chars-left">
+                    <span class="comments-char-left-count">{{ min_length }}|{{ max_length }}</span>
+                    <span class="comments-chars-togo-msg">{% trans "characters needed" %}</span>
+                    <span class="comments-chars-left-msg">{% trans "characters left" %}</span>
+                </span>
+                <input type="submit" class="comment-submit" value="{% trans " comment" %}" onclick="window.removeEventListener('beforeunload', beforeUnload, true)" />
+                <input type="submit" class="comment-cancel" value="{% trans " cancel" %}" />
+            </div>
         </div>
-        <span id="comment-{{ post.id }}-chars-left" class="comment-chars-left">
-            {% blocktrans %}
-                have <span class="comments-char-left-count">{{ max_length }}</span> characters left
-            {% endblocktrans %}
-        </span>
         <script type="text/html" class="new-comment-skeleton" id="new-comment-skeleton-{{ post.id }}">
-            <table class="comment" id="comment-%ID%" style="display: none">
-                <tr>
-                    <td rowspan="2" class="comment-score" id="comment-%ID%-score"></td>
-                    <td class="comment-text" id="comment-%ID%-text">%COMMENT%</td>
-                </tr>
-                <tr>
-                    <td class="comment-info" id="comment-%ID%-info">
-                        <a class="comment-user" href="%PROFILE_URL%">%USERNAME%</a>
-                        <span class="comment-age">({% trans "just now" %})</span>
-                        <a id="comment-%ID%-edit" href="#"
-                            class="comment-edit" rel="nofollow"> </a>
-                        <a id="comment-%ID%-delete" href="%DELETE_URL%"
-                            class="ajax-command comment-delete" rel="nofollow"> </a>
-                    </td>
-                </tr>
-            </table>
+            <div class="comment{% if not comment.top_scorer %} not_top_scorer{% endif %}" id="comment-%ID%">
+                <div id="post-%ID%-score" class="comment-score"></div>
+                <div class="comment-text">%COMMENT%</div>
+                <div class="comment-info" id="comment-{{comment.id}}-info">
+                    <a id="comment-%ID%-edit" href="%EDIT_URL%"
+                        class="comment-edit" rel="nofollow"> </a>
+                    <a id="comment-%ID%-delete" href="%DELETE_URL%"
+                        class="ajax-command comment-delete" rel="nofollow"> </a>
+                    <span class="comment-age">({% trans "just now" %})</span>
+                    <a class="comment-user" href="%PROFILE_URL%">%USERNAME%</a>
+                    {% if user.is_authenticated %}
+                        {% if show_gravatar %}{% gravatar user 18 %}{% endif %}
+                    {% endif %}
+                </div>
+             </div>
         </script>
     </form>
+    {% endif %}
 </div>
-{% endif %}
     
\ No newline at end of file