From 1642420990b7ac94af8544cbc1fca8ba2ae44ca2 Mon Sep 17 00:00:00 2001
From: Jesse Morgan <jesse@jesterpm.net>
Date: Sat, 15 Dec 2018 18:21:29 -0800
Subject: Add contact group link

---
 src/SearchFilters.css |  5 ++++-
 src/SearchFilters.js  |  4 ++--
 src/SearchResults.css |  8 +++++---
 src/SearchResults.js  |  3 +++
 src/index.css         | 35 ++++++++++++++++++++++++++++++++++-
 5 files changed, 48 insertions(+), 7 deletions(-)

diff --git a/src/SearchFilters.css b/src/SearchFilters.css
index d757bf6..2123b07 100644
--- a/src/SearchFilters.css
+++ b/src/SearchFilters.css
@@ -5,9 +5,12 @@
 }
 
 .Filter label {
-    font-weight: bold;
     display: block;
+    font-size: 14px;
+    font-stretch: 100%;
+    font-weight: bold;
     margin-bottom: 5px;
+    text-transform: uppercase;
 }
 
 .Filter select {
diff --git a/src/SearchFilters.js b/src/SearchFilters.js
index d805225..a9fd9b0 100644
--- a/src/SearchFilters.js
+++ b/src/SearchFilters.js
@@ -52,8 +52,8 @@ class SearchFilters extends Component {
     return (
       <div className="SearchFilters">
         {filters}
-        <div>
-          <button onClick={this.props.onReset}>Reset</button>
+        <div style={{textAlign: 'center'}}>
+          <button className="btn" onClick={this.props.onReset}>Reset</button>
         </div>
       </div>
     );
diff --git a/src/SearchResults.css b/src/SearchResults.css
index ae05e10..fbf6605 100644
--- a/src/SearchResults.css
+++ b/src/SearchResults.css
@@ -41,12 +41,14 @@
 }
 
 .badge {
-  background: #aed3e5;
+  background-color: rgb(112, 112, 112);
+  color: white;
   font-size: 10pt;
-  border-radius: 4px;
+  border-radius: 3px;
   display: inline-block;
   margin: 0 0.5rem 5px 0;
-  padding: 2px 10px 2px 10px;
+  padding: 5px 15px 5px 15px;
+  text-transform: uppercase;
 }
 
 .label {
diff --git a/src/SearchResults.js b/src/SearchResults.js
index 68b4911..090f76d 100644
--- a/src/SearchResults.js
+++ b/src/SearchResults.js
@@ -51,6 +51,9 @@ class SearchResult extends Component {
           <p>
             <span className="label">Group Leader</span>: {this.props.data['leader-name']}{" "}
           </p>
+          <p>
+            <a className="btn" target="_new" href="https://myfoursquarechurch.ccbchurch.com/goto/forms/133/responses/new">Contact Group</a>
+          </p>
         </div>
       </div>
     );
diff --git a/src/index.css b/src/index.css
index b4cc725..136694b 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,5 +1,38 @@
 body {
   margin: 0;
   padding: 0;
-  font-family: sans-serif;
+  font-family: futura-pt;
+}
+
+.btn {
+  -moz-appearance: none;
+  background-color: rgba(0, 0, 0, 0);
+  border: solid 2px rgb(112, 112, 112);
+  border-radius: 3px;
+  color: rgb(112, 112, 112);
+  cursor: pointer;
+  display: inline-block;
+  font-size: 14px;
+  font-stretch: 100%;
+  font-style: normal;
+  font-weight: 700;
+  line-height: 14px;
+  margin: 0;
+  padding: 14px 35px;
+  text-align: center;
+  text-decoration: none;
+  text-transform: uppercase;
+  transition-delay: 0s, 0s;
+  transition-duration: 0.1s, 0.1s;
+  transition-property: background-color, color;
+  transition-timing-function: linear, linear;
+}
+
+.btn:hover {
+  background-color: rgb(112, 112, 112);
+  color: white;
+  transition-delay: 0s, 0s;
+  transition-duration: 0.1s, 0.1s;
+  transition-property: background-color, color;
+  transition-timing-function: linear, linear;
 }
-- 
cgit v1.2.3