[IMP] Now uses ul and li for creating comment lists.

bzr revid: tde@openerp.com-20120321140726-0d6y7d22t0mh879j

addons/mail/static/src/css/mail.css

@@ -50,11 +50,11 @@
 }
 
 /* Left-side CSS */
-.oe_mail_actions {
+.oe_mail_recthread_actions {
     margin-bottom: 10px;
 }
 
-.oe_mail_followers {
+.oe_mail_recthread_followers {
     margin-bottom: 10px;
 }
 
@@ -93,6 +93,7 @@
 div.oe_mail_thread_act {
     white-space: normal;
     margin-bottom: 5px;
+    padding: 4px;
 }
 
 div.oe_mail_thread_display {
@@ -109,7 +110,7 @@ div.oe_mail_thread_more {
     border-bottom: 1px solid #D2D9E7;
 }
 
-div.oe_mail_thread_msg {
+li.oe_mail_thread_msg {
     padding: 4px;
     -moz-border-radius: 4px;
     -webkit-border-radius: 4px;
@@ -118,15 +119,15 @@ div.oe_mail_thread_msg {
     border-radius: 4px;
 }
 
-div.notification {
+li.notification {
     background: #E0E0E0;
 }
 
-div.email {
+li.email {
     background: #E0E0E0;
 }
 
-div.oe_mail_thread_msg:after, div.oe_mail_thread_act:after {
+li.oe_mail_thread_msg:after, div.oe_mail_thread_act:after {
     content: "";
     display: block;
     clear: both; 
@@ -176,6 +177,16 @@ div.oe_mail_thread_msg:after, div.oe_mail_thread_act:after {
 /* Styling (should be openerp)    */
 /* ------------------------------ */
 
+ul.oe_mail {
+    padding: 0;
+    margin: 0;
+}
+
+li.oe_mail {
+    list-style-type: none;
+    margin-bottom: 2px;
+}
+
 input.oe_mail, textarea.oe_mail {
     width: 100%;
     padding: 4px;

addons/mail/static/src/js/mail.js

@@ -446,7 +446,7 @@ openerp.mail = function(session) {
         
         display_subscribers: function (records) {
             var self = this;
-            var sub_node = this.$element.find('div.oe_mail_followers')
+            var sub_node = this.$element.find('div.oe_mail_recthread_followers')
             sub_node.empty();
             $('<h4/>').html('Followers (' + records.length + ')').appendTo(sub_node);
             _(records).each(function (record) {
@@ -475,7 +475,7 @@ openerp.mail = function(session) {
             this.see_sub = 1 - this.see_sub;
             if (this.see_sub == 1) { this.$element.find('button.oe_mail_button_followers').html('Hide followers'); }
             else { this.$element.find('button.oe_mail_button_followers').html('Display followers'); }
-            this.$element.find('div.oe_mail_followers').toggle();
+            this.$element.find('div.oe_mail_recthread_followers').toggle();
         },
         
         thread_get_avatar_mini: function(model, field, id) {

addons/mail/static/src/xml/mail.xml

@@ -23,16 +23,16 @@
     </t>
 
     <div t-name="RecordThread" class="oe_mail_recthread">
-        <div class="separator horizontal">OpenSocial</div>
+        <h4>History and Comments</h4>
         <div class="oe_mail_recthread_left">
         </div>
         <div class="oe_mail_recthread_right">
-            <div class="oe_mail_actions">
+            <div class="oe_mail_recthread_actions">
                 <button type="button" class="oe_mail_button_follow">Not following</button>
                 <button type="button" class="oe_mail_button_unfollow">Following</button>
                 <button type="button" class="oe_mail_button_followers">Display followers</button>
             </div>
-            <div class="oe_mail_followers">
+            <div class="oe_mail_recthread_followers">
                 <h4>Followers</h4>
                 <div class="oe_mail_followers_display">
                 </div>
@@ -40,11 +40,11 @@
         </div>
     </div>
 
-    <div t-name="Thread" class="oe_mail_thread">
+    <ul t-name="Thread" class="oe_mail_thread oe_mail">
         <div class="oe_mail_thread_act">
             <img class="oe_mail_msg_image oe_mail_oe_left" alt="User img"/>
             <div class="oe_mail_msg_content">
-                <textarea class="oe_mail oe_mail_action_textarea" placeholder="Add your comment here..." onfocus="this.value = '';"/><br />
+                <textarea class="oe_mail_action_textarea oe_mail" placeholder="Add your comment here..." onfocus="this.value = '';"/><br />
             </div>
         </div>
         <div class="oe_mail_thread_display"></div>
@@ -52,16 +52,16 @@
             <button class="oe_mail_button_more" type="button">Load more messages</button>
             <p class="oe_mail_p_nomore">You have loaded all messages in this thread.</p>
         </div>
-    </div>
+    </ul>
 
-    <div t-name="ThreadMsg" t-attf-class="{record.type} oe_mail_thread_msg">
+    <li t-name="ThreadMsg" t-attf-class="{record.type} oe_mail_thread_msg oe_mail">
         <img class="oe_mail_msg_image oe_mail_oe_left" t-att-src="record.mini_url"/>
         <div class="oe_mail_msg_content">
             <t t-if="record.type == 'email'"><t t-call="EmailDisplay" /></t>
             <t t-if="record.type == 'notification' || record.type == 'comment'"><t t-call="NoteDisplay" /></t>
         </div>
         <t t-if="record.type == 'tmp'"><t t-call="ThreadDisplay" /></t>
-    </div>
+    </li>
     
     <t t-name="NoteDisplay">
         <p class="oe_mail_msg">