From dc96834ebbcad04b3e9dc25af16816c8c72d3121 Mon Sep 17 00:00:00 2001
From: Andy Allan <git@gravitystorm.co.uk>
Date: Wed, 4 Dec 2019 15:26:13 +0100
Subject: [PATCH] Use bootstrap cards to spruce up the help page

---
 app/assets/stylesheets/_bootstrap-custom.scss | 10 +++---
 app/views/site/help.html.erb                  | 34 +++++++++++++------
 2 files changed, 29 insertions(+), 15 deletions(-)

diff --git a/app/assets/stylesheets/_bootstrap-custom.scss b/app/assets/stylesheets/_bootstrap-custom.scss
index 399dfb77c..88056f5e7 100644
--- a/app/assets/stylesheets/_bootstrap-custom.scss
+++ b/app/assets/stylesheets/_bootstrap-custom.scss
@@ -5,9 +5,9 @@
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
  */
 
-// @import "bootstrap/functions";
-// @import "bootstrap/variables";
-// @import "bootstrap/mixins";
+@import "bootstrap/functions";
+@import "bootstrap/variables";
+@import "bootstrap/mixins";
 // @import "bootstrap/root";
 // @import "bootstrap/reboot";
 // @import "bootstrap/type";
@@ -24,7 +24,7 @@
 // @import "bootstrap/custom-forms";
 // @import "bootstrap/nav";
 // @import "bootstrap/navbar";
-// @import "bootstrap/card";
+@import "bootstrap/card";
 // @import "bootstrap/breadcrumb";
 // @import "bootstrap/pagination";
 // @import "bootstrap/badge";
@@ -40,5 +40,5 @@
 // @import "bootstrap/popover";
 // @import "bootstrap/carousel";
 // @import "bootstrap/spinners";
-// @import "bootstrap/utilities";
+@import "bootstrap/utilities";
 // @import "bootstrap/print";
diff --git a/app/views/site/help.html.erb b/app/views/site/help.html.erb
index dcb8142bd..88cc3f58e 100644
--- a/app/views/site/help.html.erb
+++ b/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| %>
-  <% unless site == 'welcome' && !current_user %>
-  <div class='<%= site %> help-item'>
-  <h3>
-    <a href='<%= t ".#{site}.url" %>'>
-      <%= t ".#{site}.title" %>
-    </a>
-  </h3>
-  <p><%= t ".#{site}.description" %></p>
+<% sites = %w[beginners_guide help mailing_lists forums irc switch2osm welcomemat wiki] %>
+<% sites.prepend("welcome") if current_user %>
+
+<% 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 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 %>
 <% end %>
-- 
2.45.1