]> git.openstreetmap.org Git - rails.git/commitdiff
Replace CSS-driven borders with bootstrap borders
authorAndy Allan <git@gravitystorm.co.uk>
Wed, 17 Nov 2021 17:33:14 +0000 (17:33 +0000)
committerAndy Allan <git@gravitystorm.co.uk>
Wed, 24 Nov 2021 12:24:16 +0000 (12:24 +0000)
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.

app/assets/stylesheets/common.scss
app/helpers/user_helper.rb
app/views/browse/_paging_nav.html.erb
app/views/browse/_tag_details.html.erb
app/views/dashboards/show.html.erb
app/views/diary_entries/_form.html.erb
app/views/profiles/edit.html.erb
app/views/site/export.html.erb
app/views/users/terms.html.erb
test/helpers/user_helper_test.rb

index 58642dd55fd7b31bd4fbf41a6a12bbe20c9def8b..b0016a3fbf4c883b65e4eb0b82d556f8d8352ee0 100644 (file)
@@ -79,6 +79,16 @@ a {
   color: $blue;
 }
 
   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 {
 /* Rules for the header */
 
 #menu-icon {
@@ -802,11 +812,6 @@ tr.turn:hover {
     border-bottom: none;
   }
 
     border-bottom: none;
   }
 
-  .paginate {
-    border: 1px solid $lightgrey;
-    border-radius: 3px;
-  }
-
   .browse-field {
     margin-bottom: 10px;
 
   .browse-field {
     margin-bottom: 10px;
 
@@ -830,8 +835,6 @@ tr.turn:hover {
 
   .browse-tag-list {
     background-color: $offwhite;
 
   .browse-tag-list {
     background-color: $offwhite;
-    border: 1px solid $grey;
-    border-radius: 3px;
     table-layout: fixed;
     border-collapse: separate;
     border-spacing: 0;
     table-layout: fixed;
     border-collapse: separate;
     border-spacing: 0;
@@ -954,8 +957,6 @@ tr.turn:hover {
 
   .export_boxy {
     background: $lightgrey;
 
   .export_boxy {
     background: $lightgrey;
-    border: 1px solid $grey;
-    border-radius: 3px;
 
     #maxlat { margin-top: -1px; }
     #minlon {
 
     #maxlat { margin-top: -1px; }
     #minlon {
@@ -1063,7 +1064,6 @@ tr.turn:hover {
 
 .content_map {
   height: 200px;
 
 .content_map {
   height: 200px;
-  border: 1px solid $grey;
   margin-bottom: $lineheight;
 }
 
   margin-bottom: $lineheight;
 }
 
@@ -1132,7 +1132,6 @@ tr.turn:hover {
 .diary_entries {
   #map {
     height: 400px;
 .diary_entries {
   #map {
     height: 400px;
-    border: 1px solid $grey;
     display: none;
     margin-bottom: $lineheight;
   }
     display: none;
     margin-bottom: $lineheight;
   }
@@ -1180,7 +1179,6 @@ tr.turn:hover {
 
 .users-terms {
   .legale {
 
 .users-terms {
   .legale {
-    border: 1px solid $grey;
     padding: $lineheight;
     margin-bottom: $lineheight;
     overflow: auto;
     padding: $lineheight;
     margin-bottom: $lineheight;
     overflow: auto;
@@ -1378,13 +1376,11 @@ tr.turn:hover {
 img.user_image {
   max-width: 100px;
   max-height: 100px;
 img.user_image {
   max-width: 100px;
   max-height: 100px;
-  border: 1px solid $grey;
 }
 
 img.user_thumbnail {
   max-width: 50px;
   max-height: 50px;
 }
 
 img.user_thumbnail {
   max-width: 50px;
   max-height: 50px;
-  border: 1px solid $grey;
 }
 
 img.user_thumbnail_tiny {
 }
 
 img.user_thumbnail_tiny {
@@ -1392,7 +1388,6 @@ img.user_thumbnail_tiny {
   height: auto;
   max-width: 25px;
   max-height: 25px;
   height: auto;
   max-width: 25px;
   max-height: 25px;
-  border: 1px solid $grey;
 }
 
 /* Rules for geo microformats */
 }
 
 /* Rules for geo microformats */
index eed55cd9d9a722d00a56dea6a7ee5073a582430a..a6161fa4365e1911b8799adca2071be73c834cfe 100644 (file)
@@ -2,7 +2,7 @@ module UserHelper
   # User images
 
   def user_image(user, options = {})
   # 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
     options[:alt] ||= ""
 
     if user.image_use_gravatar
@@ -15,7 +15,7 @@ module UserHelper
   end
 
   def user_thumbnail(user, options = {})
   end
 
   def user_thumbnail(user, options = {})
-    options[:class] ||= "user_thumbnail"
+    options[:class] ||= "user_thumbnail border border-grey"
     options[:alt] ||= ""
 
     if user.image_use_gravatar
     options[:alt] ||= ""
 
     if user.image_use_gravatar
@@ -28,7 +28,7 @@ module UserHelper
   end
 
   def user_thumbnail_tiny(user, options = {})
   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
     options[:alt] ||= ""
 
     if user.image_use_gravatar
index 713a1d6d4ecf5734c999f2df4786ef19a471b169..e13b1a9b85e84abe2e3efcf27e2ad9dfd93a4e26 100644 (file)
@@ -5,7 +5,7 @@
   <% if pages.page_count > 1 %>
     <div class="col-auto">
       <h4>
   <% 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>
           <%= raw pagination_links_each(pages, {}) { |n| link_to(n, page_param => n) } %>
         </span>
       </h4>
index 0e1a3fbef17934319b3a2cecac941f648431d2c1..0868bb8e59e279e1af10193bfb1a9d77365df271 100644 (file)
@@ -1,6 +1,6 @@
 <% unless tag_details.empty? %>
   <h4><%= t ".tags" %></h4>
 <% 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 %>
     <%= render :partial => "tag", :collection => tag_details.sort %>
   </table>
 <% end %>
index 0f04dafb912b9143ac9fdef4560ca0b08b6b1756..d0344ce79bd61a7c773994328dcc915bf3cc8656 100644 (file)
@@ -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? %>
   <% 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 %>
           <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" })
            } %>
              :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 %>
       <% end %>
 
       <% friends = @user.friends %>
index ed7164e88b1f4d89830dad9756094ba943a1f20f..f72abc19e32c472a77e8e23d51f6184e5788cdb0 100644 (file)
@@ -5,7 +5,7 @@
 <fieldset>
   <legend><%= t ".location" -%></legend>
 
 <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" %>
 
   <div class="form-row">
     <%= f.text_field :latitude, :wrapper_class => "col-sm-4", :id => "latitude" %>
index 8eca6f4f7ca24d26090fac6b5d519143aa06ad19..c57f98a044d534a44bd87399ccd116288466ce71 100644 (file)
@@ -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>
       <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") %>
   </fieldset>
 
   <%= f.primary t(".save") %>
index e612ff1af536d12855cea6ca6de985907576e599..b3a3bd0e9596ece4dc5ff3336d340ddf255b1662 100644 (file)
@@ -6,7 +6,7 @@
   <%= hidden_field_tag "format", "osm", :autocomplete => "off" %>
 
   <div class='export_area_inputs'>
   <%= 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") %>
       <%= 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") %>
index 05cf62e3e67038d2572a3d836c721d25bbb19aac..58bddaca5fcee2ff82796486908db0bb8e14b1c7 100644 (file)
@@ -30,7 +30,7 @@
     <% end %>
   </div>
 
     <% end %>
   </div>
 
-  <div id="contributorTerms" class="legale">
+  <div id="contributorTerms" class="legale border border-grey rounded">
     <%= render :partial => "terms" %>
   </div>
 
     <%= render :partial => "terms" %>
   </div>
 
index 8cef4d2dc570512340f50500801eb0d030e33dfb..11a47a19557db39ce683dc707234acb1cf98dec7 100644 (file)
@@ -8,12 +8,12 @@ class UserHelperTest < ActionView::TestCase
     gravatar_user = create(:user, :image_use_gravatar => true)
 
     image = user_image(user)
     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)
 
     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
 
     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)
     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)
 
     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
 
     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)
     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)
 
     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
 
     image = user_thumbnail_tiny(gravatar_user, :class => "foo")
     assert_match %r{^<img class="foo" .* src="http://www.gravatar.com/avatar/.*" />$}, image