Replace CSS-driven borders with bootstrap borders

This makes future refactoring easier, since the elements will
retain their borders even if the hierarchy changes.

Also round some maps and the legale section since I think those now
look nicer.

diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
index 58642dd55fd7b31bd4fbf41a6a12bbe20c9def8b..b0016a3fbf4c883b65e4eb0b82d556f8d8352ee0 100644 (file)
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@ -79,6 +79,16 @@ a {
   color: $blue;
 }
 
+/* Rules for borders */
+/* These add additional colours to those provided by bootstrap */
+.border-grey {
+  border-color: $grey !important;
+}
+
+.border-lightgrey {
+  border-color: $lightgrey !important;
+}
+
 /* Rules for the header */
 
 #menu-icon {
@@ -802,11 +812,6 @@ tr.turn:hover {
     border-bottom: none;
   }
 
-  .paginate {
-    border: 1px solid $lightgrey;
-    border-radius: 3px;
-  }
-
   .browse-field {
     margin-bottom: 10px;
 
@@ -830,8 +835,6 @@ tr.turn:hover {
 
   .browse-tag-list {
     background-color: $offwhite;
-    border: 1px solid $grey;
-    border-radius: 3px;
     table-layout: fixed;
     border-collapse: separate;
     border-spacing: 0;
@@ -954,8 +957,6 @@ tr.turn:hover {
 
   .export_boxy {
     background: $lightgrey;
-    border: 1px solid $grey;
-    border-radius: 3px;
 
     #maxlat { margin-top: -1px; }
     #minlon {
@@ -1063,7 +1064,6 @@ tr.turn:hover {
 
 .content_map {
   height: 200px;
-  border: 1px solid $grey;
   margin-bottom: $lineheight;
 }
 
@@ -1132,7 +1132,6 @@ tr.turn:hover {
 .diary_entries {
   #map {
     height: 400px;
-    border: 1px solid $grey;
     display: none;
     margin-bottom: $lineheight;
   }
@@ -1180,7 +1179,6 @@ tr.turn:hover {
 
 .users-terms {
   .legale {
-    border: 1px solid $grey;
     padding: $lineheight;
     margin-bottom: $lineheight;
     overflow: auto;
@@ -1378,13 +1376,11 @@ tr.turn:hover {
 img.user_image {
   max-width: 100px;
   max-height: 100px;
-  border: 1px solid $grey;
 }
 
 img.user_thumbnail {
   max-width: 50px;
   max-height: 50px;
-  border: 1px solid $grey;
 }
 
 img.user_thumbnail_tiny {
@@ -1392,7 +1388,6 @@ img.user_thumbnail_tiny {
   height: auto;
   max-width: 25px;
   max-height: 25px;
-  border: 1px solid $grey;
 }
 
 /* Rules for geo microformats */

diff --git a/app/helpers/user_helper.rb b/app/helpers/user_helper.rb
index eed55cd9d9a722d00a56dea6a7ee5073a582430a..a6161fa4365e1911b8799adca2071be73c834cfe 100644 (file)
--- a/app/helpers/user_helper.rb
+++ b/app/helpers/user_helper.rb
@@ -2,7 +2,7 @@ module UserHelper
   # User images
 
   def user_image(user, options = {})
-    options[:class] ||= "user_image"
+    options[:class] ||= "user_image border border-grey"
     options[:alt] ||= ""
 
     if user.image_use_gravatar
@@ -15,7 +15,7 @@ module UserHelper
   end
 
   def user_thumbnail(user, options = {})
-    options[:class] ||= "user_thumbnail"
+    options[:class] ||= "user_thumbnail border border-grey"
     options[:alt] ||= ""
 
     if user.image_use_gravatar
@@ -28,7 +28,7 @@ module UserHelper
   end
 
   def user_thumbnail_tiny(user, options = {})
-    options[:class] ||= "user_thumbnail_tiny"
+    options[:class] ||= "user_thumbnail_tiny border border-grey"
     options[:alt] ||= ""
 
     if user.image_use_gravatar

diff --git a/app/views/browse/_paging_nav.html.erb b/app/views/browse/_paging_nav.html.erb
index 713a1d6d4ecf5734c999f2df4786ef19a471b169..e13b1a9b85e84abe2e3efcf27e2ad9dfd93a4e26 100644 (file)
--- a/app/views/browse/_paging_nav.html.erb
+++ b/app/views/browse/_paging_nav.html.erb
@@ -5,7 +5,7 @@
   <% if pages.page_count > 1 %>
     <div class="col-auto">
       <h4>
-        <span class="paginate p-1">
+        <span class="border border-lightgrey rounded p-1">
           <%= raw pagination_links_each(pages, {}) { |n| link_to(n, page_param => n) } %>
         </span>
       </h4>

diff --git a/app/views/browse/_tag_details.html.erb b/app/views/browse/_tag_details.html.erb
index 0e1a3fbef17934319b3a2cecac941f648431d2c1..0868bb8e59e279e1af10193bfb1a9d77365df271 100644 (file)
--- a/app/views/browse/_tag_details.html.erb
+++ b/app/views/browse/_tag_details.html.erb
@@ -1,6 +1,6 @@
 <% unless tag_details.empty? %>
   <h4><%= t ".tags" %></h4>
-  <table class='browse-tag-list'>
+  <table class='browse-tag-list border border-grey rounded'>
     <%= render :partial => "tag", :collection => tag_details.sort %>
   </table>
 <% end %>

diff --git a/app/views/dashboards/show.html.erb b/app/views/dashboards/show.html.erb
index 0f04dafb912b9143ac9fdef4560ca0b08b6b1756..d0344ce79bd61a7c773994328dcc915bf3cc8656 100644 (file)
--- a/app/views/dashboards/show.html.erb
+++ b/app/views/dashboards/show.html.erb
@@ -6,7 +6,7 @@
   <% if current_user and @user.id == current_user.id %>
     <div class="col-md order-md-last">
       <% if @user.home_lat.nil? or @user.home_lon.nil? %>
-        <div id="map" class="content_map">
+        <div id="map" class="content_map border border-grey">
           <p class="m-3"><%= t(".no_home_location_html", :edit_profile_link => link_to(t(".edit_your_profile"), edit_profile_path)) %></p>
         </div>
       <% else %>
@@ -19,7 +19,7 @@
              :icon => image_path("marker-red.png"),
              :description => render(:partial => "popup", :object => current_user, :locals => { :type => "your location" })
            } %>
-        <%= tag.div "", :id => "map", :class => "content_map", :data => { :user => user_data } %>
+        <%= tag.div "", :id => "map", :class => "content_map border border-grey rounded", :data => { :user => user_data } %>
       <% end %>
 
       <% friends = @user.friends %>

diff --git a/app/views/diary_entries/_form.html.erb b/app/views/diary_entries/_form.html.erb
index ed7164e88b1f4d89830dad9756094ba943a1f20f..f72abc19e32c472a77e8e23d51f6184e5788cdb0 100644 (file)
--- a/app/views/diary_entries/_form.html.erb
+++ b/app/views/diary_entries/_form.html.erb
@@ -5,7 +5,7 @@
 <fieldset>
   <legend><%= t ".location" -%></legend>
 
-  <%= tag.div "", :id => "map", :data => { :lat => @lat, :lon => @lon, :zoom => @zoom } %>
+  <%= tag.div "", :id => "map", :class => "border border-grey rounded", :data => { :lat => @lat, :lon => @lon, :zoom => @zoom } %>
 
   <div class="form-row">
     <%= f.text_field :latitude, :wrapper_class => "col-sm-4", :id => "latitude" %>

diff --git a/app/views/profiles/edit.html.erb b/app/views/profiles/edit.html.erb
index 8eca6f4f7ca24d26090fac6b5d519143aa06ad19..c57f98a044d534a44bd87399ccd116288466ce71 100644 (file)
--- a/app/views/profiles/edit.html.erb
+++ b/app/views/profiles/edit.html.erb
@@ -53,7 +53,7 @@
       <input class="form-check-input" type="checkbox" name="updatehome" value="1" <% unless current_user.home_lat and current_user.home_lon %> checked="checked" <% end %> id="updatehome" />
       <label class="form-check-label" for="updatehome"><%= t ".update home location on click" %></label>
     </div>
-    <%= tag.div "", :id => "map", :class => "content_map set_location" %>
+    <%= tag.div "", :id => "map", :class => "content_map set_location border border-grey rounded" %>
   </fieldset>
 
   <%= f.primary t(".save") %>

diff --git a/app/views/site/export.html.erb b/app/views/site/export.html.erb
index e612ff1af536d12855cea6ca6de985907576e599..b3a3bd0e9596ece4dc5ff3336d340ddf255b1662 100644 (file)
--- a/app/views/site/export.html.erb
+++ b/app/views/site/export.html.erb
@@ -6,7 +6,7 @@
   <%= hidden_field_tag "format", "osm", :autocomplete => "off" %>
 
   <div class='export_area_inputs'>
-    <div class='export_boxy'>
+    <div class='export_boxy border border-grey rounded'>
       <%= text_field_tag("maxlat", nil, :size => 10, :autocomplete => "off", :class => "export_bound form-control mx-auto") %>
       <div class="clearfix">
         <%= text_field_tag("minlon", nil, :size => 10, :autocomplete => "off", :class => "export_bound form-control") %>

diff --git a/app/views/users/terms.html.erb b/app/views/users/terms.html.erb
index 05cf62e3e67038d2572a3d836c721d25bbb19aac..58bddaca5fcee2ff82796486908db0bb8e14b1c7 100644 (file)
--- a/app/views/users/terms.html.erb
+++ b/app/views/users/terms.html.erb
@@ -30,7 +30,7 @@
     <% end %>
   </div>
 
-  <div id="contributorTerms" class="legale">
+  <div id="contributorTerms" class="legale border border-grey rounded">
     <%= render :partial => "terms" %>
   </div>
 

diff --git a/test/helpers/user_helper_test.rb b/test/helpers/user_helper_test.rb
index 8cef4d2dc570512340f50500801eb0d030e33dfb..11a47a19557db39ce683dc707234acb1cf98dec7 100644 (file)
--- a/test/helpers/user_helper_test.rb
+++ b/test/helpers/user_helper_test.rb
@@ -8,12 +8,12 @@ class UserHelperTest < ActionView::TestCase
     gravatar_user = create(:user, :image_use_gravatar => true)
 
     image = user_image(user)
-    assert_match %r{^<img class="user_image" .* src="/images/avatar_large.png" />$}, image
+    assert_match %r{^<img class="user_image border border-grey" .* src="/images/avatar_large.png" />$}, image
 
     image = user_image(user, :class => "foo")
     assert_match %r{^<img class="foo" .* src="/images/avatar_large.png" />$}, image
     image = user_image(gravatar_user)
-    assert_match %r{^<img class="user_image" .* src="http://www.gravatar.com/avatar/.*" />$}, image
+    assert_match %r{^<img class="user_image border border-grey" .* src="http://www.gravatar.com/avatar/.*" />$}, image
 
     image = user_image(gravatar_user, :class => "foo")
     assert_match %r{^<img class="foo" .* src="http://www.gravatar.com/avatar/.*" />$}, image
@@ -24,13 +24,13 @@ class UserHelperTest < ActionView::TestCase
     gravatar_user = create(:user, :image_use_gravatar => true)
 
     image = user_thumbnail(user)
-    assert_match %r{^<img class="user_thumbnail" .* src="/images/avatar_small.png" />$}, image
+    assert_match %r{^<img class="user_thumbnail border border-grey" .* src="/images/avatar_small.png" />$}, image
 
     image = user_thumbnail(user, :class => "foo")
     assert_match %r{^<img class="foo" .* src="/images/avatar_small.png" />$}, image
 
     image = user_thumbnail(gravatar_user)
-    assert_match %r{^<img class="user_thumbnail" .* src="http://www.gravatar.com/avatar/.*" />$}, image
+    assert_match %r{^<img class="user_thumbnail border border-grey" .* src="http://www.gravatar.com/avatar/.*" />$}, image
 
     image = user_thumbnail(gravatar_user, :class => "foo")
     assert_match %r{^<img class="foo" .* src="http://www.gravatar.com/avatar/.*" />$}, image
@@ -41,13 +41,13 @@ class UserHelperTest < ActionView::TestCase
     gravatar_user = create(:user, :image_use_gravatar => true)
 
     image = user_thumbnail_tiny(user)
-    assert_match %r{^<img class="user_thumbnail_tiny" .* src="/images/avatar_small.png" />$}, image
+    assert_match %r{^<img class="user_thumbnail_tiny border border-grey" .* src="/images/avatar_small.png" />$}, image
 
     image = user_thumbnail_tiny(user, :class => "foo")
     assert_match %r{^<img class="foo" .* src="/images/avatar_small.png" />$}, image
 
     image = user_thumbnail_tiny(gravatar_user)
-    assert_match %r{^<img class="user_thumbnail_tiny" .* src="http://www.gravatar.com/avatar/.*" />$}, image
+    assert_match %r{^<img class="user_thumbnail_tiny border border-grey" .* src="http://www.gravatar.com/avatar/.*" />$}, image
 
     image = user_thumbnail_tiny(gravatar_user, :class => "foo")
     assert_match %r{^<img class="foo" .* src="http://www.gravatar.com/avatar/.*" />$}, image