Refactor the fixthemap page to use the bootstrap responsive grid
authorAndy Allan <git@gravitystorm.co.uk>
Wed, 8 Jan 2020 15:27:39 +0000 (16:27 +0100)
committerAndy Allan <git@gravitystorm.co.uk>
Wed, 8 Jan 2020 15:27:39 +0000 (16:27 +0100)
This ensures that on small screens, the 'how to help' sections
are one above the other, and on larger screens they are side-by-side

app/assets/stylesheets/_bootstrap-custom.scss
app/views/site/fixthemap.html.erb

index 96d37415f33054d54b3615d9c3342106b1a75659..689d7ee985660c8b410bc82261129cbf672a2d5c 100644 (file)
@@ -13,7 +13,7 @@
 @import "bootstrap/type";
 // @import "bootstrap/images";
 // @import "bootstrap/code";
-// @import "bootstrap/grid";
+@import "bootstrap/grid";
 // @import "bootstrap/tables";
 // @import "bootstrap/forms";
 // @import "bootstrap/buttons";
index 4bb478c7e416e8bf6f1d65ae079dafc409fb6d1e..7077d74cbb984f852c6a0a9e3f6ea88aa8241db5 100644 (file)
@@ -7,31 +7,30 @@
 <% end %>
 
 <h3><%= t "layouts.intro_header" %></h3>
-
 <p><%= t "layouts.intro_text" %></p>
 
 <h3><%= t ".how_to_help.title" %></h3>
 
-<div class='clearfix'>
-  <div class='col6 inner11'>
-    <h3><%= t ".how_to_help.join_the_community.title" %></h3>
-    <%= t ".how_to_help.join_the_community.explanation_html" %>
-    <div class='clearfix center'>
-      <a class="button sign-up" href="<%= user_new_path %>"><%= t("layouts.start_mapping") %></a>
+<div class='container'>
+  <div class='row' %>
+    <div class='col-sm'>
+      <h5><%= t ".how_to_help.join_the_community.title" %></h3>
+      <p><%= t ".how_to_help.join_the_community.explanation_html" %></p>
+      <p class='text-center'>
+        <a class="button sign-up" href="<%= user_new_path %>"><%= t("layouts.start_mapping") %></a>
+      </p>
+    </div>
+    <div class='col-sm'>
+      <h5><%= t "site.welcome.add_a_note.title" %></h3>
+      <p><%= t "site.welcome.add_a_note.paragraph_1_html" %></p>
+      <p><%= t ".how_to_help.add_a_note.instructions_html", :map_url => root_path %></p>
     </div>
-  </div>
-  <div class='col6 inner11'>
-    <h3><%= t "site.welcome.add_a_note.title" %></h3>
-    <p><%= t "site.welcome.add_a_note.paragraph_1_html" %></p>
-    <p><%= t ".how_to_help.add_a_note.instructions_html", :map_url => root_path %></p>
   </div>
 </div>
 
 <h3><%= t ".other_concerns.title" %></h3>
 <p><%= t ".other_concerns.explanation_html" %></p>
 
-<div class='col12 clearfix icon-list'>
-  <h3><%= t "site.welcome.questions.title" %></h3>
-  <span class='sprite small term question'></span>
-  <p><%= t "site.welcome.questions.paragraph_1_html", :help_url => help_path %></p>
-</div>
+<h3><%= t "site.welcome.questions.title" %></h3>
+<span class='sprite small term question'></span>
+<p><%= t "site.welcome.questions.paragraph_1_html", :help_url => help_path %></p>