styling and optmize

src/components/Footer.js

@@ -9,13 +9,17 @@ import {
 
 const ContainerPadded = styled(Container)`
   padding: 7% 15%;
+  
 
 `;
 
 const WhiteSection = styled.footer`
     background: ${ props => props.background || "white"};
+    
+`;
+const ContainerCentered = styled.div`
+    text-align: center;
 `;
-
 const FacebookIcon = styled(Facebook)`
     margin: 20px 10px;
     width: 16px;
@@ -43,6 +47,7 @@ const Footer = (props) => {
     return (
         <WhiteSection>
             <ContainerPadded fluid>
+                <ContainerCentered>
                 <FacebookIcon />
                 <TwitterIcon />
                 <InstagramIcon />
@@ -51,7 +56,8 @@ const Footer = (props) => {
                 <p>© Copyright 2020 Locaft</p>
                 <p><a href="/tc">Terms and Conditions</a></p>
                 <p><a href="/pp">Privacy Policy</a></p>
-            </ContainerPadded>
+           </ContainerCentered> 
+           </ContainerPadded>
         </WhiteSection>
     )
 

src/components/HomePage.js

@@ -19,8 +19,8 @@ import { Bullseye } from "@styled-icons/fa-solid";
 import { StyledIconBase } from '@styled-icons/styled-icon'
 const IconStyler = styled.div`
   ${StyledIconBase} {
-    width: ${props => props.w ? props.w : 26}px;
+    width: ${props => props.width ? props.width : 26}px;
-    height: ${props => props.height ? props.height : 26}px;
+    height: ${props => props.height ? props.height : 26};
     color: ${ props => props.color ? props.color: "white"};
 
     
@@ -146,19 +146,22 @@ export default function HomePage() {
 
           <Row>
             <FeatureCol lg="4">
-              <IconStyler width={100} height= {100} color="#66bfbf"><CheckCircle /></IconStyler>
+              <IconStyler color="#66bfbf" width={50} height={50}><CheckCircle /></IconStyler>
+              <br/>
               <FeatureTitle>Easy to use.</FeatureTitle>
               <p>Get relocated.We'll take care of everything.</p>
             </FeatureCol>
 
             <FeatureCol lg="4">
-              <IconBullseye />
+              <IconStyler color="#66bfbf" width={50} height={50}><Bullseye /></IconStyler>
-              <FeatureTitle>Efficient</FeatureTitle>
+              <br />
+           <FeatureTitle>Efficient</FeatureTitle>
               <p>Get highest number of services for lowest cost possible.</p>
             </FeatureCol>
 
             <FeatureCol lg="4">
-              <IconHeart />
+              <IconStyler color="#66bfbf" width={50} height={50}><Heart /></IconStyler>
+              <br />
               <FeatureTitle>Relax</FeatureTitle>
               <p>Sit back , we'll do the dirty work.</p>
             </FeatureCol>