[Maposmatic-dev] [PATCH maposmatic] format the results along a table instead of ul/li (broken on webkit)

[David Decotigny]

---
 www/media/style.css                 |   52 ++++++++++++++++++++---------------
 www/templates/maposmatic/index.html |   16 +++++-----
 2 files changed, 38 insertions(+), 30 deletions(-)

diff --git a/www/media/style.css b/www/media/style.css
index 82748a3..622c4f7 100644
--- a/www/media/style.css
+++ b/www/media/style.css
@@ -163,6 +163,31 @@ form ul {
     list-style-type: none;
 }
 
+table#mapform table#result_nominatim_search
+{
+  margin: 0px;
+  padding: 0px;
+  border-collapse: collapse;
+  border-spacing: 0px;
+}
+
+table#mapform table#result_nominatim_search tr td.nomsrch_bullet
+{
+  margin: 2px;
+  padding: 0px;
+  padding-top: 2px;
+  width: 10px;
+  text-align: center;
+  vertical-align: text-top;
+}
+
+table#mapform table#result_nominatim_search tr td.nomsrch_entry
+{
+  margin: 2px;
+  padding: 0px;
+  padding-left: 3px;
+}
+
 table#mapform
 {
   margin: 2em 2em 2em 2em;
@@ -171,6 +196,11 @@ table#mapform
   padding: 1em;
 }
 
+table#mapform tr.field td
+{
+  padding-bottom: 10px;
+}
+
 table#mapform td
 {
   padding: 3px;
@@ -181,11 +211,6 @@ table#mapform tr.label
   font-weight: bold;
 }
 
-table#mapform tr.field td
-{
-  padding-bottom: 10px !important;
-}
-
 table#mapform td.image
 {
   text-align: right;
@@ -212,23 +237,6 @@ table#mapform td.image
   display: block;
 }
 
-ul#result_nominatim_search li
-{
-    display: table;
-}
-ul#result_nominatim_search li input
-{
-    display: table-cell;
-}
-ul#result_nominatim_search li label
-{
-    display: table-cell;
-}
-ul#result_nominatim_search li img
-{
-    display: table-cell;
-}
-
 ul.errorlist
 {
   margin-top: 5px;
diff --git a/www/templates/maposmatic/index.html 
b/www/templates/maposmatic/index.html
index 99654bd..187b902 100644
--- a/www/templates/maposmatic/index.html
+++ b/www/templates/maposmatic/index.html
@@ -168,7 +168,7 @@ function validate_city_search()
   toggle_form_validation('false');
   languages_show_all();
   $("#result_nominatim_search").empty();
-  $("#result_nominatim_search").append("<li><img src=\"/smedia/loading.gif\" 
alt=\"Loading\" /></li>");
+  $("#result_nominatim_search").append("<tr><td colspan=\"2\"><img 
src=\"/smedia/loading.gif\" alt=\"Loading\"/></td></tr>");
 
   var searchPat = $("#id_administrative_city").attr("value") ;
 
@@ -186,7 +186,7 @@ function validate_city_search()
                  if (item.ocitysmap_params['admin_level'] == 8)
                  {
                    var rad_identifier = "radio" + item.ocitysmap_params["id"];
-                   $("#result_nominatim_search").append("<li><input 
type=\"radio\" id=\""+ rad_identifier + "\" /><label for=\""+rad_identifier 
+"\">"+item.display_name+"</label></li>");
+                   $("#result_nominatim_search").append("<tr><td 
class=\"nomsrch_bullet\"><input type=\"radio\" id=\""+ rad_identifier + "\" 
/></td><td class=\"nomsrch_entry\"><label for=\""+rad_identifier 
+"\">"+item.display_name+"</label></td></tr>");
                    $("#" + 
rad_identifier).attr("name","administrative_tmp_osmid");
                    $("#" + 
rad_identifier).attr("value",item.ocitysmap_params['id']);
 
@@ -203,10 +203,10 @@ function validate_city_search()
                 }
                else
                 {
-                   $("#result_nominatim_search").append("<li><img 
src=\"/smedia/icon_alert.png\" "+
+                   $("#result_nominatim_search").append("<tr><td 
class=\"nomsrch_bullet\"><img src=\"/smedia/icon_alert.png\" "+
                      "alt=\"Work In Progress\" title=\"{% trans "This place 
cannot be rendered by MapOSMatic, administrative boundary missing. Please 
contribute !" %}\" />"+
-                     "&nbsp;<label class=\"place_unavailable\""
-                     + ">" +item.display_name + "</label></li>");
+                     "</td><td class=\"nomsrch_entry\"><label 
class=\"place_unavailable\""
+                     + ">" +item.display_name + "</label></td></tr>");
                      unusableToken = unusableToken + 1;
                 }
              });
@@ -215,7 +215,7 @@ function validate_city_search()
               {
                 toggle_form_validation("false");
                 if (unusableToken == 0)
-                    $("#result_nominatim_search").append("<li><b>{% trans 'No 
results found.' %}</b></li>");
+                    $("#result_nominatim_search").append("<tr><td 
colspan=\"2\"><b>{% trans 'No results found.' %}</b></td></tr>");
               }
            });
 }
@@ -338,8 +338,8 @@ maps.{% endblocktrans %}</p>
     </td></tr>
     <tr class="byadmin field">
       <td>
-       <ul id="result_nominatim_search">
-       </ul>
+       <table id="result_nominatim_search">
+       </table>
       </td>
     </tr>
     <tr class="label">
-- 
1.6.3.3