From 9aaf24e2478307926f5b199e53104cbc0942d70f Mon Sep 17 00:00:00 2001
From: Timo Stollenwerk <timo@zmag.de>
Date: Fri, 28 Aug 2009 21:21:54 +0000
Subject: [PATCH] Fix story 1140047. Comment text wraps around commenter image.

svn path=/plone.app.discussion/trunk/; revision=29457
---
 plone/app/discussion/browser/comments.pt      | 70 ++++++++++---------
 .../browser/stylesheets/discussion.css        | 26 +++++--
 2 files changed, 56 insertions(+), 40 deletions(-)

diff --git a/plone/app/discussion/browser/comments.pt b/plone/app/discussion/browser/comments.pt
index ac39ed3..c99dde6 100644
--- a/plone/app/discussion/browser/comments.pt
+++ b/plone/app/discussion/browser/comments.pt
@@ -23,6 +23,7 @@
     </div>
 
     <div class="discussion"
+         tal:attributes="class python: showCommenterImage and 'discussion showCommenterImage' or 'discussion';"
          tal:condition="python:replies or (userHasReplyPermission and isDiscussionAllowed) or (isAnon and not userHasReplyPermission and isDiscussionAllowed)">
         <tal:getreplies repeat="reply_dict replies">
 
@@ -86,41 +87,44 @@
                      This is the body text of the comment.
                 </div>
 
-                <button class="context reply-to-comment-button hide allowMultiSubmit"
-                        tal:condition="python:userHasReplyPermission and isDiscussionAllowed or isAnonymousDiscussionAllowed"
-                        i18n:translate="label_reply;">
-                    Reply
-                </button>
+                <div class="commentActions">
+                    <button class="context reply-to-comment-button hide allowMultiSubmit"
+                            tal:condition="python:userHasReplyPermission and isDiscussionAllowed or isAnonymousDiscussionAllowed"
+                            i18n:translate="label_reply;">
+                        Reply
+                    </button>
 
-                <form name="delete"
-                      action=""
-                      method="post"
-                      style="display: inline;"
-                      tal:condition="view/can_manage"
-                      tal:attributes="action string:${reply/absolute_url}/@@moderate-delete-comment">
-                    <input name="form.button.DeleteComment"
-                           class="destructive"
-                           type="submit"
-                           value="Remove"
-                           i18n:attributes="value label_remove;"
-                           />
-                </form>
+                    <form name="delete"
+                          action=""
+                          method="post"
+                          style="display: inline;"
+                          tal:condition="view/can_manage"
+                          tal:attributes="action string:${reply/absolute_url}/@@moderate-delete-comment">
+                        <input name="form.button.DeleteComment"
+                               class="destructive"
+                               type="submit"
+                               value="Remove"
+                               i18n:attributes="value label_remove;"
+                               />
+                    </form>
 
-                <!-- Workflow actions (e.g. 'publish') -->
-                <form name=""
-                      action=""
-                      method="get"
-                      style="display: inline;"
-                      tal:repeat="action reply_dict/actions|nothing"
-                      tal:attributes="action string:${reply/absolute_url}/@@moderate-publish-comment;
-                                      name action/id">
-                    <input type="hidden" name="workflow_action" tal:attributes="value action/id" />
-                    <input name="form.button.PublishComment"
-                           class="context"
-                           type="submit"
-                           tal:attributes="value action/title"
-                           />
-                </form>
+                    <!-- Workflow actions (e.g. 'publish') -->
+                    <form name=""
+                          action=""
+                          method="get"
+                          style="display: inline;"
+                          tal:repeat="action reply_dict/actions|nothing"
+                          tal:attributes="action string:${reply/absolute_url}/@@moderate-publish-comment;
+                                          name action/id">
+                        <input type="hidden" name="workflow_action" tal:attributes="value action/id" />
+                        <input name="form.button.PublishComment"
+                               class="context"
+                               type="submit"
+                               tal:attributes="value action/title"
+                               />
+                    </form>
+
+                </div>
 
             </div>
 
diff --git a/plone/app/discussion/browser/stylesheets/discussion.css b/plone/app/discussion/browser/stylesheets/discussion.css
index a20e7b9..ad23ac0 100644
--- a/plone/app/discussion/browser/stylesheets/discussion.css
+++ b/plone/app/discussion/browser/stylesheets/discussion.css
@@ -4,6 +4,7 @@
     display: none;
 }
 
+
 /* Comments Viewlet
    ---------------------------------------------------------------- */
 
@@ -15,19 +16,29 @@
 .commentImage {
 	width: 90px;
 	float: left;
-	background: #EEF3F5; /* Todo: Only a temporary solution !!! */
+	margin-right: -90px;
 }
 
 .commentImage img {
 	   margin-right: 1em;
 }
 
-.comment h3,
-.comment .documentByLine,
-.comment .commentBody {
-
+.commentBody {
+	margin: 1em 0;
 }
 
+.showCommenterImage h3,
+.showCommenterImage .documentByLine,
+.showCommenterImage .commentBody,
+.showCommenterImage .commentActions,
+.showCommenterImage .reply {
+	/* The showCommenterImage CSS class is only set if showing the
+	 * commenters image is enabled.
+	 */
+    margin-left: 90px;
+}
+
+
 /* Reply Form
    ---------------------------------------------------------------- */
 
@@ -37,8 +48,8 @@
 }
 
 .reply-to-comment-button {
-   /* Hide the reply-to-comment button and show it only if Javascript is enabled.
-    * Since the reply functions rely on jQuery.
+   /* Hide the reply-to-comment button and show it only if Javascript
+    * is enabled. Since the reply functions rely on jQuery.
     */
 	display: none;
 }
@@ -50,6 +61,7 @@
 	display: none;
 }
 
+
 /* Moderation View
    ---------------------------------------------------------------- */