From 75887519330ccbd9d494c1c8fa1fdedb69838c5a Mon Sep 17 00:00:00 2001
From: Jesse Szwedko <jesse.szwedko@gmail.com>
Date: Wed, 9 Aug 2017 13:34:22 -0700
Subject: [PATCH] Make program background button behave more like a normal
 button

Change from alert message to traditional button to get highlight and
rounded corner behavior. Also remove "Click here..." text.

Added word-wrap since the default bootstrap behavior is to not wrap text
for buttons, but we need this for buttons like this with longer text.
---
 app/assets/stylesheets/application.css   | 9 +++++----
 app/views/main/index.html.haml           | 4 ++--
 app/views/main/unauthenticated.html.haml | 2 +-
 config/locales/en.yml                    | 2 +-
 test/controllers/main_controller_test.rb | 2 +-
 5 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
index a470ffbc..7b072e46 100644
--- a/app/assets/stylesheets/application.css
+++ b/app/assets/stylesheets/application.css
@@ -156,6 +156,11 @@ h5.my-things {
   top: 210px;
 }
 
+.btn {
+  white-space: normal !important; /* override bootstrap to wrap button text */
+  word-wrap: break-word;
+}
+
 .btn-primary {
   color: #fff;
   background-color: #396B80;
@@ -222,10 +227,6 @@ a.guidelines {
   text-decoration: none;
 }
 
-.sidebar p#tagline:hover {
-  background-color: #9682bc;
-}
-
 .user-things dd {
   margin-left: 20px;
 }
diff --git a/app/views/main/index.html.haml b/app/views/main/index.html.haml
index 358e6720..079aad7f 100644
--- a/app/views/main/index.html.haml
+++ b/app/views/main/index.html.haml
@@ -18,7 +18,7 @@
               Last updated
               = local_date(Time.now, '%B %e, %Y')
           %a.guidelines{:href => "#guidelines", :"data-toggle" => "modal", :"data-target" => "#guidelines"}
-            %p.alert-message.block-message#tagline
+            %button.btn.btn-block.btn-primary#tagline
               = t("defaults.tagline")
         #content
           = render :partial => "layouts/flash", :locals => {:flash => flash}
@@ -32,7 +32,7 @@
         -# Corresponds to guideline div above
         %div.hidden.visible-xs-block
           %a.guidelines{:href => "#guidelines", :"data-toggle" => "modal", :"data-target" => "#guidelines"}
-            %p.alert-message.block-message#tagline
+            %button.btn.btn-block.btn-primary#tagline
               = t("defaults.tagline")
         #logos
           .row
diff --git a/app/views/main/unauthenticated.html.haml b/app/views/main/unauthenticated.html.haml
index 8f22f752..80774cda 100644
--- a/app/views/main/unauthenticated.html.haml
+++ b/app/views/main/unauthenticated.html.haml
@@ -3,7 +3,7 @@
     .table-cell.sidebar
       %h1
         = image_tag "logos/adopt-a-drain.png", :alt => t("titles.main", :thing => t("defaults.thing").titleize), :title => t("titles.main", :thing => t("defaults.thing").titleize)
-      %p.alert-message.block-message#tagline
+      %button.btn.btn-block.btn-primary#tagline
         = t("defaults.tagline")
       #content
         = render :partial => "sidebar/combo_form"
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 15222c8f..cb8f2a2d 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -37,7 +37,7 @@ en:
     thing: "drain"
     things: "drains"
     this_thing: "This %{thing}"
-    tagline: "What does it mean to adopt a drain? Click here to find out."
+    tagline: "What does it mean to adopt a drain?"
     tos: "By signing up, you agree to the %{tos}."
     voice_number: "415-555-1212"
     zip: "94015-2013"
diff --git a/test/controllers/main_controller_test.rb b/test/controllers/main_controller_test.rb
index a423a215..d71876a4 100644
--- a/test/controllers/main_controller_test.rb
+++ b/test/controllers/main_controller_test.rb
@@ -12,7 +12,7 @@ class MainControllerTest < ActionController::TestCase
     get :index
     assert_response :success
     assert_select 'title', 'Adopt-a-Drain San Francisco'
-    assert_select 'p#tagline', 'What does it mean to adopt a drain? Click here to find out.'
+    assert_select 'button#tagline', 'What does it mean to adopt a drain?'
   end
 
   test 'should show search form when signed in' do