Set table's class to resp. list_style mode to support different CSS settings based on list style.

Add specific thumbnail CSS to style these kind of listbox mode.

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

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

@@ -225,7 +225,8 @@
     </div>\n
 \n
     <div class="listbox-body">\n
-      <table class="listbox">      \n
+      <table class="listbox"\n
+             tal:attributes="class python: \'%s listbox-%s\' %(field_id, list_style)">      \n
         <thead>\n
           <!--Column title -->\n
           <tr class="listbox-label-line">  \n

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

@@ -655,7 +655,6 @@ div.listbox-tree select{\n
 }\n
 \n
 /* Table Listbox elements */\n
-\n
 table.listbox{\n
   border-collapse:collapse;\n
   width:100%;\n
@@ -767,6 +766,24 @@ table.listbox th img.sort-button-asc{\n
   background: url(\'images/1bottomarrow.png\') no-repeat scroll 100% 100%;\n
 }\n
 \n
+\n
+/* listbox table in thumbnail style \n
+   In thumbnail style we usually have only one thumbnail colum which through CSS\n
+   we show as floating box table row.\n
+*/\n
+table.listbox-thumbnail tbody tr{\n
+  display:block;\n
+  width: 128px; /* nano image width. XXX: dynamically generate. */\n
+  height:128px; /* nano image height. XXX: dynamically generate. */\n
+  float:left;\n
+  margin: 10px;\n
+}\n
+table.listbox-thumbnail tr.DataA, table.listbox-thumbnail tr.DataB,\n
+table.listbox-thumbnail tr.DataA:hover, table.listbox-thumbnail tr.DataB:hover{\n
+  background-color: transparent; /* in thumbnail mode we don\'t care for hoover */\n
+}\n
+\n
+\n
 /* in search mode listbox may contain top/bottom quick search inputs */\n
 div.search-text-listbox{\n
   text-align: center;\n

product/ERP5/bootstrap/erp5_xhtml_style/bt/revision

-1012
+1014
\ No newline at end of file