From 5e53a79febc667088511881266cefcb863ae7f86 Mon Sep 17 00:00:00 2001
From: RujitRaval <rujitraval@gmail.com>
Date: Tue, 3 Mar 2020 12:41:40 -0500
Subject: [PATCH 1/3] Change style for building search page

---
 src/AddressSearch.js | 18 ++++++++++--------
 src/App.css          |  7 +------
 src/index.css        |  1 +
 3 files changed, 12 insertions(+), 14 deletions(-)

diff --git a/src/AddressSearch.js b/src/AddressSearch.js
index eed611c28..8ee9f4e15 100644
--- a/src/AddressSearch.js
+++ b/src/AddressSearch.js
@@ -286,14 +286,16 @@ export default class AddressSearch extends React.Component {
         <div className="addressSearchSubTitle">
           We'll use this information to determine if BlocPower is available in your area.
         </div>
-        <Row className="addressSearch text-center">
-          <Col xs="1" className="addressSearchIcon">
-            <img src={location} width="15px" className="text-center" alt="" style={{ filter: "invert(100%)" }} />
-          </Col>
-          <Col className="addressSearchInput" style={{ paddingLeft: '0px' }}>
-            {addressData}
-          </Col>
-        </Row>
+        <div style={{height: "auto"}}>
+          <Row className="addressSearch text-center">
+            <Col xs="1" className="addressSearchIcon">
+              <img src={location} width="15px" className="text-center" alt="" style={{ filter: "invert(100%)" }} />
+            </Col>
+            <Col className="addressSearchInput" style={{ paddingLeft: '0px' }}>
+              {addressData}
+            </Col>
+          </Row>
+        </div>
         <Row className="addressSearchNote text-center">
           <Col xs="7" className="text-left">
             Having trouble entering your address? <br />
diff --git a/src/App.css b/src/App.css
index 617ddfe28..f8de61663 100644
--- a/src/App.css
+++ b/src/App.css
@@ -173,11 +173,6 @@
 .addressSearchNote {
   color: #999999;
   font-size: 0.9em;
-  margin-top: 250px;
-}
-
-.addressSearchInput {
-  height: 50px;
 }
 
 .addressSearchButton {
@@ -318,7 +313,7 @@
   }
 
   .addressSearchNote {
-    margin-top: 250px;
+    /* margin-top: 250px; */
   }
 
   .title {
diff --git a/src/index.css b/src/index.css
index e882c2f7d..47c8f82e1 100644
--- a/src/index.css
+++ b/src/index.css
@@ -411,6 +411,7 @@ code {
 .addressSearchInputSection {
   margin-top: 30px;
   margin-bottom: 30px;
+  height: auto;
 }
 
 
-- 
GitLab


From f2a6ced4a7e73f0918aaba2c78aabc06f004ce55 Mon Sep 17 00:00:00 2001
From: RujitRaval <rujitraval@gmail.com>
Date: Tue, 3 Mar 2020 13:49:09 -0500
Subject: [PATCH 2/3] Change styles for mobile and tablet

---
 src/BuildingTypes.js    | 2 +-
 src/Fuels.js            | 2 +-
 src/HeatDistribution.js | 2 +-
 src/index.css           | 3 +++
 4 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/BuildingTypes.js b/src/BuildingTypes.js
index dae415112..26a4749ce 100644
--- a/src/BuildingTypes.js
+++ b/src/BuildingTypes.js
@@ -84,7 +84,7 @@ export default class BuildingTypes extends React.Component {
                 {
                   this.props.answerIds.map((answerId, id) => {
                     return (
-                      <Col xs="12" lg={{size: "4"}}>
+                      <Col xs="6" lg={{size: "4"}} className='add-margin-top'>
                           <div
                             className={this.state.answer === answerId ? "selectedButton" : "button"}
                             onClick={() => this.chooseAnswer(answerId)}
diff --git a/src/Fuels.js b/src/Fuels.js
index 41ec2aecf..1d45e072f 100644
--- a/src/Fuels.js
+++ b/src/Fuels.js
@@ -92,7 +92,7 @@ export default class Fuels extends React.Component {
                 {
                   this.props.answerIds.map((answerId, id) => {
                     return (
-                      <Col xs={{size: "12"}} lg={{size: "2"}}>
+                      <Col xs={{size: "6"}} lg={{size: "2"}} className='add-margin-top'>
                         <div
                             className={this.state.answer === answerId ? "selectedButton" : "button"}
                             onClick={() => this.chooseFuel(answerId)}
diff --git a/src/HeatDistribution.js b/src/HeatDistribution.js
index caace3de5..6a28c27b7 100644
--- a/src/HeatDistribution.js
+++ b/src/HeatDistribution.js
@@ -81,7 +81,7 @@ export default class HeatDistribution extends React.Component {
               {
                 this.props.answerIds.map((answerId, id) => {
                   return (
-                    <Col xs="12" lg={{size: "2"}}>
+                    <Col xs="6" lg={{size: "2"}} className='add-margin-top'>
                         <div
                           className={this.state.answer === answerId ? "selectedButton" : "button"}
                           onClick={() => this.chooseAnswer(answerId)}
diff --git a/src/index.css b/src/index.css
index 47c8f82e1..a6e865ca3 100644
--- a/src/index.css
+++ b/src/index.css
@@ -415,3 +415,6 @@ code {
 }
 
 
+.add-margin-top{
+  margin-top: 30px;
+}
\ No newline at end of file
-- 
GitLab


From c68b12c57024a93f503c21c82986430b5e776897 Mon Sep 17 00:00:00 2001
From: RujitRaval <rujitraval@gmail.com>
Date: Tue, 3 Mar 2020 13:55:56 -0500
Subject: [PATCH 3/3] Refactor the code

---
 src/App.css   | 4 ----
 src/index.css | 2 +-
 2 files changed, 1 insertion(+), 5 deletions(-)

diff --git a/src/App.css b/src/App.css
index f8de61663..42eef8fb0 100644
--- a/src/App.css
+++ b/src/App.css
@@ -312,10 +312,6 @@
     padding: 0 10% 0 10%;
   }
 
-  .addressSearchNote {
-    /* margin-top: 250px; */
-  }
-
   .title {
     font-size: 30px;
     margin-top: 25px;
diff --git a/src/index.css b/src/index.css
index a6e865ca3..8822ab2d7 100644
--- a/src/index.css
+++ b/src/index.css
@@ -417,4 +417,4 @@ code {
 
 .add-margin-top{
   margin-top: 30px;
-}
\ No newline at end of file
+}
-- 
GitLab