Show icons next to buttons with separate icon which shows current sort order (as title).

git-svn-id: https://svn.erp5.org/repos/public/erp5/trunk@38214 20353a03-c40f-0410-a6d1-a30d3c3de9de

product/ERP5/bootstrap/erp5_xhtml_style/SkinTemplateItem/portal_skins/erp5_xhtml_style/ListBox_asHTML.xml

@@ -281,26 +281,33 @@
                                                     or \'sort-button\';\n
                                   bt_title python: sort_order==\'ascending\' and \'Ascending Display\'\n
                                                    or sort_order==\'descending\' and \'Descending Display\'\n
-                                                   or \'Sort\';">                 \n
+                                                   or \'Sort\';\n
+                                  listbox_field_id string:${field_id}.${sql};">                 \n
                     <!-- Button in normal view -->\n
-                    <button tal:condition="not:is_gadget_mode" \n
+                    <button tal:condition="not:is_gadget_mode"\n
                             type="submit"\n
                             name="setSelectionQuickSortOrder:method"\n
                             tal:content="title"\n
-                            tal:attributes="title bt_title;\n
-                                            value string:${field_id}.${sql};\n
+                            tal:attributes="title title;\n
+                                            value listbox_field_id;\n
                                             class bt_class;"\n
-                            i18n:domain="ui" i18n:attributes="title" />\n
+                            i18n:domain="ui" i18n:attributes="title"/>\n
 \n
                     <!-- Button in gadget mode -->\n
                     <button tal:condition="is_gadget_mode" \n
-                            tal:define ="params python: {\'setSelectionQuickSortOrder:method\':field_id+\'.\'+sql};"\n
-                            type="button"  \n
-                            tal:content="title"\n
-                            tal:attributes="title bt_title; \n
-                                            onclick python: real_context.KnowledgePad_generateAjaxCall(context_url+\'/\'+form_id,box,dom_id,params);\n
-                                            class bt_class;"\n
-                            i18n:domain="ui" i18n:attributes="title"/>\n
+                              tal:define ="params python: {\'setSelectionQuickSortOrder:method\':listbox_field_id};"\n
+                              type="button"  \n
+                              tal:content="title"\n
+                              tal:attributes="title title; \n
+                                              onclick python: real_context.KnowledgePad_generateAjaxCall(context_url+\'/\'+form_id,box,dom_id,params);\n
+                                              class bt_class;"\n
+                              i18n:domain="ui" i18n:attributes="title"/>\n
+  \n
+                    <!-- Icon showing sort order -->\n
+                    <img tal:attributes="title bt_title;\n
+                                         class bt_class;"\n
+                         i18n:domain="ui" i18n:attributes="title" />\n
+                    \n
                   </th>\n
 \n
                   <th class="listbox-table-header-cell"\n

product/ERP5/bootstrap/erp5_xhtml_style/SkinTemplateItem/portal_skins/erp5_xhtml_style/erp5_listbox.css.xml

@@ -738,19 +738,27 @@ table.listbox th button{\n
 \n
 table.listbox th button.sort-button {\n
   text-decoration: underline;\n
-  padding-right: 12px;\n
+  padding: 0px;\n
 }\n
 \n
 table.listbox th button.sort-button:hover{\n
   color: #FFF;\n
 }\n
 \n
+/* in ERP5 mode no need to have a switch for not clicked sort button */\n
+table.listbox th button.sort-button-asc,\n
 table.listbox th button.sort-button-desc{\n
-  background: url(\'images/1toparrow.png\') no-repeat scroll 100% 50%;\n
+  background: none;\n
 }\n
 \n
-table.listbox th button.sort-button-asc{\n
-  background: url(\'images/1bottomarrow.png\') no-repeat scroll 100% 50%;\n
+table.listbox th img.sort-button-desc{\n
+  background: url(\'images/1toparrow.png\') no-repeat scroll 100% 100%;\n
+  padding-left:12px;\n
+}\n
+\n
+table.listbox th img.sort-button-asc{\n
+  background: url(\'images/1bottomarrow.png\') no-repeat scroll 100% 100%;\n
+  padding-left:12px;\n
 }\n
 \n
 /* in search mode listbox may contain top/bottom quick search inputs */\n

product/ERP5/bootstrap/erp5_xhtml_style/bt/revision

-998
+999
\ No newline at end of file