Refactor the query results to use bootstrap list-group-flush

diff --git a/app/assets/javascripts/index/query.js b/app/assets/javascripts/index/query.js
index 5c6e5817080efe09680a7dccb2564106efe28713..514d6dbb25b6b6619a481de954802cbbd2f10ea4 100644 (file)
--- a/app/assets/javascripts/index/query.js
+++ b/app/assets/javascripts/index/query.js
@@ -214,17 +214,15 @@ OSM.Query = function (map) {
 
           if (interestingFeature(element)) {
             var $li = $("<li>")
 
           if (interestingFeature(element)) {
             var $li = $("<li>")

-              .addClass("query-result")
+              .addClass("query-result list-group-item")

               .data("geometry", featureGeometry(element))
               .data("geometry", featureGeometry(element))

-              .appendTo($ul);
-            var $p = $("<p>")

               .text(featurePrefix(element) + " ")
               .text(featurePrefix(element) + " ")

-              .appendTo($li);
+              .appendTo($ul);

 
             $("<a>")
               .attr("href", "/" + element.type + "/" + element.id)
               .text(featureName(element))
 
             $("<a>")
               .attr("href", "/" + element.type + "/" + element.id)
               .text(featureName(element))

-              .appendTo($p);
+              .appendTo($li);

           }
         }
 
           }
         }
 

diff --git a/app/assets/stylesheets/_bootstrap-custom.scss b/app/assets/stylesheets/_bootstrap-custom.scss
index 96d37415f33054d54b3615d9c3342106b1a75659..c07fc2d07e47080dc140aac6ed4d3cffc1afd339 100644 (file)
--- a/app/assets/stylesheets/_bootstrap-custom.scss
+++ b/app/assets/stylesheets/_bootstrap-custom.scss
@@ -32,7 +32,7 @@
 @import "bootstrap/alert";
 // @import "bootstrap/progress";
 // @import "bootstrap/media";
 @import "bootstrap/alert";
 // @import "bootstrap/progress";
 // @import "bootstrap/media";

-// @import "bootstrap/list-group";
+@import "bootstrap/list-group";

 // @import "bootstrap/close";
 // @import "bootstrap/toasts";
 // @import "bootstrap/modal";
 // @import "bootstrap/close";
 // @import "bootstrap/toasts";
 // @import "bootstrap/modal";

diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
index 3d013339df6e6d370247192d84ad93fcf9bb13bb..68fc8702cafe2177c82fef216bc76c399d4d931b 100644 (file)
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@ -1277,17 +1277,10 @@ tr.turn:hover {
 
   .query-results {
     display: none;
 
   .query-results {
     display: none;

-
-    h3 {
-      padding: $lineheight $lineheight $lineheight/2;
-      margin: 0;
-    }
+    padding: 0 $lineheight $lineheight/2;

 
     ul {
       li {
 
     ul {
       li {

-        padding: 15px 20px;
-        border-bottom: 1px solid $grey;
-

         &.query-result {
           cursor: pointer;
         }
         &.query-result {
           cursor: pointer;
         }

diff --git a/app/views/browse/query.html.erb b/app/views/browse/query.html.erb
index ea40a00dbcf7ee91189efd95447bf3edbe0b0034..ad6fdddb53e360068c1c598c3ed30299f3b505ea 100644 (file)
--- a/app/views/browse/query.html.erb
+++ b/app/views/browse/query.html.erb
@@ -12,11 +12,15 @@
 <div id="query-nearby" class="query-results">
   <h3><%= t(".nearby") %></h3>
   <%= image_tag "searching.gif", :class => "loader" %>
 <div id="query-nearby" class="query-results">
   <h3><%= t(".nearby") %></h3>
   <%= image_tag "searching.gif", :class => "loader" %>

-  <ul class="query-results-list"></ul>
+  <div>
+    <ul class="query-results-list list-group list-group-flush"></ul>
+  </div>

 </div>
 
 <div id="query-isin" class="query-results">
   <h3><%= t(".enclosing") %></h3>
   <%= image_tag "searching.gif", :class => "loader" %>
 </div>
 
 <div id="query-isin" class="query-results">
   <h3><%= t(".enclosing") %></h3>
   <%= image_tag "searching.gif", :class => "loader" %>

-  <ul class="query-results-list"></ul>
+  <div>
+    <ul class="query-results-list list-group list-group-flush"></ul>
+  </div>

 </div>
 </div>