[IMP] design using display table

bzr revid: mat@openerp.com-20130426155242-1do1w4mrch23lhbm

1 files changed, 53 insertions, 58 deletions

diff --git a/addons/gamification/static/src/xml/gamification.xml b/addons/gamification/static/src/xml/gamification.xml
index 27a4a46108d..62476c9a366 100644
--- a/addons/gamification/static/src/xml/gamification.xml
+++ b/addons/gamification/static/src/xml/gamification.xml
@@ -6,75 +6,72 @@
     <t t-name="gamification.goal_list_to_do">
         <div t-foreach="widget.goals_info.info" t-as="plan" class="oe_goal">
             <div>
-                <h4 style="display:inline-block;"><t t-esc="plan.name" /></h4>
                 <a class="oe_update_plan oe_e" rol="button" t-attf-id="{plan.id}">e</a>
+                <h4><t t-esc="plan.name" /></h4>
             </div>
 
             <t t-if="plan.visibility_mode == 'progressbar'">
-                <ul class="oe_goals_list">
-                    <li t-foreach="plan.goals" t-as="goal" t-attf-class="#{goal.state == 'reached' ? 'oe_goal_reached' : ''} #{goal.type_display != 'progress' ? 'oe_no_progress' : ''}">
-                        <t t-if="goal.type_display == 'progress'"><span class="oe_goal_current"><t t-esc="goal.current" /></span></t>
-                        <div class="oe_goal_outer_box">
+                <div class="oe_table oe_goals_list">
+                    <div t-foreach="plan.goals" t-as="goal" t-attf-class="oe_row oe_goal_outer_box #{goal.state == 'reached' ? 'oe_goal_reached' : ''} #{goal.type_display != 'progress' ? 'oe_no_progress' : ''}">
                             <t t-if="goal.type_display == 'progress'">
                                 <div class="oe_goal_progress_background"></div>
                                 <div class="oe_goal_progress" t-attf-style="#{goal.type_display == 'progress' ? 'width: '+goal.completeness+'%;' : 'width:0;'}"></div>
                             </t>
-                            <div t-attf-class="oe_goal_inner_box #{goal.type_display != 'progress' ? 'oe_no_progress' : ''}">
-                                <t t-if="goal.computation_mode != 'manually' and !goal.type_action">
-                                    <span t-att-title="goal.type_description"><t t-esc="goal.type_name" /></span>
-                                </t>
-                                <t t-if="goal.type_action or goal.computation_mode == 'manually'">
-                                    <span t-att-title="goal.type_description"><a class="oe_goal_action" t-att-id="goal.id"><t t-esc="goal.type_name" /></a></span>
-                                </t>
+                            <div t-attf-class="oe_goal_inner_box">
                                 <t t-if="goal.type_display == 'progress'">
-                                    <t t-if="goal.type_condition == 'higher'">
-                                            (target:
+                                    <div class="oe_cell oe_goal_current"><t t-esc="goal.current" /></div>
+                                </t>
+                                <div class="oe_cell">
+                                    <t t-if="goal.computation_mode != 'manually' and !goal.type_action">
+                                        <span t-att-title="goal.type_description"><t t-esc="goal.type_name" /></span>
                                     </t>
-                                    <t t-if="goal.type_condition == 'lower'">
-                                            (target less than:
+                                    <t t-if="goal.type_action or goal.computation_mode == 'manually'">
+                                        <span t-att-title="goal.type_description"><a class="oe_goal_action" t-att-id="goal.id"><t t-esc="goal.type_name" /></a></span>
                                     </t>
-                                    <span t-attf-class="#{goal.type_monetary ? 'oe_goal_field_monetary' : ''}"><t t-esc="goal.target_goal"/></span>
-                                    <t t-if="goal.type_unit"><t t-esc="goal.type_unit"/></t>)
-                                </t>
+                                    <t t-if="goal.type_display == 'progress'">
+                                        <t t-if="goal.type_condition == 'higher'">
+                                                (target:
+                                        </t>
+                                        <t t-if="goal.type_condition == 'lower'">
+                                                (target less than:
+                                        </t>
+                                        <span t-attf-class="#{goal.type_monetary ? 'oe_goal_field_monetary' : ''}"><t t-esc="goal.target_goal"/></span>
+                                        <t t-if="goal.type_unit"><t t-esc="goal.type_unit"/></t>)
+                                    </t>
+                                </div>
                             </div>
-                        </div>
-                    </li>
-                </ul>
+                    </div>
+                </div>
             </t>
 
             <t t-if="plan.visibility_mode == 'board'">
-                <table t-foreach="plan.planlines" t-as="planline" class="oe_goals_list">
-                    <thead>
-                    <tr>
-                        <th colspan="3" t-attf-title="#{planline.type_description ? planline.type_description : ''}">
+                <div t-foreach="plan.planlines" t-as="planline" class="oe_goals_list oe_table">
+                    <div class="oe_row">
+                        <div class="oe_cell oe_thead" colspan="3" t-attf-title="#{planline.type_description ? planline.type_description : ''}">
                             <strong><t t-esc="planline.type_name"/></strong>
-
-                            <t t-if="planline.computation_mode == 'manually' and !planline.type_action">
-                                <strong><t t-esc="planline.type_name"/></strong>
-                                <a class="oe_goal_action oe_e" t-att-id="planline.own_goal_id">&amp;</a>
-                            </t>
-                            <t t-if="planline.type_condition == 'higher'">
-                                Target:
-                            </t>
-                            <t t-if="planline.type_condition == 'lower'">
-                                Target (less than):
+                            <br/>
+                            <div class="oe_grey">
+                                <t t-if="planline.type_condition == 'higher'">
+                                    Target:
+                                </t>
+                                <t t-if="planline.type_condition == 'lower'">
+                                    Target (less than):
+                                </t>
+                                <span t-attf-class="#{planline.type_monetary ? 'oe_goal_field_monetary' : ''}"><t t-esc="planline.target_goal" /></span><t t-if="planline.type_unit"> <t t-esc="planline.type_unit"/></t>
+                            </div>
+                        </div>
+                    </div>
+                    <div t-foreach="planline.goals" t-as="goal" t-attf-class="#{goal.id == planline.own_goal_id ? 'oe_bold' : ''}">
+                        <div class="oe_row oe_goal_outer_box">
+                            <t t-if="planline.type_display == 'progress'">
+                                <div class="oe_goal_progress_background"></div>
+                                <div class="oe_goal_progress" t-attf-style="#{planline.type_display == 'progress' ? 'width: '+goal.completeness+'%;' : 'width:0;'}"></div>
                             </t>
-                            <span t-attf-class="#{planline.type_monetary ? 'oe_goal_field_monetary' : ''}"><t t-esc="planline.target_goal" /></span><t t-if="planline.type_unit"> <t t-esc="planline.type_unit"/></t>)
-                        </th>
-                    </tr>
-                    </thead>
-                    <tbody>
-                    <tr t-foreach="planline.goals" t-as="goal" t-attf-class="#{goal.id == planline.own_goal_id ? 'oe_bold' : ''}">
-                        <div>
-                            <th class="col0"><t t-esc="goal.rank" /></th>
-                            <td class="col1"><img class="oe_user_avatar" t-attf-alt="#{goal.user_name}" t-attf-data-id="#{goal.user_id}"/></td>
-                            <td class="col2">
-                                <div class="oe_goal_outer_box">
-                                    <t t-if="planline.type_display == 'progress'">
-                                        <div class="oe_goal_progress_background"></div>
-                                        <div class="oe_goal_progress" t-attf-style="#{planline.type_display == 'progress' ? 'width: '+goal.completeness+'%;' : 'width:0;'}"></div>
-                                    </t>
-                                    <div class="oe_goal_inner_box">
+                            <div class="oe_goal_inner_box">
+                                <div class="oe_cell col0"><t t-esc="goal.rank" /></div>
+                                <div class="oe_cell col1"><img class="oe_user_avatar" t-attf-alt="#{goal.user_name}" t-attf-data-id="#{goal.user_id}"/></div>
+                                <div class="oe_cell col2">
+                                    
                                         <t t-esc="goal.user_name"/><br/>
                                         <t t-if="goal.id != planline.own_goal_id or (planline.computation_mode != 'manually' and !planline.type_action)">
                                             <span t-attf-class="#{planline.type_monetary ? 'oe_goal_field_monetary' : ''}"><t t-esc="goal.current" /></span><t t-if="planline.type_unit"> <t t-esc="planline.type_unit"/></t>
@@ -84,20 +81,18 @@
                                                 <span t-attf-class="#{planline.type_monetary ? 'oe_goal_field_monetary' : ''}"><t t-esc="goal.current" /></span><t t-if="planline.type_unit"> <t t-esc="planline.type_unit"/></t>
                                             </a>
                                         </t>
-                                    </div>
                                 </div>
-                            </td>
+                            </div>
                         </div>
-                    </tr>
-                </tbody>
-                </table>
+                    </div>
+                </div>
             </t>
         </div>
     </t>
 
     <t t-name="gamification.challenge_suggestions">
         <div class="oe_goal">
-            <h3>Suggestions</h3>
+            <h4>Proposed Challenges</h4>
             <ul t-foreach="widget.challenge_suggestions.info" t-as="challenge" class="oe_goals_list">
                 <li>
                     <strong><a class="oe_challenge_reply" t-attf-title="#{challenge.description.value ? challenge.description.value : ''}" t-attf-id="{challenge.id}" title="more details..."><t t-esc="challenge.name"/></a></strong>