Merge remote-tracking branch 'upstream/pull/2452'

Gemfile

@@ -43,6 +43,7 @@ gem "image_optim_rails"
 gem "actionpack-page_caching", ">= 1.2.0"
 gem "active_record_union"
 gem "activerecord-import"
+gem "bootstrap", "~> 4.3.1"
 gem "cancancan"
 gem "composite_primary_keys", "~> 12.0.0"
 gem "config"

Gemfile.lock

@@ -106,6 +106,10 @@ GEM
       debug_inspector (>= 0.0.1)
     bootsnap (1.4.5)
       msgpack (~> 1.0)
+    bootstrap (4.3.1)
+      autoprefixer-rails (>= 9.1.0)
+      popper_js (>= 1.14.3, < 2)
+      sassc-rails (>= 2.0.0)
     browser (2.7.1)
     builder (3.2.4)
     bzip2-ffi (1.0.0)
@@ -319,6 +323,7 @@ GEM
       capybara (>= 2.1, < 4)
       cliver (~> 0.3.1)
       websocket-driver (>= 0.2.0)
+    popper_js (1.14.5)
     progress (3.5.2)
     psych (3.1.0)
     public_suffix (4.0.1)
@@ -466,6 +471,7 @@ DEPENDENCIES
   bigdecimal (~> 1.1.0)
   binding_of_caller
   bootsnap (>= 1.4.2)
+  bootstrap (~> 4.3.1)
   browser
   bzip2-ffi
   cancancan

app/assets/stylesheets/_bootstrap-custom.scss

@@ -0,0 +1,44 @@
+/*!
+ * Bootstrap v4.3.1 (https://getbootstrap.com/)
+ * Copyright 2011-2019 The Bootstrap Authors
+ * Copyright 2011-2019 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ */
+
+@import "bootstrap/functions";
+@import "bootstrap/variables";
+@import "bootstrap/mixins";
+@import "bootstrap/root";
+@import "bootstrap/reboot";
+@import "bootstrap/type";
+// @import "bootstrap/images";
+// @import "bootstrap/code";
+// @import "bootstrap/grid";
+// @import "bootstrap/tables";
+// @import "bootstrap/forms";
+// @import "bootstrap/buttons";
+// @import "bootstrap/transitions";
+// @import "bootstrap/dropdown";
+// @import "bootstrap/button-group";
+// @import "bootstrap/input-group";
+// @import "bootstrap/custom-forms";
+// @import "bootstrap/nav";
+// @import "bootstrap/navbar";
+@import "bootstrap/card";
+// @import "bootstrap/breadcrumb";
+// @import "bootstrap/pagination";
+// @import "bootstrap/badge";
+// @import "bootstrap/jumbotron";
+// @import "bootstrap/alert";
+// @import "bootstrap/progress";
+// @import "bootstrap/media";
+// @import "bootstrap/list-group";
+// @import "bootstrap/close";
+// @import "bootstrap/toasts";
+// @import "bootstrap/modal";
+// @import "bootstrap/tooltip";
+// @import "bootstrap/popover";
+// @import "bootstrap/carousel";
+// @import "bootstrap/spinners";
+@import "bootstrap/utilities";
+// @import "bootstrap/print";

app/assets/stylesheets/common.scss

@@ -1,4 +1,5 @@
 @import "parameters";
+@import "bootstrap-custom";
 
 /* Styles common to large and small screens */
 
@@ -108,23 +109,6 @@ body {
   height: 100%;
 }
 
-h1, h2, h3 {
-  font-weight: 600;
-  line-height: 1.2;
-}
-
-h4, h5 {
-  font-weight: 500;
-}
-
-h1 {
-  font-size: 18px;
-}
-
-h2, h3 {
-  font-size: 16px;
-}
-
 p > img {
   width: auto;
   max-width: 100%;
@@ -280,12 +264,19 @@ header {
   }
 
   h1 {
+    font-size: 18px;
+    font-weight: 600;
+    line-height: 1.2;
     margin: 0;
     padding-top: 15px;
 
     a {
       color: #000;
     }
+
+    a:hover {
+      color: #000;
+    }
   }
 }
 

app/assets/stylesheets/screen-ltr.css

@@ -1,5 +1,5 @@
 /*
  *= require ltr/common
- *= require bootstrap
+ *= require bootstrap-tooltips
  *= require ltr/small
  */

app/assets/stylesheets/screen-rtl.css

@@ -1,5 +1,5 @@
 /*
  *= require rtl/common
- *= require bootstrap
+ *= require bootstrap-tooltips
  *= require rtl/small
  */

app/views/site/help.html.erb

@@ -4,15 +4,29 @@
 
 <p class='introduction'><%= t ".introduction" %></p>
 
-<% %w[welcome beginners_guide help mailing_lists forums irc switch2osm welcomemat wiki].each do |site| %>
+<% sites = %w[beginners_guide help mailing_lists forums irc switch2osm welcomemat wiki] %>
-  <% unless site == 'welcome' && !current_user %>
+<% sites.prepend("welcome") if current_user %>
-  <div class='<%= site %> help-item'>
+
-  <h3>
+<% sites.in_groups_of(3, false) do |group| %>
+  <div class="card-deck mb-4">
+    <% group.each do |site| %>
+      <div class='<%= site %> help-item card w-25'>
+        <div class='card-body'>
+          <h6 class='card-title'>
             <a href='<%= t ".#{site}.url" %>'>
               <%= t ".#{site}.title" %>
             </a>
           </h3>
-  <p><%= t ".#{site}.description" %></p>
+          <p class='card-text'><%= t ".#{site}.description" %></p>
+        </div>
+        <div class="card-footer">
+          <small>
+            <a href='<%= t ".#{site}.url" %>'>
+              <%= t ".#{site}.url" %>
+            </a>
+          </small>
+        </div>
       </div>
     <% end %>
+  </div>
 <% end %>