[FIX] Make most fields inline(-block) instead of block level elements

bzr revid: fme@openerp.com-20120530212651-eqzd23mvrjw1bgla

1 files changed, 63 insertions, 105 deletions

diff --git a/addons/web/static/src/xml/base.xml b/addons/web/static/src/xml/base.xml
index 396bd8e8642..df1d444b491 100644
--- a/addons/web/static/src/xml/base.xml
+++ b/addons/web/static/src/xml/base.xml
@@ -591,7 +591,7 @@
         t-if="!field.attrs.modifiers.tree_invisible"
         t-att-data-id="record.id"
         t-att-style="color_for(record) + style "
-        t-attf-class="#{class} #{rank} #{(fields[field.attrs.name].type === 'float') or (fields[field.attrs.name].type === 'integer') ? 'oe-number' : ''}">
+        t-attf-class="#{class} #{rank} #{(fields[field.attrs.name].type === 'float') or (fields[field.attrs.name].type === 'integer') ? 'oe_number' : ''}">
 
         <span t-if="!field.attrs.modifiers.invisible" >
             <t t-esc="render(record[field.attrs.name], fields[field.attrs.name])" />
@@ -634,7 +634,7 @@
     <tfoot>
         <tr>
             <td t-if="options.selectable"/>
-            <td t-foreach="aggregate_columns" t-as="column" class="oe-list-footer oe-number"
+            <td t-foreach="aggregate_columns" t-as="column" class="oe-list-footer oe_number"
                 t-att-data-field="column.id" t-att-title="column.label">
             </td>
             <td t-if="options.deletable"/>
@@ -679,7 +679,7 @@
     <t t-foreach="columns" t-as="column">
         <t t-set="align" t-value="column.type === 'integer' or column.type == 'float'"/>
         <td t-if="!column.meta and column.invisible !== '1'" t-att-title="column.help"
-            t-att-class="'oe-field-cell' + (align ? ' oe-number' : '')
+            t-att-class="'oe-field-cell' + (align ? ' oe_number' : '')
                          + (column.tag === 'button' ? ' oe-button' : '')"
             t-att-data-field="column.id">
             <t t-raw="render_cell(record, column)"/>
@@ -885,71 +885,44 @@
     </ul>
 </t>
 <t t-name="FieldChar">
-    <t t-if="!widget.get('effective_readonly')">
-        <div class="oe_form_field_char">
+    <span class="oe_form_field_char">
+        <t  t-if="!widget.get('effective_readonly')">
             <input t-att-type="widget.password ? 'password' : 'text'"
                 t-att-id="widget.id_for_label"
                 t-att-tabindex="widget.node.attrs.tabindex"
                 t-att-autofocus="widget.node.attrs.autofocus"
-                t-attf-class="field_char #{widget.is_field_number ? 'oe-number' : ''}"
+                class="field_char"
                 t-att-placeholder="widget.node.attrs.placeholder"
             /><img class="oe_field_translate oe_input_icon" t-if="widget.field.translate" t-att-src='_s + "/web/static/src/img/icons/terp-translate.png"' width="16" height="16" border="0"/>
-        </div>
-    </t>
-    <t t-if="widget.get('effective_readonly')">
-        <span t-attf-class="oe_form_field_char #{widget.is_field_number ? 'oe-number' : ''}"/>
-    </t>
+        </t>
+    </span>
 </t>
 <t t-name="FieldEmail">
-    <t t-if="!widget.get('effective_readonly')">
-        <table class="oe_form_field_email" cellpadding="0" cellspacing="0" border="0">
-        <tr>
-            <td>
+    <span class="oe_form_field_email oe_form_field_with_button">
+        <a t-if="widget.get('effective_readonly')" href="#" class="oe_form_uri"/>
+        <t t-if="!widget.get('effective_readonly')">
+            <button class="oe_button" tabindex="-1" type="button" title="Send an e-mail with your default e-mail client">
+                <img t-att-src='_s + "/web/static/src/img/icons/terp-mail-message-new.png"'/>
+            </button>
+            <div>
                 <input type="text"
                     t-att-id="widget.id_for_label"
                     t-att-tabindex="widget.node.attrs.tabindex"
                     t-att-autofocus="widget.node.attrs.autofocus"
                     t-att-placeholder="widget.node.attrs.placeholder"
                 />
-            </td>
-            <td width="16">
-                <button class="oe_button oe_field_button" tabindex="-1" type="button" title="Send an e-mail with your default e-mail client">
-                    <img t-att-src='_s + "/web/static/src/img/icons/terp-mail-message-new.png"'/>
-                </button>
-            </td>
-        </tr>
-        </table>
-    </t>
-    <t t-if="widget.get('effective_readonly')">
-        <span>
-            <a href="#" class="oe_form_uri"/>
-        </span>
-    </t>
+            </div>
+        </t>
+    </span>
 </t>
-<t t-name="FieldUrl">
-    <t t-if="!widget.get('effective_readonly')">
-        <table class="oe_form_field_url" cellpadding="0" cellspacing="0" border="0">
-        <tr>
-            <td>
-                <input type="text"
-                    t-att-id="widget.id_for_label"
-                    t-att-tabindex="widget.node.attrs.tabindex"
-                    t-att-autofocus="widget.node.attrs.autofocus"
-                    t-att-placeholder="widget.node.attrs.placeholder"
-                />
-            </td>
-            <td width="16">
-                <button class="oe_button oe_field_button" tabindex="-1" type="button" title="Open this resource">
-                    <img t-att-src='_s + "/web/static/src/img/icons/gtk-ok.png"'/>
-                </button>
-            </td>
-        </tr>
-        </table>
+<t t-name="FieldUrl" t-extend="FieldEmail">
+    <t t-jquery="span:first">
+        this.removeClass('oe_form_field_email').addClass('oe_form_field_url');
     </t>
-    <t t-if="widget.get('effective_readonly')">
-        <span>
-            <a href="#" class="oe_form_uri"/>
-        </span>
+    <t t-jquery="button.oe_button" t-operation="replace">
+        <button class="oe_button" tabindex="-1" type="button" title="Open this resource">
+            <img t-att-src='_s + "/web/static/src/img/icons/gtk-ok.png"'/>
+        </button>
     </t>
 </t>
 <t t-name="FieldText">
@@ -967,7 +940,7 @@
 </t>
 <t t-name="web.datetimepicker">
     <t t-set="placeholder" t-value="widget.getParent().node and widget.getParent().node.attrs.placeholder"/>
-    <div class="oe_datepicker_root oe_form_field_datetime">
+    <span class="oe_datepicker_root oe_form_field_datetime">
         <input type="text" class="oe_datepicker_container" disabled="disabled" style="display: none;"/>
         <input type="text"
             t-att-name="widget.name"
@@ -975,31 +948,29 @@
             t-attf-class="oe_datepicker_master field_#{widget.type_of_date} oe_form_field_#{widget.type_of_date}"
         /><img class="oe_input_icon oe_datepicker_trigger" t-att-src='_s + "/web/static/src/img/ui/field_calendar.png"'
              title="Select date" width="16" height="16" border="0"/>
-    </div>
+    </span>
 </t>
 <t t-name="FieldSelection">
-    <t t-if="!widget.get('effective_readonly')">
-        <div class="oe_form_field_selection">
-            <select
-                t-att-name="widget.name"
-                t-att-tabindex="widget.node.attrs.tabindex"
-                t-att-autofocus="widget.node.attrs.autofocus"
-                t-att-id="widget.id_for_label">
-                    <t t-foreach="widget.values" t-as="option">
-                        <option><t t-esc="option[1]"/></option>
-                    </t>
-            </select>
-        </div>
-    </t>
-    <t t-if="widget.get('effective_readonly')">
-        <span class="field_selection"/>
-    </t>
+    <span class="oe_form_field_selection">
+        <select t-if="!widget.get('effective_readonly')"
+            t-att-name="widget.name"
+            t-att-tabindex="widget.node.attrs.tabindex"
+            t-att-autofocus="widget.node.attrs.autofocus"
+            t-att-id="widget.id_for_label">
+                <t t-foreach="widget.values" t-as="option">
+                    <option><t t-esc="option[1]"/></option>
+                </t>
+        </select>
+    </span>
 </t>
 <t t-name="FieldMany2One">
-    <t t-if="!widget.get('effective_readonly')">
-        <table class="oe_form_field_many2one" cellpadding="0" cellspacing="0" border="0">
-        <tr>
-            <td valign="top">
+    <span class="oe_form_field_many2one oe_form_field_with_button">
+        <a t-if="widget.get('effective_readonly')" href="#" class="oe_form_uri"/>
+        <t t-if="!widget.get('effective_readonly')">
+            <button class="oe_button oe-m2o-cm-button" title="Open Resource">
+                <img t-att-src='_s + "/web/static/src/img/icons/terp-folder-yellow.png"'/>
+            </button>
+            <div>
                 <input type="text"
                     t-att-id="widget.id_for_label"
                     t-att-tabindex="widget.node.attrs.tabindex"
@@ -1007,21 +978,11 @@
                     t-att-placeholder="widget.node.attrs.placeholder"
                 />
                 <span class="oe-m2o-drop-down-button">
-                    <img t-att-src='_s + "/web/static/src/img/down-arrow.png"' /></span>
-            </td>
-            <td width="16">
-                <button class="oe_button oe_field_button oe-m2o-cm-button" title="Open Resource">
-                    <img t-att-src='_s + "/web/static/src/img/icons/terp-folder-yellow.png"'/>
-                </button>
-            </td>
-        </tr>
-        </table>
-    </t>
-    <t t-if="widget.get('effective_readonly')">
-        <span>
-            <a href="#" class="oe_form_uri"/>
-        </span>
-    </t>
+                    <img t-att-src='_s + "/web/static/src/img/down-arrow.png"'/>
+                </span>
+            </div>
+        </t>
+    </span>
 </t>
 <t t-name="FieldMany2ManyTags">
     <div class="oe_form_field_many2manytags">
@@ -1060,26 +1021,23 @@
     </span>
 </t>
 <t t-name="FieldProgressBar">
-    <div class="oe_form_field_progressbar" t-opentag="true">
+    <span class="oe_form_field_progressbar" t-opentag="true">
         <span></span>
-    </div>
+    </span>
 </t>
 <t t-name="FieldStatus.content">
-    <div class="oe_right">
-        <ul class="oe_form_steps">
-            <t t-set="size" t-value="widget.to_show.length"/>
-            <t t-foreach="_.range(size)" t-as="i">
-                <li t-att-class="widget.to_show[i][0] === widget.selected_value ? 'oe_form_steps_active' : ''">
-                    <t t-esc="widget.to_show[i][1]"/>
-                    <img t-att-src='_s + "/web/static/src/img/form_steps.png"' class="oe_form_steps_arrow" t-if="i &lt; size - 1"/>
-                </li>
-            </t>
-        </ul>
-    </div>
-    <div class="oe_clear"/>
+    <ul class="oe_form_steps">
+        <t t-set="size" t-value="widget.to_show.length"/>
+        <t t-foreach="_.range(size)" t-as="i">
+            <li t-att-class="widget.to_show[i][0] === widget.selected_value ? 'oe_form_steps_active' : ''">
+                <t t-esc="widget.to_show[i][1]"/>
+                <img t-att-src='_s + "/web/static/src/img/form_steps.png"' class="oe_form_steps_arrow" t-if="i &lt; size - 1"/>
+            </li>
+        </t>
+    </ul>
 </t>
 <t t-name="FieldBinaryImage">
-    <div class="oe_binary_image">
+    <span class="oe_binary_image">
         <div class="oe_form_field-binary-image-placeholder"></div>
         <div class="oe-binary">
             <div class="oe-binary-file-set">
@@ -1105,7 +1063,7 @@
             <b>Uploading ...</b>
         </div>
         <iframe t-att-id="widget.iframe" t-att-name="widget.iframe" style="display: none"/>
-    </div>
+    </span>
 </t>
 <t t-name="FieldBinaryImage-img">
     <img t-att-src='url' class="oe-binary-image field_image"